ホームページ > 記事 > ウェブフロントエンド > HTML5とXHTML2の違い
ほとんどの人は、HTML 4 と XHTML 1 を使用して Web ページを作成します。セマンティック HTML、HTML 構造の検証、ドキュメントのアクセシビリティの向上の概念を理解している HTML 愛好家は比較的少数です。高品質の HTML ドキュメントは、トレードオフ、デザインの最適化、議論を繰り返した結果です。あらゆる批判にもかかわらず、HTML の人気に匹敵する言語はありません。ほとんどのユーザーは、あたかもそのように生まれてきたかのように、標準の現状に満足しています。
しかし、他の多くの標準と同様に、HTML には後継のものが存在します。現在でも専門家は、現在のバージョンの既知の問題をすべて修正して、HTML の次のバージョンについて検討しています。他の群衆と同様に、これらの専門家はこの研究の将来の方向性について意見が異なります。
新しい HTML バージョンの最初の提案は、W3C 組織内の作業グループから出されました。作業グループのアイデアは、XHTML 2 を中心に展開しています。この標準は、XHTML をさらに純化し、HTML の最初のバージョンの設計概念に戻るという当初の開発方向を継続しています。
W3C 以外の一部の重要な HTML 専門家 (ブラウザ ベンダー、Web 開発者、作成者など) は、XHTML 2 の方向性に同意していません。 2004 年に、彼らは新しい HTML バージョンの新しいデザインの方向性を提案するために独立したワーキング グループを設立しました。 WHATWG (Web Hypertext Application Technology Working Group) という名前で、彼らは HTML 5 と Web Forms 2 を立ち上げました。
数年後、HTML の別の方向性が作業草案で明確に説明されました。 2007 年 4 月、W3C は HTML 5 を (まだ) 公式標準として認めずに、標準審査プロセスに認めるかどうかについて投票しました。ほとんどの人が同意します。興味深い状況が生じます。W3C は、HTML と XHTML の 2 つの競合する後継テクノロジに同時に取り組んでいます。理論的には、どちらにも十分な理由があります。実際的に言えば、すべての主要なブラウザに両方の標準をサポートさせるには、乗り越えなければならないハードルが数多くあります。
これが現在の状況を引き起こした基本的な事実です。 2 つの提案の本当の違いについて議論することの方が有意義でしょう。この記事では、両方の提案の基本を概説し、その背後にある設計コンセプトを分析します。
よく使用される略語
CSS: Cascading Style Sheets
HTML: Hypertext Markup Language
W3C: World Wide Web Consortium
XHTML: Extensible Hypertext Markup Language
XHTML の簡単な歴史
XHTML 2 の背後にある設計哲学を理解するには、少しの歴史が必要です。 1990 年代初頭、HTML の最初のバージョンは標準汎用マークアップ言語 (SGML) に基づいていました。主な違いは、ワールド ワイド ウェブの重要な基盤であり成功要因であるハイパーリンク プロパティです。 SGML と同様に、HTML を使用すると、作成者はヘッダーを段落、順序付きリスト、および順序なしリストから分離して文書の構造を記述することができます。画面に表示される結果はブラウザによって異なります。
Web の人気が高まるにつれて、HTML ユーザーはページの外観と操作性を制御することを要求します。ブラウザ ベンダーは HTML 2 および 3 の新機能を導入しました。 Web ページは理解しにくくなり、複雑なネストされたテーブル構造がページ レイアウトを制御する主な手段になります。ドキュメントの残りの部分は、フォント タグと色の宣言で埋められます。元の文書構造を整理するのが困難になっています。
HTML 4 はこの混乱を終わらせるために登場し、プレゼンテーション ロジックを CSS にプッシュし、高度なコンテンツ配置のためのレイヤー (DIV) を導入しました。これは、HTML 3 と比較してコード記述モデルが変更されたことを意味します。移行プロセスを簡素化するために、古い HTML 3 構造は HTML 4 の移行バージョンを通じてサポートされています。上級ユーザー向けの厳密バージョンでは、コンテンツとプレゼンテーションを明確に分離する必要があります。
最初の HTML 4 Web サイトは、新しい Holy Grail のような DIV を使用し、ヘッダーを含む (ただしこれに限定されない) ページ上の少し洗練する必要があるほぼすべての要素に DIV を使用していました。 HTML スタイル属性は、プレゼンテーションの詳細を記述するための一般的な場所です。ついに、乱雑なテーブルがウェブから削除されました。ただし、コンテンツとプレゼンテーション ロジックは依然として混在しています。重要な CSS ファイルの長さはわずか数行です。
最近、一部の有名な Web 開発者が、HTML 4 スタイルシートに対するより賢いアプローチを考案しました。最新のブラウザでは、CSS プロパティは DIV 要素に限定されません。必要に応じて、HTML 要素のスタイルを指定できます。多くのウェブログがセマンティック HTML について話し始めました。 DIV 要素に対する完全な禁止はありませんが、Web ページ作成者はコンテンツを最もよく表す HTML 要素を使用し始めています。たとえば、ほとんどの Web サイトのナビゲーション メニューは、順序のないリストとして説明するのが最も適切です。別の例として、段落要素に bigHeader のようなクラス名を使用する代わりに、H1 要素を使用し、必要に応じて CSS を使用して表現を変更します。
一方、W3C は、整形式で有効な HTML 4 に準拠する XML のバージョンとして XHTML 1 を提案しました。 XML ユーザーにとって、これにより、XML コンテンツを Web ページに変換し、変換結果を既存のバリデーターと照合するタスクが簡素化されます。 XHTML 1.1 は、さまざまな問題をさまざまなモジュールに分離しようとします。モジュール式のアプローチにより、さまざまなニーズに合わせて標準のさまざまな部分を再利用したり、新しい機能で標準を拡張したりすることが容易になります。
XHTML 1.1 は、HTML 4 よりもさらに多くのユーザーを抱えており、コンテンツとプレゼンテーションを分離しています。ただし、これまでと同様、実際的な問題の中には、CSS のトリックを使用することによってのみ解決できるものもあります。たとえば、順序なしリストで表されるメニュー構造には、美しい画像が含まれることがよくあります。ただし、テキスト読み上げ機能を使用して視覚障害者に画像を読み上げるのは簡単ではありません。また、Lynx のようなテキスト ブラウザでは画像を表示できません。複雑な CSS トリックを使用すると、テキストを非表示にしてブラウザーに画像を表示できます。しかし、ページごとにメニューが異なると、その部分をCSSで指定するのが難しくなります。
XHTML 2 の背後にある設計哲学
XHTML 2 の背後にある最も重要な設計哲学は、コンテンツとプレゼンテーションをさらに分離し、HTML 4 と XHTML 1 に残っている欠陥を改善することです。たとえば、順序なしリスト内の各項目の画像を指定するためのネイティブ サポート。元の IMG SRC タグは、任意の要素で使用できるオプションの SRC 属性に置き換えられます。変更された CSS はコンテンツから完全に分離されており、画像をサポートしていないデバイスでも代わりにテキストを簡単に表すことができます。
しかし、Web 開発者にとっての課題は CSS だけではありません。サーバーや HTML フォームとの対話に多くの時間が費やされ、大量の JavaScript™ コードが使用されます。フォームは 1 次元のキーと値のペアに限定されます。 JavaScript コードを開発するのは大変な作業ですが、テキスト読み上げデバイスのようなインターフェイスでは役に立ちません。
XHTML 2 は、モジュラー アプローチに基づいて、HTML フォームを XForms モジュールに置き換え、適切なアプリケーション モデルを使用して一般的な問題のサポートを追加します。 XForms では、スクリプトを 1 行も書かずに、対話ロジック、検証ルール、計算方法を指定できます。さらに、この手法ではキーと値のペアではなくリッチな XML 構造を使用するため、ネストされたサブフォームや要素の繰り返しが可能になります。強力なエンジンを提供することに加えて、テキスト読み上げデバイスは、アプリケーションの豊富さを変更するのにより適しています。
XForms に加えて、XML イベント、XFrame、Ruby (アジア言語) など、他のニーズを満たすために独立した仕様に抽出された XHTML 関連の問題もあります。
表現の分離に伴い、プログラミングも標準から分離されます。 onClick などのインタラクション プロパティは、XML イベント モジュールに置き換えられます。 XML イベント仕様自体がこの目的のために設計されているため、ユーザー インターフェイスを操作するためのより強力なツール セットが提供されます。
XHTML 2 の革新について、要約すると、基本的な考え方はさまざまな問題を解決することです。この問題は HTML の二次的な機能ではなくなり、新しい仕様の主な目的になります。したがって、新しい仕様は、最適化が直面する問題に最も適しています。ただし、異なる問題を異なる方法で扱うことは、実践というよりも哲学の問題です。このツール セットの使用に慣れている賢明な開発者は、必要な結果を得ることができます。ただし、現在の HTML バージョンの平均的なユーザーが高品質の XHTML ドキュメントを作成できるかどうかを判断するのは簡単ではありません。
XHTML 2 はおそらく一般の HTML ユーザーをターゲットにしていません。しかし、優れた開発者の手に渡れば、アクセシビリティを向上させる素晴らしい方法となる可能性があります。
HTML 5 の設計哲学
WHATWG は、HTML 5 を設計する際に、より現実的なアプローチを採用しました。このワーキング グループは、問題の分解などの抽象的な概念を考慮せず、W3C 仕様とはまったく異なる現在の主流ブラウザの動作に基づいてドキュメントを作成しました。本ワーキンググループでは、上記の分析を踏まえ、HTMLの実用化について検討を行いました。
この情報に基づいて、作業グループは平均的な Web 開発者の作業を簡素化することを目的とした取り組みを提案しました。 HTML 5 は以前のバージョンの HTML から派生したと主張していますが、その主な目的は純粋さではありません。たとえば、モジュール型ドキュメントの主な目的は、最適化された Web アプリケーションへの置き換えを容易にすることです。
この目的に基づくモジュール言語は、Web アプリケーションの開発を大幅に簡素化します。たとえば、HTML 5 は、データ テーブル、メニュー、ツールバーなどの対話型コンポーネントをサポートしています。デフォルトの動作で説明的な HTML 要素を使用すると、汎用 DIV の動作をシミュレートするために大量のコードを記述する必要がなくなります。
HTML 5 仕様は HTML 要素と属性に限定されません。これは、ドキュメント編集およびドラッグ アンド ドロップ操作のための特殊な JavaScript API を定義します。このアプローチは、問題を分解することとはまったく異なります。これにより、Web 開発者 API が簡素化されますが、仕様のサイズは増加します。
HTML 5 は、XHTML 2 が XHTML 1 に似ているよりも、HTML 4 に似ています。移行パスはより平坦であり、経験豊富な HTML 4 開発者は新しいバージョンに慣れるのが簡単です。新しい機能も同様のロジックに従います。特定の要素に特化したイベント属性を使用すると、HTML エディタでより適切なテキスト補完機能を提供できるようになります。
現在の Web アプリケーションは、サーバーと対話するために非同期 JavaScript XML (Ajax) に依存しています。 HTML 5 は、サーバーとの対話の重要性を認識しており、セキュリティ上の問題を引き起こすことなく、ネットワークと対話し、受信したサーバー イベントを配布し、他のドメインからドキュメントにメッセージを送信するためのさまざまな方法を定義しています。
HTML 5 の基本的な設計哲学は、Web 開発者が必要とする機能で HTML 4 を拡張することです。 HTML 5 は、HTML 4 の基本技術を継承しつつ簡素化しています。 HTML V4 の欠点を解決するために、HTML V5 では最も単純かつ直接的な再設計方法が選択されています。
新規格の実用化
XHTML V2 と関連モジュールは W3C によって正式にサポートされており、関連モジュールは W3C によってサポートされる他の XML 仕様の重要な要素になります。残念ながら、W3C による公式の承認は、主要な Web ブラウザーでのサポートを保証するものではありません。 XHTML V2 のサポートは一般に問題ありません。最新のブラウザはすでに多くの機能をサポートしています。 XHTML V2 を正しく使用できるかどうかは、関連するモジュールが利用できるかどうかによって異なります。この記事の執筆時点では、Microsoft が Windows® Internet Explorer® を拡張して XML イベントおよび XForms 機能をサポートするかどうかは不明です。 XML イベントを含む Mozilla XForms プラグインは、数年間にわたって開発されてきました。このプラグインは、このテクノロジーの機能を向上させ、実装の難しさを軽減します。
HTML V5 仕様の作成では、ブラウザのメーカーとの綿密なコミュニケーションが維持され、実装の問題が常に考慮されました。チームは W3C の公式承認については疑問を表明しましたが。 FAQ では、いつ正式な承認が得られるかという質問に正式に回答していません。 W3C の立場に関係なく、ブラウザ ベンダーは非公式の HTML 5 標準を実装することを決定したようです。ブラウザメーカーが公式標準のリリースを急ぐのはこれが初めてではない。
競合する標準
現時点では、HTML 5 も XHTML 2 も公式の推奨事項ではありません。将来的には細部が変更される可能性があります。ただし、開発の方向性は変わりません。どちらも現在の標準のいくつかの欠点を解決しています。将来のブラウザがこれら 2 つの新しい標準のサポートをどのように追加するかはまだわかりません。現在のブラウザは HTML 4 と XHTML 1 の両方をサポートしています。同様に、将来のブラウザは HTML 5 と XHTML 2 の両方をサポートする可能性があります。どちらの標準にもそれぞれの支持者がいます。
HTML 4 よりも XHTML 1.1 に関心があり、さまざまなデバイスをサポートできるドキュメントを作成したい場合は、XHTML 2 の方が良いかもしれません。 XML 標準に準拠しているという理由だけで XHTML 1 を使用しており、HTML 5 の新機能を好む場合は、XHTML 5 (XML で書き直された HTML 5) が最良の選択となる可能性があります。
HTML 5 は、HTML 4 を使用してインタラクティブな Web アプリケーションを作成する開発者に人気があります。このアプローチは、WYSIWYG ドキュメント エディターを使用しているサイトでより実現可能です。ただし、ケースバイケースでは、HTML 4 と XHTML 1 は長期間にわたって共存する可能性があります。
その他の関連チュートリアルについては、Html5 ビデオ チュートリアル
をご覧ください。