ファビコンとは？
ファビコン（favicon）はブラウザのタブやURLの前や表示される小さいなアイコンのことです。由来ですが、favicon＝favorite iconの略称となっています。（多分ですが）Internet Exproler全盛期時代「ブックマーク」の呼び方はfavoriteと呼ばれていました。日本語だと「お気に入り」ですね。「お気に入り一覧」に表示される際、視認性をアップするために利用されはじめたのがfaviconです。
ファビコンは、Webサイトごとに独自設定することができ、Internet Explorerはもちろん、Google Chrome / Safari / Firefoxなど、様々なブラウザのブックマークリストで表示されます。
ファビコンはサイトのトレードマークやシンボルマークの役割もあるので、有名なサイトならほぼファビコンを設定しています。
ファビコンのサイズ
ファビコンのサイズは 16px × 16pxと32px × 32pxが主要ですが、それ以上のサイズが必要なデバイスもあります。サイズは色々ありますが、ブラウザ用なら32px × 32pxでOKです。
16px × 16px：IEのタブ・アドレス欄用
24px × 24px：IE9のピン留め機能用
32px × 32px：Google Chrome、Firefox、Safariなどのタブ用
48px × 48px：Windowsのサイトアイコン用
64px × 64px：高解像度のWindowsサイトアイコン用
96px × 94px：Safari/ipad第二世代のトップページのブックマーク用
128px × 128px：Safari/iPhone5（iOS7）のトップページのブックマーク用
256px × 256px：iPhone5（iOS7）、iPad第二世代（iOS7）のホーム画面アイコン用
ファビコンのフォーマット
ファビコンは.pngや.gifの画像フォーマットにも対応していますが、ブラウザによっては対応していないこともあるため、アイコン用の画像ファーマットの.icoで作成します。.icoへの変換の仕方
.icoに変換するには、下記のような画像ファイル変換サービスを利用します。Photoshopでpngやgifでファビコン用の画像を作り、.icoに変換するのが手っ取り早い方法です。
ファビコンの設置の仕方
ファビコンを表示させるには、head部分に以下を記述します。link rel="shortcut icon" href="ファイルのURL"
ファビコン作成のポイント
1.シンプルなデザインにするブラウザ用のファビコンは32px × 32pxなので、複雑なデザインにすると綺麗に見えません。
ファビコンはシンプルな方が綺麗に見えます。
2.背景を透過させる
ファビコンの背景が白くならないように背景を透過させておきます。
3.反映されない時は？
ファビコンを設置して表示されない場合は、記述が間違っていないかチェックをする、記述が合っていればキャッシュをクリアしてリロード（スーパーリロード）してみましょう。
Chromeなら「Ctrl + F5、またはShift + F5（Windows）」「command + shift + r（Mac）」でスーパーリロードできます。
