過去10年と少し前の1997年12月18日。InternetExplorer 4は3か月前にリリースされましたが、Mozilla Foundationはまだ結成されておらず、Firefoxのリリースはまだ先のことです。 XMLHttpRequestはなく、XMLさえありません。 10日以上前のこの日、 HTML 4.0はW3C勧告として公開されました。

これは、最新のWeb標準が開発された基礎になりました。 もちろん、改善がありました。 2000年には、XHTML 1.0が公式の推奨事項として採用され、CSS 2はほとんどのブラウザメーカーによって実装されました。 しかし、単純な名刺から複雑なアプリケーションまで、すべてのサイトが構築されるバックボーンであるWebの基礎は、基本的に変更されていません。

少なくとも今日まで。 しばらくの間、W3Cの状況は変わりつつあるようです-廃止されたHTML 4.xおよびXHTML 1.x標準を置き換えるために設計された2つの競合する仕様が開発中です。 両方のイニシアチブはW3Cの後援の下で機能しますが（常にそうであるとは限りませんでした）、私の意見では、両方とも現在のWebマークアップ言語の選択を大幅に超えています。 これはHTML 5およびXHTML 2.0です。 そして、この記事を読んでいる場合、今後数年のうちに、そのうちの1つ（または両方）で作業する必要があります。

ちょっとした歴史

XHTML 2.0の作業は、2001年に勧告としてXHTML 1.1が公開された直後に始まりました。 XHTML 2.0の最初のドラフトバージョンは2002年に公開されましたが、ドキュメントの大部分は非規範的で不完全な状態でした（そして、今日まで何かが残っています）。 2004年までに、ブラウザ開発者、デザイナー、ウェブ開発者、コンテンツ所有者などの著名な業界リーダーが、XHTML 2.0ワーキンググループの管理に対する不満を高めていました。 W3Cの閉じた性質を思い起こして、彼らは独自の標準を見つけて開発することにしました。

そのため、2004年にWHATWG （Web Hypertext Application Technology Working Group）と呼ばれる独立した連合が形成されました。 グループは、Web Applications 1.0と呼ばれる仕様の作業を開始しました。 2007年4月、W3Cはグループの仕様を検討する提案に賛成票を投じました。 WHATWGメンバーは、HTML開発者のグループとしてW3C内で作業を開始し、プロジェクトの作業を継続しました。このプロジェクトはHTML 5と改名されました。したがって、HTML 5ドラフトは、 すでにプロジェクトのいくつかの重要な段階を見逃していた ）。

XHTML 2.0の概要

XHTML 2.0は完全にXMLベースであり、開発者はSGMLのレガシーと現在のWebマークアップに存在する構文機能を放棄しました。 デフォルトで最小限の機能を備えた「汎用言語」として位置付けられており、CSSまたは他のテクノロジー（XForms、XMLイベントなど）を使用して簡単に拡張できます。 このモジュール式のメカニズムにより、XHTML 2開発チームはドキュメントの一般的なレイアウトに集中できますが、他の人はドキュメントの表示、対話、構築などのメカニズムを開発しています。

XHTML 2ワーキンググループの最優先事項は、ドキュメントのコンテンツと構造をプレゼンテーションからさらに分離することです。 その他の目標は、使いやすさとアクセシビリティの向上、国際化の改善、デバイスの独立性の向上、スクリプトの削減、セマンティックWebとの統合です。 開発者は、以前のバージョン（およびHTML開発チーム）よりも下位互換性に関心がなかったため、HTMLの初期の化身に存在していたいくつかの構文上の手荷物が取り除かれました。 その結果、多くの古いWebマークアップの欠陥を修正する、より簡潔で簡潔な言語になりました。

HTML 5の概要

XHTML 2.0の概念は革新的であることを意図していますが、HTML開発チームは実用的なアプローチを採用し、進化するテクノロジーとしてHTML 5を作成しています。 HTML 5は一歩前進したものの、現在のHTML 4 / XHTML 1標準とほとんど互換性がありますが、HTML 5はHTML 4 / XHTML 1に多くの変更と拡張を提供し、以前の仕様の多くの欠点を指摘しています。

