忍者ブログ

logo

ファビコンの作成とアップの仕方

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

ファビコンの作成とアップの仕方

ファビコン=Favorite Icon

Webサイトの上部のタブに表示されたり、お気に入りのブックマークで保存した場合に表示されたり、デスクトップにショートカットとして表示されるアイコンです。

作成

私は、イラレかフォトショで作成しています。それにプラスしてicoに変換するのに以下のサイトを利用しています。フォトショの場合はプラグインを入れてicoに変換することも可能です。
Favicon Converter http://favicon.qfor.info/c/
シンプルで使い易いです。
X-Icon Editor http://www.xiconeditor.com/
マルチアイコンが作成できます。またデザインの編集も可能です。

画像形式

ICO
PNG,GIFでも作成できますが、ICOで作成するのが無難です。(IEでは、ICOのみ対応している為)
GIFアニメーション
現在は、Firefoxでしか対応していません。あまり重くならないように気をつけてください。

サイズ

下記は基本的な値で、カスタマイズされた場合等はサイズが異なる場合があります。
16x16: ブラウザのアドレス欄やタブ
32x32: デスクトップ上のショートカット
24x24: IE 9のピン留
*大きめの画像で作成すると画像が自動で縮小されるので、画質が悪くなる場合があります。
マルチアイコン
その他、複数のサイズを1つのico形式にまとめて作成することも可能です。X-Icon Editorは、マルチアイコンが制作可能です。

webでの設定の仕方

<ヘッダー></ヘッダー>内に、
<link rel="shortcut icon" href="ファビコン名.ico">
を記述。
PR

忍者カウンター