- ベストアンサー
html5のhタグの厳密な使い方
- html5のhタグの使い方について疑問があります。h1タグだけで構成しても大丈夫なのか、下位互換の1～6hタグを使ってマークアップしたい場合はどうすれば良いのか不明です。
- 具体的な例として、<header>タグの中に<article>を入れた場合と、<header>タグの外に<article>がある場合で、どのようにhタグを使用すれば良いのか知りたいです。
- googleはアウトライン構造に基づいてhタグを正しく使用することを推奨していますが、どのように使用すれば良いのか気になっています。
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
そのまえにarticleの使い方が違うのですが？？ 簡単に言うと articleは内部に、header,section,footer要素を持つと期待されるそれ自体で完結した記事です。 <article> <header><header> <section> <article> <header></header> <section></section> <footer> </article> という意味です。 その文書にheader,footerがひとつしかなければ全体をarticleで囲う必要はありません。 <body> <header> <h1></h1> </header> <section><!-- h1～h6を必ずひとつだけ持つと期待される --> <h2>・・</h2><!--header/h1と同じレベルなら<h1>でも --> <section> <h3></h3> <section> <h4></h4> </section> </section> </section> <footer></footer> </body> h１～h6の階層の意味は、section要素の階層で見出しレベルが明白な場合は、 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ すべてをh1で統一しても良いが、後方互換もありh1～h6のレベルはsectionに合わせても良い。 ただし、何れかに統一せよ!! という意味です。 また、 A general rule is that the section element is appropriate only if the element's contents would be listed explicitly in the document's outline.( http://www.w3.org/TR/2012/CR-html5-20121217/sections.html#the-section-element ) ですからね。 articleはは、独立していますから、それ自体単独でh1を持ちえます。 どちらを使うべきかは ⇒The section element | HTML5 Doctor( http://html5doctor.com/the-section-element/ )
お礼
ネットで<section>と<article>の違いなど読み漁ったつもりでしたが 間違って解釈していたようです。 確かに<article>は単独で完結できると言う事は<header>も<footer>も入り得るのは 冷静に考えれば当たり前だなと納得できました。 サイト構築前に気付けて後の祭りにならず助かりました。 ご紹介頂いたリンクも参考にさせて頂きます。