3

バージョン 9 より前の IE では、条件付きの JavaScript スニペットの形で何らかの助けがなければ、html5 のセマンティック タグが正常に機能しなくなることはよく知られている事実です。 これは、IE7 を使用していて JavaScript をオフにしているユーザーには、光沢のある html5 サイトの代わりに醜いものが表示されることを意味します。

私はそれに対処する方法を考え、次のアプローチを思いつきました: サーバー側 (mvc ビューなど) で、

    OutputHtml5WithFallback("<header>MyHeader</header>", "<div>MyHeader</div>");

リクエストがIE7またはIE8から来たかどうかを判断するためのブラウザスニッフィングコードがあります。ブラウザがIE7またはIE8として認識されている場合、html出力は

    <div>MyHeader</div>

それ以外は

    <header>MyHeader</header>

これは一種のスプーフィング防止機能のようです。ブラウザーが IE7 のふりをすると、html5 要素のない html5 マークアップを受け取ります。私の最大の懸念は、このアプローチが検索エンジンによって推奨されない可能性があることです (ユーザー エージェントごとに異なる html が提供されるため)。

私が見逃している可能性のある他の欠陥を指摘できますか?

4

3 に答える 3

1

プロキシ キャッシングには注意する必要があります。そうしないと、プロキシが IE7 ページをキャッシュして最新のブラウザに提供したり、HTML5 ページをキャッシュして IE7 に提供したりして、サーバーが正しいバージョンを提供する機会を得られなくなります。

サイトで HTML ページをキャッシュしないことが既に要求されている場合を除き、この問題を回避するために何をしても、サーバーの負荷が増加します。

于 2013-02-27T01:03:49.890 に答える
0

編集: bfrohs のコメントを参照してください。結局、適切なスタイリングを得るためには、まだ使用する必要があります.document.createElement('HTML5ElementName')

とはいえ、HTML5 の劣化に合わせてサーバー側の長さを調整するのは良い考えではないと思います。誰かがまだ IE6/7/8 を使用していて、デフォルトで JavaScript が無効になっている場合、オンラインのページの大部分 (Facebook からニューヨーク タイムズまで) はとにかく機能しません。

HTML では、不明な要素 ( など<blah>) は自動的にインライン要素と見なされます。古いバージョンの IE を修正するには、すべての新しいブロック レベル要素を に設定する必要がありますdisplay: block;。これは、CSS が行うことです。

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary { 
    display:block;
}

これにより、古いブラウザーでの HTML5 のレイアウトの問題の 99% が解決されます。(コントロール付きのオーディオやビデオなどの他のものは、実際に役立つように作業するか、別のフォールバック メカニズムが必要になる場合があります)

于 2013-02-26T22:03:00.823 に答える
0

スタイルが新しい HTML5 要素に依存しない限り、問題なく IE7 で HTML5 を表示できます。

したがって、次を使用できます。

<header><div class="header"></div></header>

あまり美しくはありませんが、サーバー側のコードから解放されます。

于 2013-02-26T22:03:05.793 に答える