IE 10で最も人気のあるサイト画面-アイコンが表示されない

次のコードを使用して、ファビコン、タブレット、スマートフォン、Windows 8タイルなどのアイコンを追加します。

<link rel="apple-touch-icon" href="apple-touch-icon.png">

<link rel="shortcut icon" type="image/x-icon" href="/webmasters//favicon.ico"/>

<link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-icon-144x144-precomposed.png">

<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114-precomposed.png">

<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png">

<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">

<meta name="msapplication-TileImage" content="apple-touch-icon-144x144-precomposed.png"/>

<meta name="msapplication-TileColor" content="#17151a"/>

残念ながら、これはIE9とIE10の「あなたの最も人気のあるサイト画面」では機能しないようです。Google検索は啓発的ではありません。

Stackは<link rel="apple-touch-icon" href="apple-touch-icon.png">、うまくいくように見えますが、私たちには使えません。

解決策への手がかりはありがたいです。

ここに画像の説明を入力してください

internet-explorer favicon

— MJWadmin
ソース

この画面でのみ失敗していますか？例えば。通常のアクセス時に、アイコンはブラウザのタブによって読み込まれますか？それは決定的に何かを証明するものではありませんが、少し有益です。そうでなければ、ファビコンの状況をかなり徹底的にカバーしたようです。私はこれについてあまり心配する必要があるかどうかわかりません。ブラウザは、古くからファビコンをロードすることについて悪名高く知られています。また、それは誰にとっても起こりますか？

— Su '

どのアイコンも404を使用しておらず、タッチアイコンと同様に、ファビコンは他のブラウザーでも機能します。これは、非常に迷惑な「議長の注意」の問題の1つです。それに朝を費やしたので、好奇心と欲求不満は私を良くしています。

— MJWadmin 2012

スタックが使用する実際のPNG画像を試しましたか？PNG形式自体に何らかの異常がある場合は？

— MrWhite 2012

他のブラウザはここでは関係ありません。アイコンが通常のIEタブに読み込まれることを意味しました。404がなくても何もわかりません。画像が実際に存在するかどうかとは関係ありません。ブラウザは、一般的にファビコンのロード、期間について気まぐれです。それ自体が問題になる場合、実行できることはほとんどありません（キャッシュをクリアするなど、考えられることは何でも可能です。動作するかもしれないし、動作しないかもしれません。これは驚くべきことです！）それはまだ起こります。Firefox は、アイコンの付いた別のタブで既に開いているサイトのタブにファビコンをロードできませんでした。

— Su '

コメントにウェブサイトへのリンクを投稿していただけませんか？

回答:

あなたのicoファイルはどこですか？私はそれがルートフォルダーにあるのを見ることができます、そしてあなたはそれの後ろのスラッシュを必要としません、あなたのファイルの後ろからスラッシュを取り除きます、またあなたは必要ありませんtype="image/x-icon"

ICOファイルは、必要なアイコンサイズが異なる通常のアイコンライブラリでなければなりません。

<link rel="shortcut icon" href="favicon.ico"/>

上記のコードを使用するだけで、IE9、IE10、FX、Chromeで完全に動作します。

以前に別のfavicoを使用したことがある場合は、ブラウザーのキャッシュも更新する必要があります。

— オムネ
ソース

ファイルが実際にルートフォルダーにあると仮定すると、問題は確かにファイルではなく、表示されているhtmlタグではありません（IEの問題を引き起こす他のhtmlエラーがない限り）。私のファビコンリンクタグは@MJWadminと同じように記述され、アイコンはIE9のお気に入りのタブで

— 正常に読み込まれ

ファビコンの大きさは？このリストをチェックして、これらのガイドラインに該当することを確認してください。

サイトアイコンのカスタマイズ-Internet Explorer 9のサイトアイコン

編集

Stackoverflowのソースコードを見ると、2つのアイコン画像があります。

<link rel="shortcut icon" href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">

そして

<link rel="apple-touch-icon" href="http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png">

IE9のお気に入りタブで私のスタックオーバーフローを見ると、提案されている158x158のスタックオーバーフローアップルタッチアイコンではなく、16x16のファビコンを使用している（そして32x32コンテナーの中央に配置している）ように見えます。サイドとボトムの「パディング」距離比は約2.5：1ですが、ファビコンでは1：1として、IE9タブの1：1パディングと同じです...

私の雇用主のファビコンはIE9のお気に入りとその64x64（透明度なし、サイズ12.5kb）でロードできると言えるでしょう。それでもファビコンを表示できない場合は、リンクを投稿して、実際の画像ファイルを確認してください

— WebChemist
ソース

-1

どちらかのようにしてみてくださいOmneを示唆し、あなたのtype属性を削除するか、値として画像/ vnd.microsoft.iconを有する第二1を追加します。次に、サーバーがドットicoファイルのMIMEタイプを送信していることを確認します。これを見てください：

https://github.com/paulirish/html5-boilerplate/commit/37b5fec090d00f38de64b591bcddcb205aadf8ee

いくつかの裏話

以前はそうだったか、アイコンの正しいMIMEタイプが何であるかについて議論されてきました。

Microsoftの世界はかつて、そして今でもおそらく「image / vnd.microsoft.icon」に依存していますが、それ以外の世界では「image / x-icon」を非公式に（公式に）使用しています。

ウィキペディアICO形式から：

ICOファイルの公式のIANA登録済みMIMEタイプは、2003年に登録されたimage / vnd.microsoft.iconです。誤ったラベル「image / ico」、「image / icon」、「text / ico」、「application / ico」、および非公式な名前の「image / x-icon」は、MIMEタイプの正式な登録および割り当て時に使用されていました。

まだウィビペディアのファビコンから

2003年に、.ico形式はMIMEタイプimage / vnd.microsoft.icon。[12]でInternet Assigned Numbers Authority（IANA）に登録されました。.ico形式を使用する場合、Internet Explorerは標準化されたMIMEタイプで提供されるファイルを表示できません。Internet Explorerの回避策は、.icoをWebサーバーの非標準のimage / x-icon MIMEタイプに関連付けることです。

— アンソニー・ハトゾプロス
ソース