ファビコン作成方法・ファビコンの埋め込み方

ファビコンって何?って方の為に

上記画像の赤丸がしてある部分をファビコンって言います。

Webサイトを作る時には、こういう所も拘っていきたいですよね。

そんな方の為にファビコン作成方法と実際にサイトに表記させる埋め込み方を解説したいと思います。

ここからが続き

ファビコン作成方法

PhotoShopやFireworksなどでファビコンにしたい画像を作成し、「gif」「png」「jpg」どれでも構わないので書き出して下さい。

そして上記サイトに掲載されている

Favicon Japan!!

上記画像部分に参照し、横の「Faviconを作成する」のボタンを教えて下さい。

するとico形式に自動で書き出してくれるので、それをダウンロードしちゃって下さい。

たったこれだけの事でファビコンが作れるちゃうんです!

ファビコンの埋め込み方

今回は分かりやすく説明する為にも、先ほど作ったファビコンをトップページのindex.htmlと同列階層において下さい。

そしてhead内に下記ソースを記入

<link href="favicon.ico" rel="shortcut icon" />

これで埋め込みも完了です。

まだ使った事がない方は一度やってみて下さい。

Related Article

Comments

MIYA

MIYA

ワンちゃんネットさん。

表示確認しているブラウザは何になるんでしょうか?
IE の場合 Cookie が残っている為表示されない事もあります。
Firefox などでみても見れないようならファビコンへのパスが間違っているとしか思えないです。。。

2010年04月25日 23:55

ワンちゃんネット

ワンちゃんネット

Web Design Works 8 を使用してHPを作成しています。
タイトル、URLの前にファビコンを付けたいのですが、どうしてもファビコンを付けられません。
お教え下さい。

2010年04月12日 15:27

Comment Form

※コメントが認証されるまで、コメントは反映されません。ご了承くださいませ。


(公開されません)