ファビコン作成

Mac・PC・Net

「ファビコン(Favicon)」とは
「Favorite Icon(お気に入りアイコン)」の略

ブラウザのアドレスのところに表示されたり
ブックマークを見たときに左端に表示されている小さなマーク

ブックマークアイコンと呼ばれてることもある
いつ頃からこういうのが使われるようになったのか
気になっていたが自分ちにはつけないまま

いや、セットするのは簡単なのだが
極小アイコンを作るのがおっくうで

でも、ほとんどのオフィシャルサイトにはついてるし
お客さんところにはつけてあげないと、と腰をあげた(笑)
例えば、JKCやオプデスにもついているが
ルモンドにはついてない(笑) ついてないと白紙が出る

20111212-1
 
 

★ 邪道かもしれない作り方 ★
32 × 32 pixel のアイコンを作る
「favicon.ico」が出来た時点では、32 × 32

ドット作成でない場合はシャープをかけると出来上がりがきれい
うちの場合、写真屋(フォトショ)を使っているので
イラストを描いたり、写真を縮小したあとに使う
「フィルタ→アンシャープマスク→半径0.2くらい、量200くらい」
で、シャープをかけている!

実際には、16 × 16 pixel で表示されるので
出来上がったらその大きさに一度縮小してみてチェック?

それ以上の大きさで作っても↓のサイトで縮小してくれるが
原寸の方がたぶんきれい?!

ほとんどドットの世界なのでgif で作成
(jpegの方がいいのかは不明)

FavIcon from Pics

入力枠をクリックして作ったgifファイルを選択し
「Generate Favicon.ico」ボタンをクリック

ページが変わったら
「Download Favicon Package」をクリックしてダウンロード

zipファイルでダウンロードされるので
解凍すると、フォルダの中に、favicon.icoが!

この「favicon.ico」を自分のサイトのルートディレクトリにアップロード
現在、最新のブラウザなら以上でOK!

少し前までは、表示させたい各ページのとの間に と言うタグを組み込まないといけなかったし
IEだと、うまくいかない場合もあったらしいが
たぶん最新のIEなら大丈夫・・らしい?

ただ、アップしても、すぐには反映しないのかも

こんな感じ ↓
20111212-2
 
 

★ 写真屋を使うならブラグインが簡単 ★
写真屋にプラグインを増やすと起動に時間がかかるので考えてなかった
が、これに関してはファビコン作成のプラグインを1つ入れるだけで簡単じゃ!

Photoshop icoformatICO (Windows Icon) Format Plugin

自分のMacと写真屋にあわせてダウンロード(写真屋は起動させない)
ダウンロードしたものを開いて、その「ICOFormat.plugin」を
「Applications→Adobe Photoshop CS→プラグイン→ファイル形式」
に入れてから、写真屋を起動
自分で作ったファイルを「別名で保存」する際に、
「ICO (Windows Icon) 」という形式が追加されてるので、それを選ぶだけ
いや〜、簡単でしたね(笑)
こういうプラグインなら入れてもいいか〜
 って、滅多に使わんのに(汗)