faviconとは?はコチラ

faviconの作り方

faviconはPNGやGIFを「.ico」の形式に変換しなければなりません。

フリーソフトやサイト上で変換してくれるものがあります。

サイト上でfaviconを生成する場合は、こちらがわかりやすいです。

favicon

ちょっと面倒ですけど、

16×16、32×32、48×48の3種類のPNGかGIFかJPEGを作って、
「ファイル選択」でそれぞれファイル指定した上で「favicon.ico作成」をクリック!

一つの大きさだけでも出来るようですが、メディアによって拡大縮小がかかってしまうので、出来れば3種類用意したほうがいいです。

faviconの設置方法

ルートディレクトリに「favicon.ico」というファイル名で設置します。

もう一度念のため。

ファイル名は「favicon.ico」ですよ!

ルートディレクトリはウェブサイトを格納しているフォルダの最上階層にある場所です。
通常は「index.html」と同じ階層です。

index.htmlの隣にfavicon.icoを置いておけば、ブラウザが勝手に読んでくれます。

FTPソフトで直接ぶちこんでください!

 

TouchIconの作り方

iPhoneやiPad、またはRetina版かどうかで適する大きさが違いますので、とりあえず120×120で画像を作ってPNGで保存しましょう。

そのファイルをサイトの適当なところにアップロードします。

TouchIconの設置方法

<head>~</head>の間に次のタグを差し込んでください。

<link rel=”apple-touch-icon-precomposed” href=”http://・・・アイコンをアップロードしたアドレス・・・.png” />

これでOKです。