div

divタグ自体は特に意味を持っていないタグなのでレイアウト（見た目）のために用いられることが主流のタグです。html5以前は構造を表すタグが無かったため代わりにdivにidやclassを付与し、htmlの構造をわかりやすくするために用いられていました。

divタグの注意点

divタグは他のタグをグルーピングすることもできますが、意味のある要素ならば、それぞれのセクショニングコンテンツ用のタグを使うようにします。html5に対応していないブラウザに配慮するならhtml5のセクショニングコンテンツタグにはcssを当てずにdivタグにあてればいいと思われます。

html5ハイブリッド用例

divタグはページのいたるところで使用でき、入れ子にできるので、用例のように閉じタグをコメントしておくと、どこで閉じたかわかりやすくなりメンテナンス性が向上します

<header>
  <div class="heder">
    <p>
      サイトタイトル
    </p>
  <!-- /heder --></div>
</header>
<nav>
  <div class="nav">
    <ul>
      <li><a href="#">ナビ</a></li>
      <li><a href="#">ナビ</a></li>
      <li><a href="#">ナビ</a></li>
    </ul>
  <!-- /nav --></div>
</nav>
<article>
<div class="contents">
  <h1>メイン見出し</h1>
  <p>
    段落が入ります。
  </p>
  <section>
    <div class="section01">
      <h2>セクションの見出し</h2>
      <p>
        段落が入ります。
      </p>
    <!-- /section01 --></div>
  </section>
 <section>
    <div class="section02">
      <h2>セクションの見出し</h2>
      <p>
        段落が入ります。
      </p>
    <!-- /section02 --></div>
  </section>
<!-- /contents --></div>  
</article>
<footer>
  <address>
    連絡先
  </address>
  <p>
    copyright
  </p>
</footer>