Bloggerのfaviconに関する考察

昨日、Bloggerの各種設定に関する記事を書きました。

そこで、faviconに関して少しお茶を濁していたので、続きを書きます。

Bloggerのテンプレートには、下記のようなコードが入っています。

<b:include data='blog' name='all-head-content'/>

このコードは、実際にページを表示すると、いろいろなlinkタグとかmetaタグに展開されるのですが、その中に下記のようなコードが含まれます。

<link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>

あーあー。これが入っちゃうと、どんなに自分のfaviconを入れても、デフォルトのオレンジ色の「B」のfaviconから逃れられないのです。デフォルトと自分のfaviconのどちらが表示されるかは、ブラウザの実装によるわけですよ。

そこで、私はしばらく下記のような方法をとっていました。

<link href='https://inoccu.com/favicon.ico' rel='shortcut icon'/><b:include data='blog' name='all-head-content'/><link href='https://inoccu.com/favicon.ico' rel='icon'/>

こうすれば、自分のfaviconでデフォルトを挟むことになるので、どんなブラウザの実装でも、まさか真ん中を選り抜くようなことはしないだろう・・・と、期待したのです。

私はFirefoxを使っていますが、これでアドレスバーに出てくるfaviconはだいたい自分のもので安定しました。しかし、ブックマークについているアドレスがデフォルトに戻ってしまうこともありました。ま、表示する度にブックマークのfaviconはめまぐるしく変わっていたのです。

※ちなみに、はてなブックマークされた時に使用されるfaviconは、先頭に書いているfaviconのようです。挟み撃ち作戦で先頭が自作faviconになってからブックマークされたものは、自作faviconで、はてなに登録されるようになりました。

で、いま採っている作戦は、<b:include ... />を取り払って、展開されるべきコードをあらかじめテンプレートに組み込んでしまう方法。そこで、デフォルトのfaviconの設定を外してしまうのです。

現在のソースは、このページのソースを見てみてください。

最も危険な方法ですが、最も確実な方法でもあります。今のところ、問題は出ていません。