favicon が 設定されていないサイトを見かけなくなった今日。
会社のパソコンをリカバリーしたことによりソフトが全て消失。
Sleipnir を愛用していたが、ソフトを入れ過ぎてまた動作が不安定になるのも面倒なので、とりあえずブラウザーは IE を使うことに。
デフォルトの検索は bing。
正直今まで使ったことがなかったであろう bing。
そんな bing でいろいろと検索しているのだが、ふと気が付いたことがある。
なんか検索結果の横にアイコンが・・・
表示されるサイトとされないサイトがあり、その基準が不明確。
とりあえず favicon の設定だろうと考え、いろいろ調べてみる。
すると、表示されているサイトは favicon の記述がされていない所が多く、またはファイルタイプが指定されていない。
そこで favicon についてちゃんと調べてみたところ、下記のサイトさんに到着。
⇒ favicon.ico は link 要素で明示的に指定するべきか
favicon が IE5 の独自機能であったことを知る。
しかも、わざわざ head に記述しなくてもサイトのルート直下に favicon.icon なるファイルを置いておけば勝手に読み込んでくれるらしい。
そして指定の仕方に違和感が・・・
ファイルタイプが「image/vnd.microsoft.icon」になっている。
こんなの今まで見たことない。
で、調べた結果・・・
⇒ ICO (ファイルフォーマット)
このファイルタイプが現在公式で登録されているそうな。
きっとこれに違いない！
そう思い、サイトの favicon 記述を修正。
<link rel="shortcut icon" type="image/vnd.microsoft.ico" href="/images/favicon.ico">
<link rel="icon" type="image/png" href="/images/favicon.png">
<link rel="apple-touch-icon" type="image/png" href="/images/favicon.png">ついでに他ブラウザーがサポートしてる「rel=”icon”」も指定。
icon は png 形式をサポートしているそうなので、もちろん png 形式で。
iPhone でブックマークを画面上に置いた際に使用される「rel=”apple-touch-icon”」も指定。
これで表示されるだろう。
なんて思って、表示されていないサイトを見ていたら「image/vnd.microsoft.icon」をちゃんと指定してるサイトが・・・
それに、表示されているサイトの大半は favicon の記述をしていなかった・・・
そうか、ルート直下にファイルを置かないといけないんだ。
とりあえず、直下に favicon.icon を設置。
これで表示されるのか？
追記
続きを書きました。
⇒ 続・bingの検索結果に表示されるアイコンとfaviconの記述