HTML / XHTML FAQ

FlaskのドキュメントとサンプルアプリケーションはHTML5を使用しています。多くの場合、終了タグがオプションの場合は使用されないため、HTMLがよりクリーンで高速に読み込まれることに気付くかもしれません。開発者の間ではHTMLとXHTMLについて多くの混乱があるため、このドキュメントではいくつかの主要な質問に答えようとしています。

XHTMLの歴史

しばらくの間、HTMLがXHTMLに置き換えられようとしていたように見えました。ただし、インターネット上のWebサイトはほとんど実際のXHTML（XMLルールを使用して処理されたHTML）です。これが当てはまる主な理由はいくつかあります。それらの1つは、InternetExplorerの適切なXHTMLサポートの欠如です。 XHTML仕様では、XHTMLはMIMEタイプ application / xhtml + xml で提供する必要があると規定されていますが、InternetExplorerはそのMIMEタイプのファイルの読み取りを拒否します。 XHTMLを適切に提供するようにWebサーバーを構成するのは比較的簡単ですが、そうする人はほとんどいません。これは、XHTMLを適切に使用することが非常に困難な場合があるためと考えられます。

痛みの最も重要な原因の1つは、XMLの厳格な（厳格で冷酷な）エラー処理です。 XML解析エラーが発生すると、ブラウザーは、エラーから回復して何ができるかを表示しようとするのではなく、ユーザーに醜いエラーメッセージを表示することになっています。 Web上の（X）HTML生成のほとんどは、無効なXHTMLを誤って作成することから保護しない非XMLテンプレートエンジン（Flaskで使用されるJinjaなど）に基づいています。 Kidや人気のあるGenshiなどのXMLベースのテンプレートエンジンがありますが、多くの場合、実行時のオーバーヘッドが大きく、XMLルールに従わなければならないため使用が簡単ではありません。

ただし、大多数のユーザーは、XHTMLを適切に使用していると想定していました。彼らはドキュメントの上部にXHTMLDoctypeを記述し、必要なすべてのタグをセルフクローズしました（<br>はXHTMLでは<br/>または<br></br>になります）。ただし、ドキュメントがXHTMLとして適切に検証されたとしても、ブラウザーでのXHTML / HTML処理を実際に決定するのはMIMEタイプであり、前述のように、適切に設定されていないことがよくあります。したがって、有効なXHTMLは無効なHTMLとして扱われていました。

XHTMLは、JavaScriptの使用方法も変更しました。 XHTMLを適切に操作するには、プログラマーはXHTML名前空間で名前空間化されたDOMインターフェースを使用して、HTML要素を照会する必要があります。

HTML5の歴史

HTML5仕様の開発は、Web Hypertext Application Technology Working Group、またはWHATWG（主要なブラウザベンダーであるApple、Mozilla、Operaによって形成された）によって「WebApplications 1.0」という名前で2004年に開始され、非現実的で後方互換性のない仕様ではなく、既存のブラウザの動作に基づいた、新しく改善されたHTML仕様。

たとえば、HTML4では、<title/Hello/は理論的には<title>Hello</title>とまったく同じように解析します。ただし、人々は<link />の行に沿ってXHTMLのようなタグを使用していたため、ブラウザーベンダーは、仕様で定義された構文にXHTML構文を実装しました。

2007年に、この仕様は、HTML5として知られるW3Cの傘下の新しいHTML仕様の基礎として採用されました。現在、XHTML 2ワーキンググループが解散し、HTML5がすべての主要なブラウザベンダーによって実装されているため、XHTMLは勢いを失っているようです。

HTMLとXHTML

次の表に、HTML 4.01、XHTML 1.1、およびHTML5で使用可能な機能の概要を示します。（XHTML 1.0は、XHTML 1.1およびほとんど使用されていないXHTML5に取って代わられたため、含まれていません。）

	HTML4.01	XHTML1.1	HTML5
`<tag/value/` == `<tag>value</tag>`	Yes 1	No	No
`<br/>`がサポートされています	No	Yes	Yes 2
`<script/>`がサポートされています	No	Yes	No
text / html として提供する必要があります	Yes	No 3	Yes
application / xhtml + xml として提供する必要があります	No	Yes	No
厳密なエラー処理	No	Yes	No
インラインSVG	No	Yes	Yes
インラインMathML	No	Yes	Yes
`<video>`タグ	No	No	Yes
`<audio>`タグ	No	No	Yes
`<article>`のような新しいセマンティックタグ	No	No	Yes

