お気に入りアイコン（favicon.ico）の作り方
ブラウザでサイトにアクセスしたとき、アドレスバーの左側にアイコンが表示されることがあるのご存じですか？画像で説明すると下の図のようなやつです。
これは、このサイトのものですので、今見ている画面の左上にも同じように表示されていると思います。これが何も設定されていなければ、下のように表示されます。
また、ブラウザでお気に入り（ブックマーク）へ登録するとこんな感じになるので、他のサイトとの差別化にもなります。
それではアイコンの作り方ですが、ホームページビルダーを使っている皆さんは、付属のウェブアートデザイナーで、すぐに作れます。実際にブラウザで表示されるときのアイコンのサイズは、16×16ピクセルですが、作業がやりにくいので32×32ピクセルで作ります。
ウェブアートデザイナーで、「編集」-「キャンバスの設定」をクリックすると、「キャンバスの設定」ダイアログが開くので、幅と高さを「32」ピクセルと入力し「OK」ボタンをクリックします。
キャンバスのサイズが変わります。画面が小さすぎて作業がしづらければ「表示」-「拡大表示」から適当な倍率を選んで大きく表示して下さい。
後は自分の好みのアイコンを作ればいいのですが、あまりたくさんの色を使ったり、写真のような画像を使うと表示されたときになんだかわからなくなったり、うまく表示できない場合があるので、デザインはシンプルに徹して下さい。
アイコンができたら、「Web用保存ウィザード」でGIF形式かPNG形式にして保存しておきます。
先ほどのアイコンをファビコンアイコンに変換するためにこちらのサイトのツールを使わせてもらいます。
FavIcon from Pics
英語のサイトですが、画像をアップロードするだけなので誰でもできます。「参照」ボタンで先ほど作ったアイコンの場所を指定して、「Generate FavIcon.ico」ボタンをクリックするだけです。
できあがったファイルの中に「favicon.ico」というファイルがあるので、これをサーバーにアップロードして、ウェブページのソースの<head>と</head>の間に以下の記述を加えます。（ブラウザや環境によっては記述がなくてもfavicon.icoが表示されます）
<link rel="shortcut icon" href="favicon.ico" >
上記の記述で、アイコンのパスを変更すれば、任意の場所へアイコンのファイルを保存しておけます。また、ファイル名を変更してもOKですが、拡張子は.icoにします。
アイコンがうまく表示されない場合は、ブラウザをリロード（再読込）させたり、キャッシュ（インターネット一時ファイル）を削除してから表示して組みます。