« ハウルの動く城 | トップページ | ヨドバシカメラの福袋 »
favicon を作ってみる
今日は、以前から作ろうと思っていた、ブラウザーのアドレスバーやブックマークに表示されるアイコンであるfaviconを作ってみました。
画像のデザインはサイトのタイトルで大文字と小文字を"GaysiteCafe"というようにしているので"GC"にしようかな～と思ったけど、任天堂GameCubeみたいなので却下（いや、誰もそう思わないとは思ったけど…）。"GSC"の3文字とすることにしました。
画像のフォーマットは、pngで32px*32pxの画像をアップロードし、htmlに<link rel="icon" type="image/png" href="***.png" title="***">（pngの場合・*は任意）を追加すれば良いそうですが、FireFoxではアドレスバーの部分には無理やり16px*16pxのサイズに圧縮した画像になって粗くなるしブックマークの部分に関しては左上16px*16pxしか表示しない、InternetExplolerが対応していないと言う問題があるので、Windows icon ファイルを"favicon.ico"というファイル名でアップロードし、htmlに<link rel="shortcut icon" href="favicon.ico">と追加することにしました。ネットで検索してみたらChami.comと言うサイトのFavIcon from Picsのページで32px*32pxの画像を変換して楽チンに変換できると言うので試してみましたが、どうもボケた感じになってしまったので却下。今回はtowofu's SOFTで公開している、画像とアイコン(*.ico)の相互変換を行うフリーウェア「@icon変換」（Vector登録ソフト）を使用することとしました。ダウンロード・解凍後、「@icon変換」を起動して32px*32pxと16px*16pxのそれぞれ用意た画像を「素材ファイルを開く」で選択、「単独iconとして保存」を選び"favicon.ico"のファイル名で保存＆アップロード、htmlの追加をし、FireFoxで"http://inu.s1.xrea.com/"を開くとアイコンが表示されました。感動！！
でも、完成してからよくよく考えると、アイコンなのに"GSC"の文字を画像にしただけじゃセンス無いなぁ…と思ったり。気が変わったら変更するかもしれませんが、とりあえず満足。