暖冬ながら、寒暖の差が激しいですね。1〜2月は鬼門なのか、体調を崩して単純ヘルペスに掛かってしまいました。これから決算期という方も多いと思いますが、皆さんも体調にはお気をつけて。
さて、先月予告したように、今月はHTML5の特徴についてです。が、思いのほか、言及すべき事柄が多かったので、今月はその前編です。

分別に便利な新しい構造化要素

まずは前回も取り上げた新要素のうち、文書の構造化に関わるブロック要素（HTML5ではflow content）から。

これらは文書中の内容を、目的や重要度ごとに分別しやすくするための要素です。これによって、第三者（ウェブ上の情報を収集するウェブアプリケーション提供者）が必要な情報だけを選り分けて収集・再構成しやすくなるほか、閲覧者もユーザースタイルシート等で余計な情報をフィルタリングしやすくなります。

たとえば、ブログやニュースの記事に専念したい場合、article要素の内容だけを抽出｜表示させるようにしたり、さらにarticle要素の中でも余計なaside要素の内容を除去｜非表示させたりといったことが、容易にできるようになります。（もちろん、これらの要素によって、内容の分別を行っているページに限定されますが）

こぼれネタ: Safari 4製品ページのHTML5

筆者も驚きましたが、Appleが先日パブリックベータを公開して話題になっているSafari 4の製品ページがHTML5を採用しています。こちらは先月（連載 #21）言及したAn Event ApartやUX Londonの事例のような新しいDOCTYPE宣言だけでなく、section, header, footer要素なども使われています。

ただ、すでに一部で指摘されているように、肝心のマークアップがHTML5の要件に適合していません。具体的には、sectioning content（nav, article, section, asideなど）を内包できないheader要素内でnav, section要素を使っていたり、Heading content（header, h1-h6）を内包できないfooter要素内で見出し（h3）要素を使っているなどです。

今後も内容モデルに変更がないとすれば、いずれの違反も、わりと今後も起こりうる、ある意味で典型的な違反例といえそうです。この機会に留意しておくと良いでしょう。

特にheader要素は、よくある「グローバルナビゲーションも含めたヘッダー領域」と捉えてしまうと、同様の間違いを犯してしまいやすくなります。header要素は、以下のように主題と副題をひと括りにする場合に利用するほか、草案では更新履歴を含めるユースケースも紹介しています。当該セクションのメタ情報を含みうる見出し領域といったところでしょうか。

<section>
 <header>
  <h1>Safari4製品ページのHTML5</h1>
  <h2>header, footer要素で犯しがちな間違いの例</h2>
 </header>
 <p>気をつけましょう。</p>
</section>

実はこれらの要素は、従来のclass属性を活用することでも、機能的には充分 実用に堪えます。個人的にはmicroformatsのような、より下位のコミュニティ標準で、語彙や用法のコンセンサスを取ることができれば、後方互換の問題も気にすることなく、またコミュニティごとの固有の語彙やモデルを選択・利用できて良いようにも思うのですが……。（この辺はまた別の機会に）

• HTML 5 - 3.4 Content models
• HTML 5 - 4.4 Sections（W3C）
• HTML 5 differences from HTML 4 - New Elements（日本語訳）
• HTML 5: The Markup Language（W3C）

続いては、文書型宣言と文字エンコーディング記述の簡素化、a要素について見ていきましょう。