【HTML5】faviconの設置方法

Webサイトの顔になるファビコンを設置してみましょう。

faviconはブックマークのアイコンになったり様々なサイズが必要となりますが、ico形式なら複数のサイズのデータをひとつのファイルにまとめることができます。大変おすすめです。

ファビコンにしたい画像を用意します。pngかjpgがいいと思います。ましかくじゃなくてOKです。
次にX-icon Editorへ行き、Importボタンで先ほどの画像を読み込みます。エディターになっているので直接描いてもいいみたいですが私はいまのところやっていません。必要な個所をましかくにドラッグして選択し、Exportでico画像をゲットしてください！

head内のタイトルの下あたりに以下を追加。パスは適宜変えてください。

WordPressの場合もテーマ内にico形式の画像を置き、そこへのパスを書けばOKです。また、サイトのルートディレクトリに「favicon.ico」という名前で置いておくだけでもいいです。

自分のサイトにファビコンを設置して、変わったかな～と楽しみに待つと、キャッシュが残っていていつまでたっても変わらない！という事態に直面したので、今度はキャッシュのかなり残りやすいChromeのファビコンのキャッシュの消し方をお送りします。