はてなブログ開発ブログにて「faviconをGoogleのガイドラインに準拠するように変更しました」という記事が更新されていました。ただ私は「まずfaviconってなに？？」という状態。どんなものなのか調べたり、見直したり、結局もとに戻そうか検討したりの話。
faviconとは？
はてなブログ開発ブログの投稿
発端のはてなブログ開発ブログの記事はこちらです。
はてなブログでは、「ブログアイコン（favicon）」の仕様をGoogleのガイドラインに沿うように変更いたしました。（中略）
はてなブログでは、すでに「ブログアイコン（favicon）」機能を提供しており、利用者が任意の画像を設定することが可能でしたが、ガイドラインに沿わない点がありました。（後略）
とのことですが…そもそもfaviconが何かわからない。何がどうしてどうなったのでしょう？？普段開発ブログはたまに流し読みする程度なのですが、せっかくなので色々調べてみました。
faviconとは？
faviconについて検索したところ、はてなキーワードが引っ掛かりました。
FAVorite ICONの略で、ウェブブラウザのブックマーク(お気に入り)リストやウィンドウアイコン・タブなどに現れることのある、ウェブサイト独自のアイコン。(中略)
もともとはInternet Explorerの独自拡張として実装されたが、FirefoxやSafari、Operaなど他のブラウザも追従したので、事実上ウェブにおける標準のような扱いになっている。
これを読んで「あれのことか！」と思い至りました。こういうのですね。
お前だったのかー。確かに設定されているとなんのサイトかわかりやすくていいですよね。
開発ブログにも書かれている通り、はてなブログではfavicon イコール ブログアイコンとのことです。
よいfaviconとは？
開発ブログには、SEO対策とfaviconについて書いた週刊はてなブログのリンクもありました。
超初心者の私にもわかる範囲で重要なことは
- 表示されるのは正方形（48ピクセルの倍数で作成）
- 複雑なものにしない
- 一目でそのサイトとわかることが重要
といったところでしょうか。透過処理なんかはよくわからないのでパス。ひとまず「はっきりわかりやすいものが良い」ということですね。(詳しくはリンク先をご覧下さいませ)
このブログのfaviconについて
現状どうなっている？
開発ブログで「はてなブログでは、すでにブログアイコン（favicon）機能を提供しており～」とある通り、faviconは既存の仕様だったとのことです。…でもブログアイコンなんて登録した記憶がない。
しかし開発ブログに書かれている通りに設定画面を見てみると
設定していました！！そういえば、ブログ開設当初、よくわからないままにあちこちの画像設定画面でこのネモフィラを設定したのでした。ブログアイコンもあったのか。
さて、このブログアイコン＝faviconを色々なサイズで見てみると…
ことごとく小さくてよく見えません。黒っぽい画面に白っぽい何かが浮かんでいる…？という程度。視認しやすいfaviconとは言えませんね。
見やすいアイコンを作ってみた
週刊はてなブログでは、1文字を題材としたfaviconを無料で作れるサイトを掲載しています。
なんだか面白そうだったので作ってみることに。「とうつきの備忘録」なので文字を「と」、ブログでミントグリーンをよく使うので背景色に、サイズはよくわからないのでとりあえず縦48×横48。あとは文字のサイズを変えたり、光沢をなくしたり…。
完成品はこんな感じ↓
かなり適当にさくさく作ったのにかわいい！フリーフォントも丸っこくてかわいいです。見れば見るほど私の考えるfaviconっぽさが出ています。これぞfavicon。サイトの管理人さんありがとうございます。
作ったアイコンを設定してみた
せっかくなので、作ったアイコンをブログアイコン=faviconとして設定してみました。
しばらくすると、スマホから見たタブはこんな感じに。あとブログアイコンなので、ブログトップの○の部分も変わっていますね。
しかし、この辺は変わらず。あれ…？
ちょっと時間が掛かるのかもな、と思って設定した翌日、翌々日にも確認したのですが、変更されない。ううん？場所によって差があるんですかねー。
（2019.7.21追記）
ブラウザのタブのfaviconが変更されました！Googleのモバイル検索結果画面は相変わらず旧faviconのままです。
「私にとっての」よいfaviconとは？
週刊はてなブログの記事はSEO対策のためのもの
先ほどリンクを載せた週刊はてなブログで述べられている「よいfavicon」ですが、これは記事タイトルにもある通りSEO対策に重きを置いた記事です。SEO対策…詳しく調べたことがないのですが、検索流入を増やすためのアレですよね。たしか。Googleのモバイルからの検索で、ブログタイトル前にfaviconが表示されるから対策を、という話。でもこのブログは、現状SEO対策を頑張っていません。
モバイル検索の信憑性＜はてな上の繋がりのわかりやすさ？
確かにこのブログの来訪者数は、一部記事の検索流入がほとんどです。たぶん1つの記事が来訪者全体の6割くらい。それはそれですごい。
ただ、更新した記事を日々読んで下さるのはブロググループから訪れた方や読者の方なんだと思います。そうすると、モバイル検索したときに表示されるfaviconのわかりやすさより、はてな関連サービスから訪れる方にわかりやすい方がいいのかもしれません。
ブログアイコン=プロフィール画像がわかりやすい？
じゃあはてな関連サービスから訪れる方にわかりやすいって何だろうと考えると、「ブログアイコンとプロフィール画像が同じ」ことなのかなと思いました。
よく訪れるブログのブログアイコンは何となく覚えます。よくスターを下さる方のプロフィール画像も。その二つが同じなら、「あ、この画像よく見るな」→「よく読むブログの人だ/よくスターをくれる人だ」などと気付きやすく、交流しやすいのでは…!?と。
新しいfaviconをプロフィール画像にする？
ブログアイコンとプロフィール画像を揃えた方がいいなら、
- プロフィール画像を新しく作った「と」にする
- ブログアイコンを元の画像に戻す(もともとブログアイコンもプロフィール画像も同じネモフィラでした)
でしょうか。前者は自分の好みから考えると…うーん…。ブログアイコンが「と」なのはいいのですが、プロフィール画像が「と」…。本名は「と」に関係ないのでイマイチ自分感がありませんし、今のネモフィラの画像の方が気に入っています。
では後者？最初の方に書いた通り見づらさはかなりありますが、はてな関連サービスからのわかりやすさだけを考えるなら、ブログアイコンが込み合った画像でもそんなに困らないような気もします。
おわりに
とりあえずは、せっかく新しく作ったこともありますし、favicon=ブログアイコンを「と」に設定してみようと思います！
プロフィール画像はネモフィラのままにするので、ブログアイコン≠プロフィール画像となりますが、お試し期間ということで…。もし今後「こうしたい！」という希望が出てきたら、また変えたり、元に戻したりしてみたいと思います。
更新履歴
2019.7.21 ブラウザ上のfaviconが変更されたことを追記
