ファビコン favicon.ico ファブアイコン作成。無料でブックマークアイコン、透過マルチアイコンが作れます。

ファビコン favicon.icoを作ろう!

ウェブブラウザで、URLのとなりに表示されているアイコンがfaviconです。
16x16と32x32と48x48ピクセルのマルチアイコンが簡単に作れます。ブックマークアイコンを作りましょう。
作成したファビコンの画像はプレビューで確認できます。詳細データ表示付き。作り方は簡単!画像を指定するだけ。

 半透過マルチアイコンが作成できる業務にも使えるプロ仕様のアルファチャンネル対応版はこちら。≫ 
16x16用画像ファイルを選択
 
32x32用画像ファイルを選択
 
48x48用画像ファイルを選択
 
指定できる画像タイプは PNG , GIF , JPG(JPEG) です。
拡張子でファイルタイプを判別していますので、拡張子付きのファイルを指定して下さい。拡張子の大文字小文字は問いません。
指定できるファイルは200KB以下です。
今までに作成頂いた数:644837
指定した大きさの画像がアイコン内に作成されます。
サポートしている元画像のファイルタイプはPNG,GIF,JPG(JPEG)です。
PNG24bitの半透過画像を指定すると画像が乱れる場合があります。8bit(インデックスカラー)を指定してください。
半透過も綺麗に再現したい場合は http://ao-system.net/alphaicon/ をご利用ください。
透過画像のアイコンを作成する場合は、透過情報の有る丁度のサイズの画像を指定します(インデックスカラーのPNGまたはGIF)。

16x16の画像のみ作成する場合は、小画像(16x16)に画像を指定して下さい。(シングルアイコン)
32x32の画像のみ作成する場合は、中画像(32x32)に画像を指定して下さい。(シングルアイコン)

同時に複数画像を指定すると、マルチアイコンとなります。
小画像(16x16)と中画像(32x32)に画像を同時に指定すると2サイズのマルチアイコンになります。
小、中、大画像すべてに同時に画像を指定すると、3サイズのマルチアイコンになります。
それらの画像は、それぞれ違う画像を指定しても、同じ画像を指定してもかまいません。

指定する画像サイズが作成する画像サイズと違う場合は、サイズが自動的に調整されます。ただし、この場合透過情報は失われます。

きれいに作るコツ:
丁度のサイズの画像を用意し、その画像を指定して下さい。
16x16と32x32の2サイズマルチアイコンを作成する場合は、16x16の画像と32x32の画像の2つを用意して、同時に指定して作成します。
透過アイコンを作成する場合は、丁度のサイズ画像を指定することが必須です。

メモ:
ウェブブラウザ表示目的では小画像(16x16)が必要です。このサイズの画像が含まれていなくてもブラウザが自動で縮小表示しますが、一部のブラウザでは画像が表示されない様です。
32x32画像しか持っていない場合は、中画像と小画像にも同じ画像を指定します。
favicon(ファビコン)とはウェブサイトやウェブページに関連付けられたアイコンのことです。ウェブブラウザではURLの左横に表示されています。
お気に入りに登録するとブックマークアイコンとして表示されます。
faviconは日本では「ファビコン」と読まれることが多いです。Favorite icon(フェイバリット・アイコン)の略なので、英語ではファブアイコン(Fav-Icon)と読まれます。
多くのウェブブラウザがこのファビコンに対応しており、ブックマーク(お気に入り)リストやアドレス表示、タブブラウザではタブにファビコンが表示されます(ブックマークアイコン)
ファイル形式はICOが一般的です。最近になって、GIFやPNGもサポートされてきました。
ファビコンのウェブブラウザでの表示では16x16サイズですが、デスクトップにショートカットを置いた場合は32x32、エクスプローラーでアイコン表示にした場合48x48サイズでの表示になります。
ファビコンはICO形式であれば、16x16と32x32と48x48の3つのアイコンを一つのファイルに格納する事が出来ます。これをマルチアイコンと呼びます。
マルチアイコンは画像が2,3個に限らず4個5個の格納も可能ですが、Windowsでは16x16と32x32と48x48の3種類を使用します。それぞれ全く違う画像を格納できます。

ファビコンは通常、ウェブサーバーのドキュメントルート(ドメインのルート)ディレクトリに favicon.ico を設置すれば認識されます。
ファビコンをルートに設置できない場合、また、ディレクトリごとで違うfaviconを表示させたい場合は<head>セクション内に以下の記述をすることで指定できます。(URLは適宜変更して下さい)

<link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">

ドキュメントルートにfavicon.icoを配置する場合:
<link rel="shortcut icon" href="/favicon.ico" type="image/vnd.microsoft.icon">
<link rel="icon" href="/favicon.ico" type="image/vnd.microsoft.icon">

ファビコンをhrefで指定する場合は、アイコン名はfavicon.ico以外も使用できます。
typeの指定は、ICO形式の場合はimage/vnd.microsoft.iconを使用します。(互換性の問題その他で、image/x-iconを指定する場合もあります)
GIF形式はimage/gif , PNG形式はimage/png を指定します。

ファビコンを初めて設置した直後はすぐには表示されない場合があります。何度かリロードしたり、キャッシュを削除してみてください。
faviconを更新した場合は古いキャッシュの削除が必要な場合があります。また、ブックマークに登録して下さい。
履歴を削除すると表示される場合もあります。
InternetExplorer7でのキャッシュ削除方法は、メニューのツール-インターネットオプション-閲覧の履歴-削除-インターネット一時ファイルの削除です。
このサイトはWindowsXPを基準に作成されています。マッキントッシュの場合は画像のサイズなどに違いがあります。

このサイトのfavicon.icoは、3サイズのマルチアイコンになっています。
(16x16) (32x32) (48x48) このように違う画像を一つのアイコンに含めることが出来ます。
ショートカットをデスクトップに置いてみてください。32x32サイズの画像が表示されます。またはエクスプローラーでアイコン表示です。
エクスプローラーで並べて表示、または縮小版で表示させると、48x48の画像を見ることが出来ます。
(古いfavicon.icoのキャッシュが残っている場合、このように表示されない場合もあります。)
このサイトについてのお問い合わせはエーオーシステムまでお願いいたします。
ご使用上の過失の有無を問わず、本プログラムの運用において発生した損害に対するいかなる請求があったとしても、その責任を負うものではありません。
このサイトの情報は2007年当時の物です。
エーオーシステム
Copyright© ao-system エーオーシステム All rights reserved.
ページの先頭へ