favicon をご存知でしょうか。当ブログにも設定してあるのですが、要するにコレ→
ブラウザの種類・設定にもよるのですが、アドレスバーの左隅などにこのアイコンが表示されていると思います。
これを自分のサイト独自のものにしておくと個性が演出されて少しカッコイイのではないか、という話です。また、ブックマークに入れた場合もこのアイコンが表示されますので、識別しやすくなります。余談ですが、私は最近までこの favicon の語源が fabulous な icon（オシャレなアイコン ）だと思っていました。もちろん、正しくは favorite icon の略です。良く見ると（というかどう見ても） b ではなく v なのでした。あー、恥ずかしい～。
さて、「一番簡単な方法」ですが、「@icon変換」というソフトを使います。
まず、ソフトは何でも良いので16×16ピクセルの bmp を作ります。次にその bmp を、「@icon変換」で読み込みます。そして、左ペインで読み込んだ画像をクリックして選択し、編集→透過マスクの編集 をクリックします。
スクリーンショットを見ていただけるとお分かりのように、このようにして「透明にするペン」で透過させたい部分を塗りつぶします。
あとは OK ボタンを押して編集を適用し、ファイル→単独アイコンとして保存 です（ファイル名は favicon.ico にします）。
これで favicon は完成です。これをあなたのサイトに表示する方法はいくつかありますが、一番簡単なのは、favicon.ico を適当なディレクトリに置き、全てのページの<head>～</head>の中に
<link rel=”shortcut icon” href=”./favicon.ico”>
を追加する方法です。（./favicon.ico は置いた場所によって適宜変更してください）
大量の html に上のような一行を追加するには、「Repl-Ace」が便利です。ブログの場合はテンプレートに追加します。
「@icon変換」を使う意味は二つ、一つは透過の設定が非常にスムーズに出来ることです。もう一つは .bmp と .ico は実質的に同じもので、事実 Windows 上では拡張子を書き替えただけでビットマップをアイコンとして使えるのですが、実はファイル内部の情報が少し違っていて全く同じというわけでもないのですね。「@icon変換」なら、両者を瞬時に変換可能なわけです。
