2017年4月
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30            

« 大阪でのできごと(2日目) | トップページ | 鳥はむ作り »

2007.01.24

Favicon(ファビコン)付けてみた

昨日ファビコンなるものを知りました。
どういうものかは知ってたんだけど、名前を知らなかったという代物。

FAVorite ICONの略で、Favicon。
IE7・Firefox・Operaなどのブラウザをお使いの方なら高確率で見られる、ブックマーク(お気に入り)欄などに表示される小さなアイコンのこと。


見られない環境のかたのために用意しました。ブックマーク部分のキャプチャ画像です。

こんな感じ。
うちのブログ名の前についてるのが今回自分で作ったものですよ。


---------------

ファビコンの用意はとっても簡単。主な作り方は以下のとおり。

【方法1】
ファビコン素材屋さんからお借りする。

【方法2】
正方形の画像(GIF、JPG、PNG)を用意して、「Favicon Japan」様のトップページでアイコンを自動生成。
ここでアップロードする画像の大きさはどれでも構わないようですが、最終的に16×16ピクセルになるのでその状態で作ってからのほうが思い通りに仕上がるかと。

【方法3】
「Favicon Editor」のサイト上で色を置いていって、[make favicon]ボタンで作成。


今回は【方法2】で作りました。ペイントで1ドットずつ手打ちです(笑)

---------------

アイコンが出来上がったら自分のサイトにアップロード。上位のディレクトリに置くといいみたい。
(当ブログでいうと、http://rindow.cocolog-nifty.com/favicon.ico としています)

あとはページの<head>と</head>の間に以下のタグを書き込むだけ。
<link rel="shortcut icon" href="icoファイルのURL">
ココログの場合は、「ブログのサブタイトル(キャッチフレーズ)」 欄にこれを追記すればOK。他のブログを利用されている方々は……ごめんなさい。検索すれば出てくるかと思います。

---------------

まあ、無くても困らないので自己満足の世界かもしれません(苦笑)
でも設置方法を知ってしまったからには、このブログ独自のものを用意してみたくて。

上記の「Favicon Japan」さんのところにブラウザ別ファヴィコン対応表がありました。これで見ると、ファビコンが見られない環境ってそれなりに多いですね……。


最後になりましたが、今回お世話になったサイト様はこちら。
いつもありがとうございます。

初めてのココログ・カスタマイズ>第32回:自分専用のfavicon(ファビコン)を付けてみよう

« 大阪でのできごと(2日目) | トップページ | 鳥はむ作り »

コメント

ウチのマシンだと表示してくれませんねえ><。
XP+IE6.0は、△印になってるので仕方ないのかなぁ・・・;;。

★お魚さん
うちのもXP。IE6.0だと表示されませんよ。
使ってるのがFirefoxで、他のサイトでファビコンが設置されてて気になってたのです。
ブログにつけてる人はまだまだ少数でしょうね。
ブックマークで視覚的に素早く選べるので便利。


ブログサービスによっては、その会社のブログは全部同じファビコンが付いてます。
例えば、お魚さんのところのlivedoorブログなら羽ペンのマークだし、gooブログなら「教えて!goo」と同じ「g」マーク。
ココログにはそういうのがないので寂しくて(笑)

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/40895/13649162

この記事へのトラックバック一覧です: Favicon(ファビコン)付けてみた:

« 大阪でのできごと(2日目) | トップページ | 鳥はむ作り »