2012.11.24 追記

Internet Explorerでいつまでたってもファビコンが反映されないため、さすがのわたしも気づきました。(遅っ)
以下、Internet Explorerでも反映される作り方

  1. 48ピクセル四方の画像を作り、png、gif、jpg形式で保存
  2. ファビコンアイコンを無料で作れるサイト(「favicon.icoを作ろう!」、「favicon.ico Generator」など)にアップロードし、ダウンロード
  3. ルートディレクトリにアップロード

ちなみに、このサイトは3種類のマルチアイコンにしてみましたが、マルチにする恩恵に関しては不明。デスクトップに画像を保存でもしてみんことには、今のところはでかいサイズの意味がないカモ、カモ。

ちなみに、以下ブラウザは、専用サイトで作らなくても、IllustratorやPhotoshopで作ったまんま、favicon.icoという名前をつけて、ルートディレクトリにアップロードすればOK、デス、いやしかし、IEでしょ、IEに反映されなきゃ、でしょ。

  • Google Chrome
  • Safari
  • Firefox
2011.1.11

ホームページ作成にあたり、お客さまからお預かりしたロゴマーク。
ファビコンアイコンを、Illustratorだけで作ることができました。
showmone.comのファビコン 2011年1月12日 by Illustrator showmone.comのファビコン 21px四方 showmone.comのファビコン 実物大

  • 16ピクセル四方を拡大して描画
    (ロゴがシンプルなので、16ピクセル四方にしました)
  • [Webおよびデバイス用に保存]-png8(透過)-ファイル名はfavicon.ico
  • ルートディレクトリにアップロード
  • ヘッダーに追記 link rel=・・・(略)
  • ブラウザに表示されたファビコンを確認しながら、Illustratorで形を調整

Internet Explorerは、履歴を削除したものの、過去の記憶にまだとらわれている模様。
ファビコンアイコンは表示されません。(いずれ表示されることでしょう)

追記

お預かりしたロゴは、ファビコンアイコンにすると美しくない上に読みにくいので、作りなおしました。
36ピクセル四方です。 ちらうら蚤の市のファビコン 2011年1月12日 by Illustrator ちらうら蚤の市のファビコン 27px四方 ちらうら蚤の市のファビコン 実物大