いつの頃からか、Google様で定番になった検索結果でのファビコン表示。
スマホ上のいわゆるモバイル検索では常にサイトアイコンが表示されているけれど、なんだかPCのブラウザでは表示されるときもあったりなかったり不安定。
キーワードによるのかはたまたユーザーによるのか、Google様も鋭意実験中といった感じかな。
当ブログでも当然以前から設定はしていたんだけど、なぜか長らくモバイル検索にすら例のデフォの地球儀マークしか出てこなくてね。
ファビコン表示されない問題がこれだったんじゃね？っていう当ブログ「固有の」原因があったようなのでそのお話。
※ちなみに決して以下が正解の解決方法！とは思っていないけれど、偶然にしてもタイミング良すぎたので対処法のひとつとしてメモ。
何も設定していないとどうなるか
現状で当ブログは「はてなブログ」を使用しているんだけど、何もファビコンを設定していないと検索結果のページに出てくるのはこういう状態。
いわゆる初期状態(未設定)であることを示す地球儀マーク。っていうか最初何のマークなのかイマイチ分からなかったｗ
(なおこれは旧ドメインのころの話なので、今とはサイトURLが違うけれど。)
はてなで設定する場所は？
そもそもも、はてなブログユーザーならおそらく誰もが普通に設定していると思うんだけど。
場所は基本設定の中。
このブログアイコンにjpegなりpngなりを設定すれば、検索結果のみならず、本来のファビコン用途としてブラウザタブだったり、
あるいはスマホのホーム画面にサイト追加したときに、設定したアイコンが表示されるようになるわけよ。
と、、まぁここまでは普通の話。
しかし待てど暮らせど表示されない
いや、そりゃ設定したからってすぐに反映されないのは知ってたさ。
でもハッキリ言って開設当初というか、現状のブログアイコンに限って言えばむしろ軽く数か月以上前から設定していて。
※っていうか当然ファビコンとしてブラウザのタブにはかねてから表示されていて。
なのに他のはてなブロガーのは検索画面に表示されてて、自分のサイトのファビコンが表示されないってのはなんなのかと。ユーザーによるんかと。
当時は独自ドメインじゃなかったわけだけど、当然デフォの無料ドメインでも表示されている人はわんさかいて謎。
んでブログ立ち上げたばかりならまだしも運営歴は年単位だし、アクセス数に関しても日々一定数の人が来るわけで。一体なんの基準やねん？っていう。
ただし気になる点として、インデックスはされているものの基本的に更新頻度はまばらというか当時かなり開いていたんだよね。ってことは、アイコン画像をいわゆるクローラーが読みに来ないと始まらないわけで。
そこでさっそくポチポチ新しい記事をアップしてサーチコンソールでURL検査でもしてみれば、そりゃすぐに記事自体はインデックス登録されるわけさ。
でもいつまでたっても相変わらずデフォの地球儀ファビコン。深まる謎。。
タグ上はどうなっているのか？
なぜ私のサイトがファビコン表示されないのか確かめるべく、まずはHTMLソースを見てみることに。そしてはてな上でブログアイコンに該当するのはここ。
<link rel="shortcut icon" href="https://www.example.org/favicon">
<link rel="apple-touch-icon" href="https://cdn.image.st-hatena.com/image/apple_touch_icon/○○○">
<link rel="icon" sizes="192x192" href="https://cdn.image.st-hatena.com/image/square/○○○">
自動的に3つのlinkタグが設定されて、どれもアクセスすればアイコンが表示されるし、
例えば一番上のshortcut iconではドメイン直下にfaviconというファイル名(拡張子なし)で設定した画像が置かれている。
まぁ一番上は今やレガシーな書き方だけど、でもこれで十分機能するはずなのよ。なのにこれをクローラーが読みに来れんとしたらなんのかと。
念のため自分でも、スタンダードな書き方でファビコンを明示しておくべく、はてなの「headに要素を追加」の部分にlinkタグを書き込んでおく。
画像(私の場合はpng)をフォトファイルにアップしつつ、そのURLをhrefに。
<link rel="icon" type="image/png" sizes="192x192" href="https://cdn-ak.f.st-hatena.com/images/fotolife/○○○" />
そもそも自身のサイトURL直下ではないところにファビコン置くのがスタンダードか？という疑問があるわけだが、まぁおまじないとして。
っていうかこんな追記なんてしなくても他のはてなブロガーのサイトでは検索にファビコン出てるしね。
んでんで、こんなことをしている時にふと、ある記述を発見してしまったわけよ。
あれ、もしやこれが何やら悪さしてないか？っていう。
おそらくこれが原因っぽい
先ほどの「headに要素を追加」の部分に色々とスクリプトなりを書き込んでいるわけだが、クローラーの動作制御のためにmetaタグも書いてあってね。
それがこちら。
noindexとかnofollowは使う人もいるだろうけれど、私が当時設定していたのはこれ。
<meta name="robots" content="noarchive, noimageindex" />
noarchiveはサイトを常に最新状態で公開したいってことでキャッシュ拒否していたんだけど、あわせて書いていたのはnoimageindex。
つまりGoogleの画像検索とかでサイト内の画像を表示させないっていう表記。
なんとなーく、勝手に画像拾われて転載とかされるの嫌だなぁって思って昔から設定していたんだけど。
これは仮説として
noarchiveはまだしも、noimageindexって要はクローラーに対して、うちのサイトの画像を検索エンジンに載せんなや！って指示なわけで、
とするとファビコンも所詮は画像ファイルな以上、検索結果におけるファビコン表示に影響があるんじゃないかっていう話。
ただイマイチ腑に落ちない部分もあって、例えば有名サイトで言えばインスタなんかはnoimageindexが設定されているわけよ。
にもかかわらず、モバイル検索ではきちんとファビコンが表示されている。
ただしインスタの場合は、ファビコンがまぎれもなくドメイン直下に置かれているし、pngに限らずicoファイルも設定されているけどね。
対して原理的に、はてなブログではユーザーがドメイン直下にそのままファイルを置いたりできないし、当然icoも設定できないわけで、
これらが独自に書いていたnoimageindexと相まって、Googleのクローラーにとってはデフォの地球儀しか表示できないことになっちゃってるんじゃないかと思ったわけ。
というわけでnoimageindexをはずして、再びサチコからURL検査などしつつしばし待機。。
それから程なくしてついに！
なんとなくファビコンの存在なんか忘れて数日たったある日。ようやく！！
やっとモバイル検索にファビコン出てきたーーーー！！
これが前述のmetaタグの修正から、正確にどのくらいで反映されたのかは不明だけど、少なくとも当日には表示されていなかったはず。
以上のことから、はてなブログでnoimageindexを設定していると、検索結果におけるファビコン表示にも影響あるっていう説が濃厚な結果に。
ただしもちろん偶然とも取れるけれど、さすがにアイコン画像は現状と変わらず設定していたにもかかわらず、
クロール＆記事インデックスされても数か月デフォの地球儀だったものが、タイミング良く表示されるようになったってのも可能性低いと思うんだけどねぇ？
というわけで、万が一私と同様にはてなブログを運営されていて、検索にファビコン表示されんやんけ！と悩んでいるかたは、一度自身のheadタグ内の記述を確認してみるのもいいかもしれないよ。