1: これはSGMLから継承されたあいまいな機能です。上記の理由により、通常はブラウザでサポートされていません。
2: これは、<br>などのタグのXHTMLを生成するサーバーコードとの互換性のためです。新しいコードでは使用しないでください。
3: XHTML 1.0は、下位互換性の理由から text / html として提供できる最後のXHTML標準です。

「厳密」とはどういう意味ですか？

HTML5には厳密に定義された解析ルールがありますが、解析を中止する必要があると単純に述べているXHTMLとは異なり、ブラウザが解析エラーにどのように反応するかを正確に指定します。一部の人々は、期待される結果を生成する明らかに無効な構文（たとえば、終了タグの欠落や引用符で囲まれていない属性値）に混乱しています。

これらの一部は、マークアップエラーが発生したときにほとんどのブラウザが使用する寛大なエラー処理のために機能しますが、実際に指定されているものもあります。次の構成は、HTML5では標準でオプションですが、ブラウザーでサポートされている必要があります。

<html>タグでドキュメントをラップする
<head>のヘッダー要素または<body>の本体要素をラップしています
<p>、<li>、<dt>、<dd>、<tr>、<td>、<th>を閉じる、<tbody>、<thead>、または<tfoot>タグ。
空白や特殊文字（<、>、'、"など）が含まれていない限り、属性を引用します。
値を持つためにブール属性を必要とします。

これは、HTML5の次のページが完全に有効であることを意味します。

<!doctype html>
<title>Hello HTML5</title>
<div class=header>
  <h1>Hello HTML5</h1>
  <p class=tagline>HTML5 is awesome
</div>
<ul class=nav>
  <li><a href=/index>Index</a>
  <li><a href=/downloads>Downloads</a>
  <li><a href=/about>About</a>
</ul>
<div class=body>
  <h2>HTML5 is probably the future</h2>
  <p>
    There might be some other things around but in terms of
    browser vendor support, HTML5 is hard to beat.
  <dl>
    <dt>Key 1
    <dd>Value 1
    <dt>Key 2
    <dd>Value 2
  </dl>
</div>

HTML5の新技術

HTML5には、Webアプリケーションの作成と使用を容易にする多くの新機能が追加されています。

<audio>および<video>タグは、QuickTimeやFlashなどの複雑なアドオンなしでオーディオとビデオを埋め込む方法を提供します。
<article>、<header>、<nav>、<time>など、コンテンツを理解しやすくするセマンティック要素。
<canvas>タグは、強力な描画APIをサポートし、サーバーで生成された画像がデータをグラフィカルに表示する必要性を減らします。
<input type="date">のような新しいフォームコントロールタイプ。これにより、ユーザーエージェントは値の入力と検証を簡単に行うことができます。
Web Storage、Web Workers、Web Sockets、ジオロケーション、オフラインアプリケーションなどの高度なJavaScriptAPI。

他の多くの機能も追加されています。 HTML5の新機能の優れたガイドは、MarkPilgrimのまもなく出版される本 Dive Into HTML5 です。ただし、まだすべてがブラウザでサポートされているわけではないので、注意してください。

何を使うべきですか？

現在、答えはHTML5です。 Webブラウザーの最新の開発を考慮すると、XHTMLを使用する理由はほとんどありません。上記の理由を要約すると：

Internet Explorer（残念ながら、現在市場シェアをリードしています）は、XHTMLのサポートが不十分です。
多くのJavaScriptライブラリは、必要な名前空間APIがより複雑なため、XHTMLもサポートしていません。
HTML5には、セマンティックタグや、待望の<audio>および<video>タグなど、いくつかの新機能が追加されています。
その背後にあるほとんどのブラウザベンダーのサポートがあります。
書くのがはるかに簡単で、よりコンパクトです。

ほとんどのアプリケーションでは、XHTMLよりもHTML5を使用する方が間違いなく優れています。

HTML / XHTML FAQ —フラスコのドキュメント

目次