faviconを追加しました

OGPとその画像について調べているのですが、その前にfaviconも設定した方が良さそうだと思い、設定してみました。

全部のパターンを網羅するのは厳しい

ひとまず自分がiPhoneなので、ホーム画面に登録する際使用されるアイコンが必要だということは知っていました（そんな人がいるかどうかはさておき）。ところが、こちらも今はデバイスの種別によって要求するサイズなどが異なるらしく、それらを全て自分で用意するのは大変です。

一つのファイルから一括で作成してくれるサイトは多々ありますが、とりあえず下記のサイトを利用しました。たくさんのパターンの画像を生成してくれます。またメタタグも利用できます。

様々なファビコンを一括生成。favicon generator

とはいえ、用意されたメタタグがけっこうボリュームがあるし、サイトルートにごちゃっとファイルを置くのがいやだったので、ひとまず以下のファイルを置くことにしました。

実際に使うファイル

ピクセル数は1辺あたりのサイズです。

• favicon.ico: 48px
• favicon.png: 192px
• apple-touch-icon.png: 180px
• apple-touch-icon-precomposed.png: 180px

favicon.ico はデフォルトでそれを取得しに来るブラウザがまだあるようなので念のため配置しました。 apple-touch-icon-precomposed.png というファイルもどのタイミングで利用されるのかよくわかりませんでしたが、アクセスがあるようだったので念のため配置しました。

ちなみに

これが192pxのfavicon.pngです。アイコンと呼ぶには大きい気がしますが、ブラウザ側でリサイズするんでしょうねたぶん。

ひとまず設定してみましたが、ないよりはある方が認識しやすいのでよいですね。