faviconの作り方
このサイトでもfaviconを作って設定してみた。
faviconとは、Webサイトのお気に入りアイコンのこと。
wikipediaのfavicon説明ページ
自分のお気に入りのWebサイトの中で、
サイト名やURLの前にアイコンが表示されているものがあるはず。
そのfaviconの作り方と設置方法の紹介。
1.画像編集ソフトを使って好きなデザインでfaviconを作る。
ファイル形式はPNGまたはgif形式、大きさは16×16。
2.作成した画像をico形式に変換する。
以下のサイトで画像ファイルをアップロードするとico形式に変換してくれる。
http://www.chami.com/html-kit/services/favicon/
フリーの画像変換ソフトをダウンロードして変換してもよい。
3.メインページにicoファイルへのリンクを記述する。
htmlのheadタグ内に以下のソースを記述する。
hrefにicoファイルのパスを記述する。
絶対パスでも相対パスでもどちらでもよい。
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
4.htmlとicoファイルをアップロードする。
icoファイルをルートに置くと、ブラウザによっては全てのページでアイコンを表示してくれる。
以上。
ここまでやってfaviconが表示されない場合は、ブラウザのキャッシュやクッキーを削除してみよう。
ちなみに、このサイトのfaviconが表示されていない方も、
ブラウザのキャッシュやクッキーの削除で表示されるはず。
コメントする
(初めてのコメントの時は、コメントが表示されるためにこのブログのオーナーの承認が必要になることがあります。承認されるまでコメントは表示されませんのでしばらくお待ちください)