Article要素

<div class="entry">
  <p class="post-date">October 22, 2009</p>
  <h2>
    <a href="../semantics.html" rel="bookmark" title="link to this post">Travel day</a>
  </h2>
...
</div>

今まではこのように書いていたけど、HTML5ではこのように書ける

<article>
  <p class="post-date">October 22, 2009</p>
  <h2>
    <a href="../semantics.html" rel="bookmark" title="link to this post">Travel day</a>
  </h2>
...
</article>

でももっと改良できる。

<article>
  <header>
    <time datetime="2009-10-22" pubdate="">October 22, 2009</time>
    <h1>
      <a href="../semantics.html" rel="bookmark" title="link to this post">Travel day</a>
    </h1>
  </header>
....
</article>

h2の要素がheaderに取りこまれて、h1になっている。
header要素は、記事のヘッダを構成するすべての要素をグループ化するものだが、
articleを使って新しいセクション、つまり新しいノードを文書アウトラインに作成することができ、
セクションごとにh1要素が持てるのだ。

articleに囲まれたものを複数生成することで、h1も複数生成することが可能となる。
文書アウトライン中に自己完結したノードを定義し、h1要素はそのアウトラインノードへタイトルを
与える。ページ上のすべてのセクション要素は前のままのレベルを保つことが出来る。

入門 HTML5