HTML 5仕様は、HTMLのドキュメントマークアップからの脱却と、Webアプリケーションを作成するための言語での実装について言及しています。 このため、Webアプリケーションを開発するためのさまざまなAPIを提供する、より信頼性の高い機能的なクライアント環境を作成することに重点が置かれています。 特に、仕様では、実装はクライアント側の永続データストレージ（キー/値とSQLデータベースの両方）、オーディオとビデオを再生するためのAPI、キャンバス要素を使用した2D描画、ドキュメント間のメッセージ交換を提供する必要があると規定していますサーバーおよびネットワークAPIによって送信されるイベント。

HTML 5は、現在のHTML仕様と互換性のあるSGMLのような構文をサポートします（ただし、SGMLの最も難解な機能の一部はサポートされなくなりました ）。 セカンダリXMLシリアル化も仕様に含まれているため、開発者は適切なXMLドキュメントを使用できます。 SGMLのようなシリアル化を維持することにより、HTML 5開発チームはプラグマティズムと進歩のバランスを取りました：開発者はHTMLシリアル化（HTML 4.xに似ています）またはXMLシリアル化（XHTML 1.xに似ています）を使用してマークアップを選択できます。

類似点

両方の開発グループが多数の同様の機能を提供していることを誰も驚かさないでしょう。 彼らはウェブ開発の有名な「痛点」を指摘し、マークアップ言語の新世代への歓迎すべき追加になるでしょう。

ビュー要素の削除

XHTML 2およびHTML 5では、ドキュメントの表示のみを担当するため、多くの要素が削除されます。 プレゼンテーションはスタイルシートを使用して管理する必要があると考えられています。

XHTML 2およびHTML 5文書には、 basefont 、 big 、 font 、 s 、 strike 、 ttおよびu要素を含めることはできません。 XHTML 2.0はまた、 small 、 b 、 iおよびhr要素を削除し、HTML 5はそれらを別の値でオーバーライドします（プレゼンテーションを担当しません）。 XHTML 2.0では、混乱を減らすためにhr要素がseparator要素に置き換えられます（ hr要素は水平方向の仕切りを作成することを目的としていますが、必ずしもこれに使用されるわけではありません）。

ナビゲーションリスト

ナビゲーションリストは、XHTML 2.0とHTML 5の両方で導入されました。XHTML2.0では、新しい nl （Navigation List） nlによって定義され nl 。 リスト自体は、リストのタイトルを定義する子label要素で始まる必要があります。 その後、マークアップリンクに使用される1つ以上のli要素を使用できます。 また、XHTML 2.0の新機能は、 href属性を使用して任意の要素からリンクを作成する機能です。 これらのメソッドの組み合わせにより、シンプルで簡単なメニューレイアウトを作成できます。

 <nl>
     <label>カテゴリ</ label>
     <li href = "/">すべて</ li>
     <li href = "/ news">ニュース</ li>
     <li href = "/ videos">ビデオ</ li>
     <li href = "/ images">画像</ li>
 </ nl>

HTML 5では、この目的のために navが導入されました。 残念ながら、 navリスト要素ではないため、リンクの論理的な編成のためにli子を含めることはできません（おそらく新しいイディオムが開発されるでしょう）。 また、HTML 5でリンクを作成するには要素が必要なので、ナビゲーションマークアップはあまり洗練されていません。

 <nav>
     <h1>カテゴリ</ h1>
     <ul>
         <li> <a href="/">すべて</a> </ li>
         <li> <a href="/news">ニュース</a> </ li>
         <li> <a href="/videos">動画</a> </ li>
         <li> <a href="/images">画像</a> </ li>
     </ ul>
 </ nav>

優れたフォーム

どちらの仕様にも、より少ないスクリプトでより一貫したフォームを作成するための新機能が含まれています。 XHTML 2.0では、HTMLフォーム標準が完全に削除され、より広範なXForms標準が採用されました。 XHTML 2.0開発チームはこの技術を制御せず、仕様でのみ言及しています。 XFormsでの再利用を簡素化するために、収集されたデータはコントロールのマークアップとは別になっています。 これは強力な言語ですが、完全な説明はこの記事の範囲外です。 この技術について少しでも知っていれば、開発速度が大幅に向上すると言うだけで十分です。

