HTML5 の section article の概念が理解しにくいため、実際に Blogger をアウトラインを意識しながらセクショニングしてみました。
まだ解説されているサイトさんが少なく、平均的と思われる方法を採りました。
Section
見出しをつけられるもの、または付けてもおかしくないもの。
Article
RSSでそのまま配信できる部分。
以下が概略ですが、決してこれが正解というわけではないです。
見出しをともなうブロックと Article は、暗黙的に Section の意味があります。
<div class="date-outer">
<h1 class='date-header'>2013年11月16日</h1>
<header><h1>投稿記事のタイトル</h1></header>
<div class='post-body entry-content'>
<data:post.body/>記事本文
</div>
<footer class='post-footer'></footer>
</article>
<div class='post-outer'>
その日の他の投稿記事
</div>
・
・
<h1>タイトル</h1>
コンテンツ
</div>
初め <div class='post-body'> の本文のみの部分も <section class='post-body'> にしましたが、記事内に見出しがないと、タイトルのないセクションになっていしまいシックリこなかったので投稿内で必要なときは <section> タグを書くようにして、Article の post-body 以外に <header> タグを追加して、記事本文を明確にしました。
footer には投稿者や公開日が含まれていますので Article だけで RSS の記事としてなり立ちます。
結局は見出しをすべて H1 にしただけになりました。
追々 <section> タグに変更したいと思います。
元々ブロガーは class でぴっちり指定してあるので、div だろうが section だろうが、nav だろうが気にする必要はありませんでした。古いブラウザでも HTML5 のタグに対応できるようにもなっています。
スタイルのところをちょこちょこっと変更するだけで見栄えはそのままです。
テンプレートにより色々ですけれど、だいたい次のあたり。
h2.date-header {} → h1.date-header {} （日付の見出し）
.widget h2 {} → .widget h1 {} (Widgetのタイトル)
h3.post-title {} → h1.post-title {}（投稿タイトル）
<h1> にすると検索に有利という話もありますが、だぶんあっても一時的なもので、いずれ対策されるでしょう。むしろ、Bing ウェブマスター ツールで警告が表示されていて心配しているところです。
レポート＆データ → SEO レポート
Google ウェブマスター ツールでは、警告はありませんでした。
セクションを意識してみて見出しの本当の意味を理解できたような気がします。これが一番の収穫。
XHTML2.0 では、<H> タグがあったらしいですが中止されてしまい残念。本当に、<H2> とか <H3> は必要ないと思いました。
投稿記事の構成よっては同じ階層のセクションの題でも小さく見せたいときがあります。
それで、<h1> 以外の見出しは必要なくなってしまったので、<h2> や <h3> タグをスタイルとして利用してみようかなと少し考えています。
見出しのタグは文字の大きさをあらわすものではない
というのは、よく間違いの例として挙げられますけど、どのみち <h1> でも <h2> でも同じなので、あえて使ってみようということです。