- faviconはpcサイトを作るうえで必須。
- faviconがないと、ブラウザの表示が遅くなる。
- faviconには専用の拡張子「.ico」を使う。
- .ico ファイルには複数のサイズのデータを格納できる。
- photoshop CCだと、プラグインを使って「.ico」に変換できる。
- cc以外では、変換用のツールを使う。
- http://ico.bradleygill.com/index.php
- 「browse」ボタンで変換したいファイルを選ぶ。
- 完成したアイコンをクリックして、ダウンロードする。
- ファイル名を書き換える。通常は「favicon.ico」。
- 「include large icon」にチェックすると48px*48pxのアイコンが作れる。
- 32px*32pxのサイズを用意しておけば、必要十分。
- 形は自由。不要な部分は透過にする。
- 小さいサイズの表示は、ブラウザが変換して対応する。
- 現在、一般的には16px*16pxで表示されることを念頭に、デザインを考える。
- コントラストを上げる、細かな線を使わない、など。
- faviconはindexと同じ、最上位の階層に保存する。ブラウザは、とにかくfaviconを探すので、すぐに見つかるところに置いておく。決して、imgフォルダに入れない。
- 同じサーバーにある他のフォルダにもfaviconを用意しておかないと、ひとつのファイルを勝手に共用されてしまうので注意。
- <link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.ico"/>
- 記述の後半は「IE」対応ということでした。
