<link rel="icon" type="" href="">

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類 メタデータ・コンテンツ
利用場所 メタデータ・コンテンツが置ける場所 / head要素の子要素となるnoscript要素
内容

link要素で、オリジナルのファビコン(Favicon)を指定することができます。

TAG indexの場合は、「T」というシンプルなファビコンを使用しています。

  • ファビコンとは、ブラウザのアドレスバーなどに表示される小さなアイコンのことです。

<link rel="icon" type="image/vnd.microsoft.icon" href="favicon.ico">

属性
必須属性
rel="" 現在の文書から見たリンク先の関係 icon アイコンのリンクタイプを指定
href="" リンク先の指定 URL アイコンの画像ファイルを指定
任意属性
type="" リンク先のMIMEタイプ image/vnd.microsoft.icon ICO形式の画像を使用する場合
image/gif GIF形式の画像を使用する場合
image/png PNG形式の画像を使用する場合
sizes="" [+]アイコンのサイズ any 可変サイズ (SVG等、ベクター形式の画像向け)
横幅x高さ ピクセル数で指定、半角スペース区切りで複数指定可能

type属性の値には、使用する画像のMIMEタイプを指定します。

例えば、ファビコンで使用する画像がICO形式で作成されている場合は、type属性に次の値を指定します。

type="image/vnd.microsoft.icon"
  • ファビコンで使用する画像は、ICO形式で作成するのが一般的です。(対応しているソフト、またはWeb上のツール等を使用して作成します)
  • GIF形式PNG形式に対応したブラウザも増えてきてはいるようです。

sizes属性の値には、アイコンのサイズをピクセル数で指定します。(px の記述は不要)

sizes="32x32"

上記のように、x(エックス)で区切って横幅x高さの形式で記述します。(エックスの部分は大文字でも構いません)

複数のサイズが存在する場合は、半角スペースで区切って記述します。(マルチアイコンの場合に指定するものと思われます)

sizes="32x32 64x64"

サイズ調整が可能なベクター形式の画像(SVG等)の場合は、値に any を指定します。

sizes="any"

使用例


<!DOCTYPE html>
<html>
<head>

<link rel="icon" type="image/vnd.microsoft.icon" href="favicon.ico">

<title>文書のタイトル</title>

</head>
<body>



</body>
</html>