HTML5化 Part3

前回の修正で、メインコンテンツ部分をarticleタグで括り、各記事もarticleでくくるようにしました。

<article id="main">
<article id="entry-hoge">
<header>エントリータイトル</header>
<div>エントリーボディ</div>
<footer></footer>
</article>
<article id="entry-fuga">
<header>エントリータイトル</header>
<div>エントリーボディ</div>
<footer></footer>
</article>
...
</article>

<article id="main">が果たして本当に正しいのか疑問に思ったので、1度、アウトラインをチェックする事にしました。

使用したのはこちらのサイト。

HTML 5 Outliner

現状を確認したところ、以下の通りに。

ピクチャ 6.png
Before

トップレベルはブログ名です。

その中にUntitled Section
その中に各ブログエントリーのタイトルが入っています。

Untitled Section?

<article id="main">によって、セクションが作られていますが、見出しが無いので、Untitled Sectionと表示されてしまっています。

何か気持ち悪いです(笑)

そこで、<article id="main">を、<div id="main">に変更してみました。

ピクチャ 5.png
After

すると、Untitled Sectionは消え、全て見出しの付いたセクションが並びます。

しかし、ブログエントリーとサイドバーの各コンテンツ(アーカイブへのリンク等)の見出しが同列に並んでいます。

これはこれで何か気持ち悪いです・・・。

ブログ名>エントリータイトル>サイドバーの各種コンテンツ
という並びが自然な気がするんですが。

とは言え、確信が持てないので、現状このままで行きます。

section/articleタグに若干仕様変更があったという話も聞いたのですが、
取り急ぎ次は、各エントリーのarticleタグの中を修正しようと思います。

完成までの道のり長過ぎるなこりゃ(笑)