ホーム > Blog > タグ > favicon

favicon

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='http://inoccu.net/favicon.ico' rel='shortcut icon'/><b:include data='blog' name='all-head-content'/><link href='http://inoccu.net/favicon.ico' rel='icon'/>

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

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

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

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

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

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

inoccu.netのfaviconについて

このサイトや、前身のinoccu’s blogでfaviconとして使っている「いの」という手書き文字のアイコンですが、それは誰が書いたかというと…。

小川麻琴のポストカード

↑このポストカードを書いた人です。

サインを見て分かる人はヲタですね。
元モーニング娘。の小川麻琴さんです。

まこっちゃんのイベントに行ったときに、クイズコーナーがあって、私が見事勝ち抜いてしまったのです。それで、目の前で書いてもらったのが、このポストカード。

「いのっくさん」と書いてもらったので、「い」と「の」を切り出して、アイコンとしてデザインしました。

新生inoccu.netということで、一つ種明かしです。

Home > Blog > タグ > favicon

プロフィール

井上 研一
10年ほどITエンジニアをやっています。Twitterなどネットサービスでは「inoccu」(イノック)というハンドルで活動中。IT業界、モバイルのことや本を読んだ感想、ライフハック、それからハロプロに関することなどを、このブログに書いているほか、たまに何かソフトウェアを作って公開(最近はAndroidアプリ)することもあります。詳細なプロフィールはこちら。

井上研一
ナビゲーション
メタ情報

あわせて読みたいブログパーツ

Get Adobe Flash playerPlugin by wpburn.com wordpress themes

Return to page top