2

私は、間もなく立ち上げられる大規模なサイトに取り組んでいます。デスクトップ ユーザーのほぼ 15% が IE8 を使用しているため、IE8 をサポートする必要があります。

HTML5shiv を含む Modernizr (v 2.6.3) のカスタム ビルドを使用しています。また、stripmq も使用しています (respond.js を取り出して、比較的不要な変数の別のセットを削除しました)。問題の核心は @font-face にあるようです。外部サイトのいくつかのフォント css およびフォント ファイルにリンクしています。そこでは、MIME-TYPE アプリケーション/オクテット ストリームとして .eot を提供します (インターウェブでのすべての参照にもかかわらず、成功したようです)。いくつかのローカル フォントにもリンクしていますが、MIME-TYPE application/vnd.ms-object を推奨どおりに使用しています (Bootstrap の Glyphicons、Icomoon カスタム セット、StateFace)。

クラッシュは、ページ間および環境間で予測できません。css の残りの部分 (他のソースが提供されている場所) をロードする前に、最初に .eot ファイルにリンクしています。また、これらのいくつかのフォント ファイルをローカルではなく外部にリンクし (MIME タイプが異なる)、カスタム フォントの 1 つを削除することで以前に修正したと考えていましたが、それでも時間の経過とともにクラッシュが発生します。 .

別の StackOverflow の投稿に従って、.eot ファイル定義を本体に移動しようとしましたが、成功しませんでした。過去には、サイトからすべての CSS を削除することで、クラッシュを回避できました (ただし、それはオプションではありません)。また、@font-face の定義がメディア クエリ内にないことも確認しました。


ドキュメントの冒頭の概算 (完全なコード サンプルを共有することはできません):

<!DOCTYPE html>
<!--[if IE 8]><html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--><html class="no-js gt-ie8"> <!--<![endif]-->
<head>
<meta charset="utf-8">

css for ie fonts 残りの css (imports オプションを使用して CssMin を介して縮小した後、BlessCss によってインテリジェントに 2 つに分割されます)

Modernizr (v 2.6.3)

メディア クエリを取り除き、幅 1280px に適用可能なスタイルのみを提供する stripmq (IE のみの条件付き)

残りのスクリプト (jQuery v. 1.11.1 を含む) は本文に読み込まれます。


更新: クラッシュを回避するための最後のステップは、CDN がこのあいまいなヘッダーでコンテンツを配信しないようにすることでした: https://rogerkeays.com/blog/internet-explorer-meets-the-vary-header

4

0 に答える 0