HTML 5は使い慣れたHTMLフォームを保持しますが、いくつかのデータ型を追加して開発を簡素化し、ユーザーエクスペリエンスを向上させます。 電子メールアドレス、URL、日付と時刻、数値データ用のいくつかの新しい入力要素タイプが追加されました。 これにより、ブラウザーはより便利なユーザーインターフェイス（たとえば、日付と時刻を選択するためのダイアログ）を作成し、他のアプリケーションと統合し（たとえば、Outlookまたはアドレス帳からアドレスを選択）、サーバーに送信する前にユーザーが入力したデータを確認できます（JavaScriptチェックを短縮します）顧客）。

セマンティックマークアップ

どちらの仕様も、今後のセマンティックWebを対象としており、開発者はより豊富なメタデータをドキュメントに埋め込むことができます。 フォームと同様に、XHTML2開発チームはより高度なテクノロジーを使用しますが、HTML 5開発者はよりシンプルな方法を採用しています。

XHTML 2.0では、メタ情報属性モジュールのいくつかの新しい属性を使用してメタデータを埋め込むことができます。 特に、新しいグローバル属性role 、ドキュメントのコンテキストでこの要素の値を記述することを目的としています。 また、 RDFを引用して、グループが既存の標準を使用するWebページテクノロジーへの埋め込み構造化データも使用します。 このテクノロジーは非常に強力ですが、洗練されています。

HTML開発チームは、 マイクロフォーマットに非常によく似たアプローチを選択しました-さまざまなデータ型を表す定義済みのクラスセットでクラス属性をオーバーロードします。 現在、仕様には、 copyright 、 error 、 example 、 issue 、 note 、 searchおよびwarning 7つの予約クラスがありwarning 。 この方法はそれほど信頼できるとは思えないかもしれませんが、これらの要素が異なるブラウザで異なる表示をする可能性は低いです。 クラス名は非常に具体的であるため、開発者が予約クラスを知っているかどうかに関係なく、 copyrightクラスを持つ要素はcopyrightとして表示されます。

HTML 5のみ

XHTML 2.0にはないHTML 5機能の一部を以下に説明します。

Webアプリケーション用のAPI

HTML 5には、クライアント側の開発シェルを大幅に強化する多くのAPIが導入されています。 HTML 5は、ドキュメントをマークアップするための単なる言語ではなく、Webアプリケーションの技術スタックです。 これらのAPIの詳細は、現在Web APIワーキンググループによって作成されているため、HTML 5の他の部分と独立して採用することができます。 新しいAPIと関連要素は次のとおりです。

• canvasを介した2D描画API
• 新しいaudioおよびvideo要素で使用できるいくつかの形式をブラウザに提供する機能をサポートするオーディオおよびビデオ再生API。
• キー/値の形式とSQLデータベースの両方で、クライアント側の永続的なデータストア。
• Webアプリケーション用のオフラインAPI（ Google Gearsと同様）。
• WebアプリケーションがさまざまなプロトコルまたはMIMEタイプに自分自身をマップできるようにするAPI。
• グローバルなcontenteditable属性と組み合わせて使用​​できる編集API。
• ドラッグアンドドロップAPI。 draggable属性と組み合わせて使用​​できます。
• WebアプリケーションがTCPプロトコルを使用できるようにするネットワークAPI。
• ブラウザの閲覧履歴を反映するAPI。Webアプリケーションがエントリを追加できるようにします。これにより、ブラウザの[戻る]ボタンをクリックしたときに適切に作業できるようになります。
• HoneyドキュメントへのAPIメッセージング。
• 新しいevent-source要素と組み合わせてサーバーによってディスパッチされたevent-source 。

新しいアイテム

HTML 5には、XHTML 2.0では利用できない多くの新機能が導入されています。

• figureは、キャプション付きの画像またはグラフを表します。 ネストされたlegend要素にはタイトルが表示され、通常のimg要素が画像に使用されます。
• mは何らかの方法で選択されたテキストを表示します。 たとえば、検索結果を表示するときに単語を強調表示するために使用できます。
• timeは日付とtime表示します
• meterに測定値または数量が表示されます
• datagridは、インタラクティブなデータツリーまたは表形式のデータを表示します
• commandは、ユーザーが実行できるコマンドを表示します
• event-source 、サーバーから送信されたイベントを「キャッチ」するために使用されます
• outputは、スクリプト計算の結果など、特定のタイプのoutput表示します
• progress -一連の時間のかかる計算の読み込みや実行など、プロセスの実行を表示します。

