ネットサーフィンをしていると、アドレスバーの前についているかわいらしいアイコンに出会う事が増えました。
一体何なのかと気になったので調べてみるとファビコンというアイコンらしいのです。
ファビコンとは（wikiより引用）
ウェブサイトやウェブページに関連付けられたアイコンのことである。Favorite icon（フェイバリット・アイコン）という英語の語句を縮約したものである。
アヤタツもサイトにファビコンを導入してみた
favicon.icn Generatorというサイトで手書きで作成します。
小さくなってもわかるようにアヤタツ（AyaTatsu）の頭文字のAをイメージして作成しました。
英語訳が怪しい部分もありますが、ファビコンを作成するのに使用したものをそれっぽい意味で訳しました。
Create New Favicon キャンバスをリセットして新しいファビコンを作成します。
Import Image パソコン内の画像を読み取りファビコンの下書き用としてインポートできます。
transparent 透明にできます。
Pick existing color 色を真似ます。
move 作成中のファビコンをドラッグで移動できます。
Preview 作成中のファビコンを実際のサイズで見ることができます。
Download Favicon 作成したファビコンをダウンロードできます。
作成したファビコンをサイトに設置する
作成したファビコンをアップロードします。
ファビコンは.ico形式でアップロードする必要があります。
忍者ブログではどんな形式のファイルでも500kbまでアップロードできるので、ファビコンも問題なく導入できます。
テンプレートのソースをいじります。
<head>タグの中に<link rel="shortcut icon" href="
http://www.---/favicon.ico">を挿入します。
赤文字部分にはアップロード先のリンクを記入します。
実際に表示させるとこのようになります。
無事表示させることに成功しました。
ソースを挿入しても表示され倍場合はソースに問題があるかもしれません。
もしくは、古いキャッシュなどが残っていることが原因かもしれません。
一度キャッシュなどを削除してみるとうまく表示されるようです。
