HTMLページのタイトル(つまり、タイトルとともにタブ上)に画像を配置したい。どうやってやるの?
必要なのはfavicon.icoファイルです。サイトのルートに配置し、ページのヘッダーにリンクするだけです
<head>
<title>My Site</title>
<link rel="shortcut icon" href="favicon.ico" />
</head>
一部のブラウザはページでリンクしていない場合でも検索するため、サイトのルートに配置してfavicon.icoという名前を付ける必要があります。
クロスブラウザの互換性のために、ファビコンのために2行が必要と思われます:
[〜#〜] title [〜#〜]
<title>PAGE TITLE HERE</title>
[〜#〜] favicon [〜#〜]
<link rel="SHORTCUT ICON" href="http://domain and path/favicon.ico" />
<link rel="icon" href="http://domain and path/favicon.ico" type="image/ico" />
FAVICON GENERATOR:
Head-elements内に次のような行を追加してください:
<link rel="shortcut icon" href="/somwhere/icon.ico">
.icoファイルは古いブラウザの中で最適に機能しますが、もちろんpngおよびjpegファイルも使用できます。
ファビコンを設定する必要があります。これを行うタグは次のとおりです。
<link rel="SHORTCUT ICON" href="favicon.ico" />
このタグを<head />
に追加すると、hrefで参照されている画像をダウンロードするようサイトのブラウザーに指示します。
ファビコンをサイトに追加する方法(W3C):
http://www.w3.org/2005/10/howto-favicon
次のようなオンラインジェネレーターを使用して、任意の画像をファビコンにすることができます。
http://tools.dynamicdrive.com/favicon/
png
イメージを使用して、既知のすべてのデバイスをサポートするために、少なくとも310x310pxにすることもできます。最新のブラウザは、それに応じて自動的にサイズを調整します。