SVGのfavicon

@yoruakiツイートを見て、SVGをfaviconとして表示できるブラウザーがあることを知ったので、手持ちの9つのブラウザーで確認してみた。

View Demo: SVG favicon

Firefox 10表示できる。
Firefox 12表示できる。
Chrome 17表示できない。
Chrome 19表示できない。
Safari 5表示できない。
Opera 11表示できるが適切にリサイズされない。
Opera 12表示できるが適切にリサイズされない。
Internet Explorer 9表示できない。ドメイン・ルートのfavicon.icoが表示される。
Internet Explorer 10 PPそもそもfavicon.icoが表示できない。
メジャーなブラウザーのSVGのfaviconのサポート状況

Chrome 17と19では無視される。Content-Typeの問題かと思ったけど修正してもダメだったのでそういう話でもないようだ。Internet Explorer 9の挙動が怪しい。404だったらドメイン・ルートを見に行くようになってる模様。Opera 11と12では対応自体はしているのだけど、リサイズがうまくされないのであまり意味がない(キャンバスを16x16にすればいけるのかもしれないけどそれもアレ)。ということでまともに表示できるのはFirefoxのみということのようだ。

Internet Explorer10 PP4でも確認したんだけど、そもそもfavicon表示するGUIスペースがなかった……。

最近は高解像度のアイコンも含めたfavicon(だいたいのブラウザーで対応されている)を利用してるWebサイトも稀に見かけるけど、サイズでかくなりがちだしそもそも作るの面倒だし、やっぱりスケーラブルなSVGを使えると良さそう。Metro UIとかはもちろんどんなGUIとも相性が悪いということはまずなさそうだし、PNGに変換してくれるサービスを経由することなくWebページで好きな大きさで利用できそうだし、いいことづくめ?