自分のサイトを検索したら、アイコンのところが灰色の地球儀になっていました。
設定は何も触っていません。テーマも壊れていない。ブラウザのタブにはちゃんとアイコンが出ている。それなのに検索結果だけが地球儀のまま。
原因を追いかけた結果たどり着いたのは、半年前にやったメディアライブラリの整理でした。使っていない画像をまとめて削除したとき、サイトアイコンの元画像まで一緒に消していたんです。
ファビコンが検索結果から消える原因の多くは、ファビコンそのものではなく、WordPress側で画像が行方不明になっていることにあります。
しかも管理画面には何の警告も出ません。どこかが赤くなるわけでも、プラグインが異常を教えてくれるわけでもない。実害は出ているのに、サイトの内側からは見えない種類の不具合です。
やっかいなのは、この状態でもブラウザのタブにはアイコンが出続けるケースがあることです。テーマがファビコンを直書きしていると、そちらが生きているので気づけません。私の場合がまさにそれで、半年間まったく気づきませんでした。
この記事では、実際に起きたことをそのまま追いかけます。Googleがファビコンを持っているかどうかを確かめる方法、WordPress側で画像が消えているかを見分ける方法、そして復旧の手順です。
あわせて、調べる過程でひっくり返った思い込みについても書きます。ファビコンはICO形式でないといけない、と長らく信じていたのですが、Googleの公式ドキュメントを読んだらまったくそんなことはありませんでした。
灰色の地球儀が出たら、まずGoogle側の状態を確かめる
最初にやるべきなのは、自分のサイトを検索して目視することではありません。
検索結果の見え方は端末やタイミングで変わりますし、キャッシュも挟まります。もっと確実なのは、Googleがそのドメインのファビコンを持っているかを直接聞きにいく方法です。
ブラウザのアドレスバーに次のURLを打ち込みます。
https://www.google.com/s2/favicons?sz=64&domain=example.com
ここでアイコンが表示されればGoogleはファビコンを保持していますし、灰色や汎用の画像が返ってくるなら持っていません。
私が試したときは、www付き・www無しのどちらで聞いても汎用画像が返ってきました。つまりGoogle側にデータが無い状態です。比較のために大手サイトのドメインで同じことをすると、ちゃんとそのサイトのアイコンが返ってきます。ここで差が出れば、原因は自分のサイト側にあると切り分けられます。
逆に、ここでアイコンが返ってくるのに検索結果に出ないなら、単なる反映待ちです。ファビコンの更新はインデックスより遅く、数週間かかることも珍しくありません。この場合は待つのが正解で、いじると余計にこじれます。
Googleが正しく認識してくれないとき、原因が思いもよらないところに潜んでいるのはよくある話です。以前サーバー側の設定でインデックス自体が止まっていたことがありました。
関連記事:ブログがGoogleにインデックスされない!原因はホスティングサービスだった
犯人は半年前のメディア整理だった
WordPressのサイトアイコンは、専用の保管場所があるわけではありません。
普通の画像とまったく同じようにメディアライブラリへ登録され、設定側にはsite_iconという項目に添付ファイルのID番号だけが記録されます。画像の実体とIDが紐づいているだけの、ゆるいつながりです。
ここが落とし穴でした。画像を削除してもIDのほうは設定に残り続けます。参照先だけが空っぽになった、宙ぶらりんの状態です。
これを確かめるには、サイトのURLの末尾に/wp-json/を付けてアクセスします。JSONが表示されるので、その中から2つの項目を探してください。
"site_icon": 4258
"site_icon_url": ""
IDは入っているのにURLが空っぽなら、その添付ファイルはもう存在しません。これが決定的な証拠になります。正常なサイトなら、URLのほうにも画像のアドレスがきちんと入ります。
ではなぜ削除されてしまったのか。理由はシンプルで、サイトアイコンはどの記事の本文にも登場しないからです。
未使用メディアを探すプラグインや自作の判定は、たいてい「記事本文に書かれているか」「アイキャッチに設定されているか」を見ます。サイトアイコンはそのどちらにも引っかかりません。だから堂々と未使用リストに並び、そのまま削除されます。
そして画像が消えると、WordPressはファビコンのタグを一切出力しなくなります。これは仕様です。タグを書き出す関数は、サイトアイコンが設定されていなければ何もせずに処理を終えるように作られています。
本来なら次の4行がページに出るはずが、まるごと消えます。
<link rel="icon" href="..." sizes="32x32">
<link rel="icon" href="..." sizes="192x192">
<link rel="apple-touch-icon" href="...">
<meta name="msapplication-TileImage" content="...">
さらに、ルートの/favicon.icoも実体を返せなくなります。私のサイトでは中身が空っぽのまま「正常」を意味するステータスを返していて、これは404を返すよりたちが悪い状態でした。
ファビコンはICOでなければいけない、は思い込みだった
復旧しようとして、まず用意したのはICOファイルでした。ファビコンといえばICO、と刷り込まれていたからです。
この刷り込みには理由があります。かつてのInternet Explorerは、サイトのルートに置かれた/favicon.icoを勝手に取りにいく方式しか持っていませんでした。ファイル名も形式も固定で、それ以外に指定する手段が無かった時代の話です。
その後、HTMLのlinkタグで場所も形式も指定できるようになり、縛りは消えました。今のGoogleのドキュメントには、こう書かれています。
Your favicon must be a square (1:1 aspect ratio) that's at least 8x8px.
Any valid favicon format is supported.
正方形で8ピクセル以上あれば、形式はなんでもいい。PNGでもJPEGでもGIFでもSVGでも通ります。
ここで気になって、日本語で「ファビコン 表示されない」と検索して出てくる記事をいくつか読んでみました。すると「48の倍数でなければ表示されない」「ICO形式でないとダメ」と書いているものが複数あります。
公式を読む限り、どちらも正確ではありません。48を超えるサイズは推奨であって必須条件ではないですし、形式の指定にいたっては明確に否定されています。孫引きが繰り返されるうちに、推奨がいつのまにか必須にすり替わったのだと思います。
むしろ今はPNGのほうが実態に合っています。iPhoneやiPadのホーム画面に追加したときのアイコンはapple-touch-iconを見にいく仕組みで、ここはICOを一切参照しません。ICOで揃えても、その部分だけは別途PNGが必要になります。
ICOにも利点はあります。1つのファイルに16ピクセル用、32ピクセル用と複数サイズを詰め込めるので、小さく表示されたときの見え方を手作業で追い込めます。ただしWordPressのサイトアイコンは、サイズごとに別ファイルを生成してlinkタグで振り分ける方式なので、同じ目的をすでに果たしています。
復旧の手順と、権限エラーの正体
やることは1つだけです。管理画面の「外観」から「カスタマイズ」を開き、「サイト基本情報」の中にあるサイトアイコンへ画像を設定し直します。
用意するのは512ピクセル四方以上の正方形のPNGです。この大きさがあれば、WordPressが小さいサイズを自動で作ってくれます。
ここで私はつまずきました。手元にあったICOファイルを選んだところ、こんなエラーが出たんです。
このファイルタイプをアップロードする権限がありません。
文面だけ読むとユーザー権限の問題に見えますが、そうではありません。サイトアイコンはアップロード後に切り抜き処理を通す仕様で、切り抜けないICOは受け付けてもらえないというだけの話です。WebPやSVGでも同じエラーになります。
翻訳の都合で「権限」という言葉が出てきてしまうので、ここは引っかかりやすいところだと思います。素直にPNGかJPEGを用意すれば通ります。
どうしてもICOしか手元に無い場合は、REST APIから設定を直接書き換えるという逃げ道もあります。site_iconは外部から読み書きできる項目なので、画像をメディアに登録してからそのIDを流し込めば、カスタマイザーの切り抜き処理を通らずに設定できます。ただし手軽さでいえば、画像編集ソフトでPNGに書き出すほうが早いです。
設定できたら、トップページのソースを開いて先ほどの4行が出ているか確認します。/favicon.icoにアクセスしたとき、設定した画像へ転送されるようになっていれば成功です。
同じ事故を二度と起こさないために
今回いちばん怖かったのは、削除した瞬間には何も起きなかったことです。
サイトの表示は崩れず、エラーも出ず、管理画面にも警告は出ません。Googleが次にファビコンを取りにくるまで症状が現れないので、原因と結果が数か月離れてしまいます。これでは気づけません。
教訓は、未使用メディアの判定を本文とアイキャッチだけで済ませないことです。設定値から参照されている画像は、記事のどこにも出てこないのに現役で使われています。具体的には次のようなものが該当します。
- サイトアイコン
- ロゴ画像
- ヘッダー画像や背景画像
- OGP用のデフォルト画像
- プラグインが独自に保持している画像
メディアを大量に削除する予定があるなら、その前に/wp-json/を開いてsite_icon_urlを控えておくのが手っ取り早い保険になります。作業後に同じ場所を見て、値が変わっていなければ無事です。
削除は取り消せません。ゴミ箱を経由しない完全削除を使うなら、なおさら事前の記録が効きます。
ついでに書いておくと、サイト全体の点検項目としてファビコンはかなり優先度が低く扱われがちです。順位に直結する要素ではないので、後回しになるのも分かります。ただ検索結果での見え方には確実に影響するので、年に一度くらいは見る価値があります。
関連記事:SEO対策の基本チェックリスト|サイト全体を点検する最低限のポイント
まとめ
検索結果のファビコンが地球儀に変わったら、疑うべきはファビコンそのものではありません。
WordPressの設定に残っているIDと、実際の画像が食い違っていないか。ここを最初に見れば、たいていの場合は数分で切り分けがつきます。/wp-json/を開いてsite_iconにIDが入っているのにsite_icon_urlが空なら、それが答えです。
Googleがファビコンを持っているかどうかは、専用のURLを叩けば一発でわかります。持っていないならサイト側の問題、持っているのに出ないなら反映待ち。この2つを混同すると、直っているのに直っていないと思い込んで無駄に設定をいじることになります。
そしてファビコンはICOでなくて構いません。正方形で8ピクセル以上あれば形式は自由、というのが公式の見解です。ネット上には「ICOでないとダメ」と書いた記事がいくつも残っていますが、少なくとも今の仕様には合っていません。512ピクセル四方のPNGを1枚用意するのが、いちばん素直で確実な選び方です。
今回の一件で身にしみたのは、設定から参照されている画像の弱さでした。記事本文に書かれた画像は消せば即座に崩れるので気づけます。でも設定から参照されているだけの画像は、消しても静かなまま数か月経ってから牙をむきます。
メディアの棚卸しは容量対策として有効ですし、私も定期的にやります。ただ削除ボタンを押す前に、記事以外から使われている画像がないかを一度考える。それだけで防げる事故でした。
反映には数週間かかります。復旧作業が終わったら、Search Consoleでトップページの再クロールを申請して、あとは気長に待つのがおすすめです。