スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ファビコンを表示させるときに注意すること

ファビコンを表示させるには、

のように、linkタグを設定すれば表示されます。FirefoxやSafariではこれで問題なく表示されます。


もう少し記述法を調べてみたところ、

のように、type属性にimage/x-iconを設定したほうが良いようです。


でも、Wikipediaによると、

のように、type属性にimage/vnd.microsoft.iconを設定するほうが標準的で望ましいようです。この記述の仕方は知らなかったので、勉強になりました。


しかし、上記のどの記述でもIEではファビコンが表示されず困ったことに。。

調べてみると、どうやらIEで正常にファビコンを表示させるには、アイコンをWindows icon形式で作成する必要があるとか。Macで作ったからダメだったみたいですね。
この問題を解決するには、@icon変換などのツールを使ってアイコンをWindows icon形式に変換するか(今回はこれで解決できました)、最初からWindowsで作れば大丈夫かと思います。もしくは、ファビコンを作れるWebサービスを利用するのが良いかも。

あと、それでもIEで表示されない場合は、IEのキャッシュと履歴を削除してブラウザを再起動すると表示されるようです。今日は一度この問題でハマりました…。

何はともあれ、type属性とicoファイルの形式に注意すれば、IEでもFirefoxでもSafariでもファビコンを表示させることができるようです。勉強になりました。

もう一つメモ。ファビコンのサイズは16×16pxで表示されるので、このサイズで作成するか、これを考慮して32×32pxで作ると良いようです。どちらのサイズも試してみましたが、見栄えにそれほど違いは感じられませんでした。

新しい記事

ピックアップ

Related Posts Plugin for WordPress, Blogger...
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。