6

私は自分の Web サイトをアップグレードしている最中です。これには、<nav> <header> <footer> <aside> <section>通常の古い<div>要素よりも新しい HTML5 セマンティック要素を使用するという決定が含まれます。

私は IE7 と IE8 をサポートする予定ですが、これらのバージョンは上記のセマンティック要素をサポートしていないことを知っています。Modernizr、Initializr、HTML5shiv などの「プラグイン」について読んだことがあります。JavaScript が有効になっている場合、古いブラウザが新しい要素をサポートすることはわかっていますが、そうでない場合はどうすればよいですか?

デフォルトでは、<html>タグには のクラスが与えられ、no-jsJavaScript が有効になっている場合、Modernizr/Initializr はこのクラスを に置き換えますjs。それはそれで良いのですが、私には不確かな点がいくつかあります。これまでのところ、何がカバーされていますか？

ソート済み

  • JavaScript が有効になっている場合、IE7 と IE8 は Modernizr/Initializr でサポートされます。
  • ファイルを使用するreset.cssと、他の古いブラウザーがこれらの新しいタグをサポートします。
  • 最新のブラウザはすべて問題ありません。

問題

  • JavaScript が無効になっている場合、IE8 以下ではどうすればよいですか? no-jsクラスがタグに追加されたので<html>、それで正確に何ができるでしょうか?
  • ここをどう<noscript>活かすか。コーディングでページを大きくしすぎたくない。

したがって、これらの質問は別として、これらのタグを使用する価値があるかどうかも尋ねたいと思います。<div>古いブラウザをサポートし、新しいブラウザを作成するために必要なコーディングを排除することでファイルサイズを抑えることができる古き良きタグを使用できる場合タグは古いブラウザで動作しますか?

ありがとう、ディラン。

4

5 に答える 5

2

たとえば、両方を使用することをお勧めします。

<nav>
    <div>
        <ul>
        <!-- etc -->
        </ul>
    </div>
</nav>

これらの古いブラウザーをサポートする必要がある場合は、それ以上のことはしません。そのような利点は、余分な努力に値するものではありません。

于 2013-11-02T16:26:02.850 に答える
1

新しいセマンティックに従う必要はありません。新しいセマンティックは、主に検索エンジン用に開発されており、サイトの機能用ではありません。本当にIE をサポートしたい場合は、IE をサポートしてください。

ケースを本当に考慮no-scriptし、CSS では不十分な場合は、PHP/ASP マジックしかできません。

私の友人の 1 人は、Flash だけで作業しています。なぜなら、js がなく、完全にクライアント側であり、ブラウザーを気にしないためです...誰が知っている...

于 2013-11-02T16:31:53.533 に答える
1

私は IE7 と IE8 をサポートする予定ですが、これらのバージョンは上記のセマンティック要素をサポートしていないことを知っています。Modernizr、Initializr、HTML5shiv などの「プラグイン」について読んだことがあります。JavaScript が有効になっている場合、古いブラウザが新しい要素をサポートすることはわかっていますが、そうでない場合はどうすればよいですか?

JavaScript が有効になっていない場合、新しい要素のコンテンツは表示されますが、CSS はそれらに正しく適用されません。理論的には、noscript要素を使用して、新しい要素を使用していないバージョンのページへのリダイレクトをトリガーすることができますが ( 内の更新タグを介して) meta、noscriptサイトの 2 つのバージョンを維持することになります。

たとえば、次のページがあるとします:ライブコピー

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>HTML5 Elements</title>
  <style>
    nav {
      color: green;
    }
  </style>
</head>
<body>
  <nav><ul><li>This text should be green</li></ul></nav>
</body>
</html>

...初期のバージョンの IE では、テキストがデフォルトの色で表示されます。style要素の前に HTML5 shiv を追加します。

<script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>

...ご存じのとおり、これには JavaScript が必要で、テキストを緑色にします:ライブ コピー

于 2013-11-02T16:26:15.367 に答える
0

新しい HTML5 セマンティック要素を使用する必要がありますか?

はい。

JavaScript が無効になっている場合、IE8 以下ではどうすればよいですか? タグに no-js クラスが追加されているのですが、これで具体的にどうすればよいのでしょうか。

あなたはこのようなことをすることができます、

HTML

  <div id='wrapper'>
     // Whole website coding here
    </div>
    <div id='old-browsers'>
      Use an upgraded browser
    </div>

CSS 

    .no-js #wrapper {
      display: none;
    }

    #old-browsers {
     display: none;
    }

    .no-js #old-browsers {
      display:block;
    }

ここをどう活かすか。コーディングでページを大きくしすぎたくない。

IE の考慮事項:

IE7 は 7 年前のもので、今日のほとんどの開発者はそれをサポートしていません。js が無効になっている IE7 / IE8 ユーザーは非常に少ないため、これらの例外のために開発するべきではありません。代わりに、上記の方法でアップグレードするよう提案する必要があります。noscript同じユースケースにタグを使用できます。

于 2013-11-02T16:27:14.390 に答える
-1

あなたができること（そして多くの大きなウェブサイトがしていること）は、javascriptが無効になっているときに通知を表示することです（ブラウザがIE7またはIE8の場合はオプションですが、そのためにはサーバー側のチェックが必要です）、ウェブサイトが無効になるあるべき姿で表示されました。その方法については、「 JavaScript が無効になっているかどうかを検出する方法は? 」を参照してください。

インターネット ユーザーの5.3% ( source ) だけが Internet Explorer < 8 を使用しており、全ユーザーの 0.25% から 2% ( source ) が Javascript を無効にしています。訪問者の最大 5% x 2% = 0.01% のスムーズなソリューションを作成するのに多くの時間を費やすか、説明した通知システムを構築するのに 5 分を費やすことができます。

于 2013-11-02T16:32:22.770 に答える