HTML 4とHTML 5の主な違いは何ですか?


回答:


197

HTML5には、HTML4とは異なるいくつかの目標があります。

不正な形式のドキュメントの処理における一貫性

主なものは、一貫して定義されたエラー処理です。ご存じのように、HTMLは意図的に「タグスープ」、または不正なコードを記述してそれを有効なドキュメントに修正する機能をサポートしています。問題は、これを行うためのルールがどこにも記述されていないことです。新しいブラウザーベンダーが市場に参入したい場合、さまざまなブラウザー(特にIE)で不正なドキュメントをテストし、エラー処理をリバースエンジニアリングする必要があります。そうでない場合、多くのページが正しく表示されません(推定では、ネット上のページの約90%が少なくともいくらか形式が悪いとされています)。

そのため、HTML5はこのエラー処理を発見して成文化しようとしているため、ブラウザー開発者はすべて標準化し、一貫して表示するために必要な時間と費用を大幅に削減できます。また、HTMLがドキュメント形式として消滅した後も、長い間、歴史家はドキュメントを読みたいと思うかもしれません。完全に定義された解析アルゴリズムがあれば、これが非常に役立ちます。

より優れたWebアプリケーション機能

HTML5の2番目の目標は、HTML、CSS、およびJavaScriptを介して、ブラウザーがアプリケーションプラットフォームになる能力を開発することです。多くの要素は、以下のようなFlashやJSベースハック、(HTML4で)現在の言語に直接追加されている<canvas><video><audio>。ローカルストレージ(JavaScriptが保持できる範囲を超えて情報を格納するためのjsアクセス可能なブラウザ組み込みのキー値データベース)、ブラウザが簡単なユーザーインターフェースを公開できる日付などの新しい入力タイプなどの便利なもの( jsベースのカレンダーの日付ピッカーを使用する必要はありません)。ブラウザでサポートされているフォーム検証により、開発者にとってWebアプリケーションの開発がはるかに簡単になり、ユーザーにとってはるかに高速になります(多くのものがネイティブでサポートされるため、 JavaScript経由でハッキングされるのではなく)。

要素のセマンティクスの改善

HTML5では、他にも多くの小さな取り組みが行われています。たとえば、既存の要素のセマンティックロールが明確に定義されて<strong>おり(<em>実際には別の意味であり、レガシードキュメントを解析するときにうまく機能するあいまいなセマンティクスも<b>あり<i>)、有用な新しい要素を追加しています。 -セマンティクス<article><section><header><aside>、と<nav>の大半交換する必要があり<div>、より重要なのは、あなたのページがもう少しセマンティック作り、Webページ上で使用されるのを、しかし、読みやすいです。そのランダム</div>が閉じているものだけを確認するための面倒なスキャンはもう必要ありません。代わりに、ドキュメントの構造をより直観的にする</header>、または明確にすることができます</article>


14
回答を編集して、タグや文章を強調してください。(私がこれを読んでいる間、それは私を疲れさせたので、それは単なる提案です。)
Mohammad Faisal

44

ウィキペディアから:

  • 柔軟な解析と互換性に向けられた新しい解析ルール
  • 新しい要素–セクション、ビデオ、進行状況、ナビゲーション、メーター、時間、脇、キャンバス
  • 新しい入力属性–日付、時刻、メール、URL
  • 新しい属性– ping、charset、async
  • グローバル属性(すべての要素に適用可能)– id、tabindex、repeat
  • 廃止された要素が削除されました-センター、フォント、ストライク

12

完全な違いについては、HTML5とHTML4の違い:W3Cワーキンググループノート2014年12月9日を確認してください。多くの新しい要素と要素属性があります。一部の要素が削除され、他の要素は以前とは意味論的価値が異なります。

キャンバスの使用などのAPIも定義されており、次世代のWebアプリの構築に役立ち、実装が標準化されていることを確認できます。


11

HTML5には、Webアプリケーションの作成に役立つ多数のAPIが導入されています。これらは、アプリケーションに導入された新しい要素と一緒に使用できます。

  • 新しいビデオとオーディオ要素で使用できるビデオとオーディオを再生するためのAPI。
  • オフラインWebアプリケーションを有効にするAPI。
  • Webアプリケーションを特定のプロトコルまたはメディアタイプに登録するためのAPI。
  • 新しいグローバルcontenteditable属性と組み合わせた編集API 。
  • draggable属性と組み合わせたドラッグ&ドロップAPI 。
  • 履歴を公開し、ページに履歴を追加して[戻る]ボタンを壊さないようにするAPI。

3

このHTML5要素と属性のリストに興味があるかもしれません。

また、「HTML4」ではなく「HTML 4」であることにも注意してください。実際、HTML 5では両方のバリアントが使用されますが、意味に重要な違いがあります。HTML 5はW3C仕様の名前を指しますが、「HTML5」は、この仕様に準拠したtext/htmlMIMEタイプのHTMLファイルのドキュメントタイプです。XHTML 5とXHTML 5についても同様です。


1
XHTML 5が存在することを示唆しているようですが、そうではありません。XHTMLの最新のW3C勧告は1.1で、2.0はドラフト段階です。
David Rivers、

4
@David Rivers:存在しています。XHTML5は、HTML5のXMLシリアル化です
Mathias Bynens、2011

2
@David Rivers:ところで、XHTML 2はドラフト段階ではなくなりました。HTML5を支持し廃止れました
Mathias Bynens、2011

ありがとう。私もこれを発見したばかりで、自分がどれだけ外れているのか信じられません。大変な年でした!
David Rivers


0

HTML 5への招待は、コードに多くの意味論的価値を追加します。さらに、マルチメディアコンテンツを埋め込むネイティブソリューションがあります。

残りは重要ですが、クライアントプログラミング言語を使用して同じことを行うのを防ぐ、より技術的な砂糖です。


弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.