さらに、いくつかの新しい要素は、ドキュメントの一部を意味的にマークアウトするのに役立ちます。 それらの名前は、 section 、 article 、 header 、 footer 、およびaside footerてasideます。 また、新しいdialog要素は、子要素を使用してメッセージを表示することを目的としていますdtは送信者の名前、 ddはメッセージのテキストです。

ユーザーURIのPing

新しいping属性をaおよびarea要素で使用しa 、ユーザーを追跡できます。 この属性を使用すると、リンクをクリックしたときに通知する必要があるURIのスペース区切りリストを指定できます。これにより、リダイレクトまたはJavaScriptの使用を回避できます。

XHTML 2.0のみ

XHTML 2.0でのみ利用可能な新機能

任意のアイテムをリンクにすることができます。

XHTML 2.0では、 href属性はどの要素でも指定できるため、リンクになります。 この変更により、 a不要になりましたが、保持されています。

任意の要素を画像（または他のリソース）にすることができます

XHML 2.0では、 img要素が削除されました。 ただし、心配する必要はありません。どの要素も画像になります。 すべての画像には、画像自体と同等の長い説明があるという考え方です。 src属性を任意の要素に追加することにより、指定されたリソースを読み込み、要素の場所に配置するようブラウザに指示します。 何らかの理由でリソースが利用できない場合、要素のコンテンツが表示されます。 これにより、開発者は要素を相互にネストすることにより、異なるファイル形式とビューを使用して、いくつかの同等のリソースを提供できます。

文字列はbrを置き換えます

改行の挿入に使用される由緒あるbr要素もXHTML 2.0で削除されました。 それを置き換えるために、新しい要素l導入されました。 テキストの行を表し、現在のマークアップの規則に従ってbr後に続くspanように機能しspan 。

新しいヘッダー構造

番号付き要素h1を置き換えるために、新しい要素hとsectionが導入されました。 これの目的は、ドキュメントの階層構造を伝えることです。 現在の番号付きヘッダーは線形であり、ネストされていません。 親section sectionとh要素をネストすると、ドキュメントsection構造が明確になります。

新しいアイテム

XHTML 2開発チームは、より一般的で単純化された言語の作成に焦点を合わせました。 これを考慮して、彼らはさまざまなタイプのコンテンツを表すために多くの特殊な要素を追加することを控えました。 彼らは、新しいrole属性は、特殊な要素を不要にする豊富なメタデータを埋め込むためのメカニズムを提供すると主張します。 ただし、いくつかの新しい要素が含まれています。

• blockcodeコードはコンピューターコードを表します
• diは、 dl （定義リスト）内の関連用語と定義のグループを表します。 これは、意味や発音が異なる単語に便利です。
• handlerは、ハンドラーの言語を示すtype属性を持つスクリプト化されたイベントハンドラーを表します。 ブラウザがそれを理解しない場合、ハンドラー要素の子孫が処理されます（それ以外の場合は無視されます）。 したがって、ハンドラーを入れ子にして、複数の言語で実装を提供できます。

おわりに

両方の提案は有望に見え、一般的なWeb開発の問題を指す多くの新機能が含まれています。 しかし、単一の仕様が公式の推奨事項ではなく、しばらくの間そうなる可能性があります。

開始が遅れているにもかかわらず、HTML 5開発チームは業界から優れたサポートを受けており、推奨プロセスで大きな進歩を遂げました。 彼らの目標は、2010年までに相互作用する多くの実装を備えた完全な仕様を持つことです（これにも関わらず、W3Cコンソーシアムは承認プロセスのいくつかのステップを既にスキップしています）。 ほとんどの主要なブラウザ開発者の産業サポート（唯一の例外はMicrosoft）により、これらの仕様は、安定した状態に達するとすぐに一貫して迅速に実装される可能性があります。

普遍的な欲求は、標準の別の戦争を避けることです。 幸いなことに、両方の言語がXML名前空間をサポートしているため（または、HTML 5でDOCTYPEを切り替えるHTMLシリアル化の場合）、90年代に観察されたドキュメントの同じブラウザー表示依存関係が表示されることはほとんどありません。 標準の戦争を控えれば、Web開発の未来は明るいように見えます。 これらの新しいマークアップ機能とAPIは、Web開発の優れたラッパーを提供します。これにより、デスクトップアプリケーションとWebアプリケーションのギャップが狭められます。

オリジナル：マイクマローン、 XHTML 2 vs. HTML 5
翻訳：ヘリオス