ファビコン(favicon)とは・・・ブラウザの上、URL部分の左に表示される画像
上の画像で言うと、蝶々の部分です。
このファビコンを作成する際、なかなか納得のいくものが出来なかったりしました。
しかも、拡張子「.ico」にするため画像を作成した後にソフトを起動して変更しなければいけなかったり・・・
面倒じゃありませんか？
背景を透過出来て、画像作成から出来るものを探した結果、PhotoshopのプラグインとFIreworksのプラグインを見つけました。
■ Photoshop編
Telegraphics – Free plugins for Photoshop & Illustrator…and other software
下にスクロールし、お使いのOSに対応したプラグインを選択します。
C:\Program Files\Adobe\Adobe Photoshop 【バージョン名】\プラグイン
に、入れます。
別名保存で「.ico」形式で保存して完了です！
■ Fireworks編
johndunning.comより、「ExportAsFavicon-100.mxp」をダウンロードします。
Adobe Extension Managerでインストールします。
そうすると、コマンドにFaviconが追加されるので、「New Favicon」の作成したいサイズ（16,32,64）を選択します。
ここで、faviconを作りコマンド→Favicon→Export as Faviconを選択して保存します。
これで完了です！
■プラスα（mac Lion）編
macで画像をico形式へ簡単に変換することも出来ます。
プレビュー.appで画像を開きます。
ファイル→書き出し→（Optionを押しながら）フォーマットを選択します。
ここで、Microsoftアイコンを選択して完了！
Photoshop、Fireworks、Macで作成したファビコンを比較してみます。
（すべて同じ画像を使用しました）
あれ〜？Fireworksで作った画像が汚いですね・・・・
色々調べてみます＞＜
最後に。
下記のソースの「〜パス」部分を修正して＜head＞～＜/head＞内に挿入。
これで完了です☆ミ