セクションの「見出し情報（header）」

現在は div 要素による階層の作り方に関しては、 W3C でははっきりと規定していないため、制作者によって記述がまちまちなのは事実です。ただ、「悪例」と同様の構造を有するサイトが複数あったのを確認しましたもので。特に私が不自然だと感じたのは、 h1 要素を含む div 要素の使い方。見栄えの為ならば仕方無いにせよ、「論理構造の明示」という観点から見れば、やや不自然かと思われます。

レナ姫のWeb研究室 より

ここで古林さんが問題視されているのは：

<div class="section1">
    <h1>大見出し</h1>
    <p>段落。</p>
</div>
<div class="section2">
    <h2>中見出し</h2>
    <p>段落。</p>
</div>

このような構造だと思うのですが、h1の兄弟としてグループ化されているp要素が、セクションの「本文」であったなら、明らかに不自然なマークアップです。しかし、このh1とpをひっくるめてそのセクションの「header」だとしたらどうでしょう。

<section>
    <section-header> ……HTMLではdiv要素
        <title>見出し</title> ……HTMLではh1要素
        <summary>要約</summary>……HTMLではp要素等
    </section-header>
    <section-body>
        <paragraph>段落。</paragraph>
        <paragraph>段落。</paragraph>
        ……
    </section-body>
</section>

というわけで私は、section-headerとsection-body要素もdivで明示することにしてみました。冗談半分ながら。