sectionの使い分けルール - 汎用セクション要素：HTML5リファレンス

HTMLのsection要素は、大抵の場合見出しを伴う文章内の章や節などで使います。

HTML5以前は具体的な要素が無かった為、セクションを表現するのにdivタグを使っていました。sectionがふさわしくない場合はdivタグを使います。

sectionの使い方

sectionの子要素には見出しタグを入れましょう。

<h1>sectionの使い方</h1>
<section>
  <h2>見出しを入れましょう</h2>
  <p>本文とセットです。</p>
</section>

間違った使い方

section要素は見出しと本文の両方をまとめるのに使います。

■間違った使い方
<section>
  <h1>sectionの使い方</h1>
  <section>
    <p>入れ子だと別セクションになるので見出しが必要</p>
  </section>
</section>

■正しい使い方
<section>
  <h1>Criteria</h1>
  <div>
    <p>この様にdivで囲みましょう</p>
  </div>
</section>