faviconを作ってみた。
ブラウザのアドレス入力欄やブックマーク一覧に表示される例のアイコンだ。
特に必要性も無いし、もともとは(僕も嫌いな)IEの独自仕様だし、
わざわざ手間かけて作ることも無いんだけど、
結構キレイなアイコンを作ってるサイトが多いことに気付いて、
ちょいと試しに作ってみようかと。
まずは画像編集ソフトを使って、アイコンに使用するための絵を作る。
それぞれ32x32と16x16の二つのサイズを作成。
![uribou[16x16] uribou[16x16]](http://lab.uribou.net/blog/media/1/20061028-favu16.gif)
[uribou.net]
![uriblog[16x16] uriblog[16x16]](http://lab.uribou.net/blog/media/1/20061028-favb16.gif)
[uriblog]
![uridev[16x16] uridev[16x16]](http://lab.uribou.net/blog/media/1/20061028-favd16.gif)
[uridev]
![uriphoto[16x16] uriphoto[16x16]](http://lab.uribou.net/blog/media/1/20061028-favp16.gif)
[uriphoto]
![uribouMAPS[16x16] uribouMAPS[16x16]](http://lab.uribou.net/blog/media/1/20061028-favm16.gif)
[uribouMAPS]
これらの画像から、アイコンファイルを生成する。
以下の二つのツールを試してみた。
FavIcon from Pics -- how to create a favicon.ico for your website
@icon変換 - 画像とアイコンの相互変換ツール
一つ目のはWEB上のサービスで気軽に使えるのが嬉しいんだけど、
マルチアイコン(複数のアイコンを一つのファイルにしたもの)が作れない。
32x32と16x16の二つのサイズを入れたアイコンファイルにしておくと、
アドレスバーなどには小さいアイコン、デスクトップなどには大きなアイコン、
を表示してくれるようになり、見栄えが良い。
というわけで、今回、アイコンファイル生成には
二つ目の「@icon変換」っていうWindows用フリーソフトを使わせて頂いた。
あとは、作ったアイコンファイルをfavicon.icoという名前で
アップロードして、HTMLのヘッダ部に以下のような記述をしてやれば作業完了。
<link rel="shortcut icon" href="(アイコンファイルのURL)">
[Firefoxのアドレス入力欄]
[Firefoxのブックマーク一覧]
[IEのお気に入り]
[デスクトップ]
うん、なかなかよろしい。自己満足。
ボクも作ってみたいなぁ。
グズなんで全然手が着かないですが(笑)