2011年5月28日土曜日

ファビコン(タイトルのアイコン)の作り方

サイト上部のタイトルの左にあるアイコンって、ファビコン(favicon)って言うんですね~。
最初「ファミコン?」って聞き返しちゃいました。
で、本サイト(http://miigle.lolipop.jp/)にファビコンを設定してみました。
これが結構簡単に作れるんですよ。

1. ファビコン用の画像を作成する
ファビコンで使用する画像を作成します。サイズは問いませんが、正方形である必要があります。作成した画像は、GIFやPNG形式等で保存しておきます。
2. ファイル形式を変換する
作成した画像は、ファビコン用の形式に変換する必要があります。アイコン作成ソフトでも変換できますが、ここではFavIcon from Pics(変換サイト)を利用して変換することにします。このサイトで変換したファイルはzip形式でダウンロードすることになるので、それを解凍して使用します。
3. ファビコンファイルをアップロードする
作成されたファビコンファイル(favicon.ico)を、サーバーにアップロードします。
4. タグの設定
ページの <HEAD> ~ </HEAD> 内に、LINKタグを設定します。

という流れ。
もとの画像はサイズはどんなんでも良いと言うことなんですが、出来上がったときイメージが違ったりするので、最終サイズ(16ピクセル×16ピクセル)で作ったほうがいいかと思います。
上記2のサイトは英語ですが、そんなに難しいことはありませんでしたよ。
設定方法は、ダウンロードしたzipフォルダーにもRead meファイルで添付されてます。


手順の詳細(日本語)および参考にしたサイトはこちら
http://www.tagindex.com/hp_guide/img/favicon.html

0 件のコメント:

コメントを投稿