HTML5 要素とセマンティクス

HTML5に追加された概念に、セクションとアウトラインという概念があります。
セクションは区切りを意味し、アウトラインは階層や構造を意味します。 セマンティクスとは文章の意味合いに沿って要素の意味付けを明確にマークアップすることをいいます。

例えば下記のようにsectionで入れ子にして文章をまとめます。

<section>

  <h1>要素とセマンティクス</h1>
  <section>
    <p>HTML5に追加された概念に、セクションとアウトラインという概念があります。<br>
    セマンティクスとは文章の意味合いに沿って要素の意味付けを明確にマークアップすることをいいます。</p>
  </section>

  <h1>セクションとは</h1>
  <p>文章のひとくくりを意味します。section要素により明示的にセクションを定義できますが、
      h1~6タグで暗黙的にセクション分けされます。</p>

</section>

セクショニングルート

セクションのルートとなる要素を指し、親のアウトラインから独立したアウトラインを持つことができる要素です。
http://www.w3.org/TR/2012/WD-html5-20121025/single-page.html#sectioning-root

セクショニングルートの要素

• blockquote
• body
• details
• fieldset
• figure
• td

<section>
  <h1>おじいちゃん</h1>
  <section>
    <h2>おかん</h2>
    <section>
      <h3>たかし</h3>
      <section>
        <blockquote> <!-- セクショニングルートの要素 -->
          <p>赤の他人のおじいちゃん。たかしとも面識は無い</p>
        </blockquote> 
      </section>
    </section>
  </section>
</section>