favicon はサイトで最も小さなファイルであり、最も人目に触れるものの 1 つです。Google はモバイルの検索結果すべてのとなりに表示し、ブラウザーはタブとブックマークに表示し、リンクのプレビューはフィードやチャットアプリに引き込みます。欠けていたり、誤ったサイズで配信されていたりすると、競合と並んだときに検索結果が未完成に見えます。
Sorank の Favicon 抽出ツールは、任意のページを取得し、そこで宣言されているすべてのアイコンを、サイズ、形式、正確な URL とともに一覧にします。
このツールが見つけるもの
サイトはアイコンを複数の場所で宣言しており、それらが一致していることはめったにありません。このツールはそのすべてを読み取ります。
- head の link タグ：古くからある
rel="icon"とrel="shortcut icon"の宣言を、ページが記載しているサイズと形式のまま読み取ります。 - Apple のタッチアイコン：
rel="apple-touch-icon"で、iOS のホーム画面にサイトを追加したときに使われます。 - ウェブアプリマニフェストのアイコン：
manifest.jsonの中の icon 配列で、Android やインストール可能なウェブアプリが使います。 - ルートの代替：
/favicon.icoで、宣言の有無にかかわらずブラウザーが要求します。
検索にとって重要な理由
Google はモバイルの検索結果に favicon を表示しており、その要件を公開しています。ファイルは 48 ピクセルの倍数の正方形であること、クロールできること、そして汎用的な図形ではなくブランドを視覚的に表すものであることです。favicon が欠けていたりブロックされていたりすると、検索結果には空白の枠が残り、検索ユーザーがどこをクリックするかを選んでいるまさにその瞬間に注目を失います。
自社のドメインで確認する価値のある点が 3 つあります。
- 48 ピクセル以上のアイコンが実際に配信されていますか。16 ピクセルのアイコンを拡大したものは、検索結果でぼやけて見えます。
- ファイルにクローラーが到達できますか。robots.txt のルールの後ろにあるアイコンは取得できないため、表示されません。
- 宣言どうしが一致していますか。head が 1 つのファイルを指し、マニフェストが別のファイルを指していると、場所によって違うアイコンが表示されます。
実際の使い道
- リニューアル後の自社サイトの点検に。すべてのサイズが作り直され、古いアイコンが参照されたままになっていないかを確認できます。
- 比較ページやディレクトリの制作に。各項目にきれいなブランドアイコンが必要な場合に役立ちます。
- 競合の設定の確認に。どのサイズと形式を公開しているかがわかります。
- リンクプレビューの調査に。チャットアプリやフィードが自サイトのページに誤ったアイコンを表示するときに使えます。
