h1の使い方とHTML5のアウトライン
h1の使い方
WEBページのマークアップを行う際に、SEOの観点からよくheading要素(h1,h2,h3,h4,h5,h6)の使い方に迷うことがあります。特に、h1の使い方として、h1は一つでないとSEO的に良くないとか、あるいは間違ったhtmlの書き方だとまで言う意見を読んだり、聞いたりしたことがあります。
結論から言うと、htmlの仕様ではh1を使う数が制限されているということはありません。SEO的に良くないということも根拠はありませんが、使い方次第と言えます。
例えば、h1が一つの場合で、body要素の直後に配置されたときは、そのh1はページの大見出し、つまりタイトル的な見出しになるので、これはとても大事になることは間違いないです。
一方、h1が複数の場合で、h1をただ続けて書いた場合には、各h1はページを章立てし、各章の見出しとなります。htmlの文法上、間違いではありません。ページ全体の大見出しがないという問題もありますが、検索エンジンは上部のコンテンツほど重視するだろうと推測するのであれば、それほど大きな影響はないかもしれません。ただ、やはりh1を大見出しとして使い、h2を章立てとして利用した方が、明快な文章構成になるとは思います。
では、h1を複数使う明確な必要性はいつあるのかと言えば、CMSなどで一つの記事がいろいろなページに挿入される場合などで、挿入先の章立て（アウトライン）が分からないときに、記事内部の章立て（アウトライン）をh1から作っておきます。ただし、この場合にはh1をただ続けて書くのではなく、セクション要素で明確にセクションを分けることになります（後述）。
heading要素のW3Cの定義を引用すると、
These elements represent headings for their sections.
The semantics and meaning of these elements are defined in the section on headings and sections.
These elements have a rank given by the number in their name. The h1 element is said to have the highest rank, the h6 element has the lowest rank, and two elements with the same name have equal rank.
意訳： heading要素は、各セクションの見出し／表題を表します。
heading要素の意味は、「見出しとセクション」の章で定義されています。
heading要素は、その名前の中にランクが与えられていて、h1要素が最高のランクで、h6が最低のランクです。同じ名前の要素同士は同等のランクを持ちます。
引用元： HTML5, A vocabulary and associated APIs for HTML and XHTML
W3C Candidate Recommendation 6 August 2013, 4.4.6 The h1, h2, h3, h4, h5, and h6 elements, W3C, 2013年8月6日
このように、h1を一回しか使ってはいけないとか、h1は無条件でページの大見出し（タイトル）になるとは定義されていません。
以上の議論はhtml5の場合でそれ以前はより曖昧で、基本的にはhtml5と同じように解釈されると思いますが、実際は解釈する側によります。
参照：7.5.5 Headings: The H1, H2, H3, H4, H5, H6 elements, The global structure of an HTML document, HTML 4.01 Specification
W3C Recommendation 24 December 1999, W3C, 1999年12月24日
heading要素にキーワードを入れることは、検索エンジンにWEBページのキーワードを正しく伝えるために有効な手段です。しかし、それゆえ、キーワードの詰め込みすぎが生じやすく、検索エンジンがペナルテイを課す対象になりがちと思われます。h1に限らず、heading要素には自然な形でキーワードを入れることをお薦めします。
HTML5のアウトライン
html5ではアウトライン（章立て、文脈）という概念が明確に定義されています。
セマンテイックWEBの流れから、文章の意味的構造をコンピュータが認識できるようにするためと思います。
heading要素はアウトラインを構成する重要な要素になります。以降では、アウトラインの作り方を説明するために、上記引用文で参照され、heading要素の意味が定義されている「見出しとセクション」の章を読みたいと思います。重要な文章を意訳した上で作り方をまとめ、最後に具体例を引用します。
4.4.10 Headings and sections
The h1–h6 elements are headings.
The first element of heading content in an element of sectioning content represents the heading for that section. Subsequent headings of equal or higher rank start new (implied) sections, headings of lower rank start implied subsections that are part of the previous one. In both cases, the element represents the heading of the implied section.
意訳： 4.4.10 見出しとセクション
h1–h6要素は見出しです。
セクションコンテンツ要素の中で一番最初に現れる見出し要素が、そのセクションの見出しになります。
後続に現れる同等以上のランクの見出し要素は、暗黙的に新しいセクションを開始します。同等未満のランクの見出し要素は、そのセクションのサブセクションとなります。どちらの場合も、見出し要素は暗黙的なセクションの見出しとなります。
追加：セクションコンテンツ要素とは、article,aside,nav,sectionです。ちなみに、headerとfooterはセクションコンテンツ要素ではありません。セクションの中でヘッダー部分とフッター部分を明示する要素です。
Certain elements are said to be sectioning roots, including blockquote and td elements. These elements can have their own outlines, but the sections and headings inside these elements do not contribute to the outlines of their ancestors.
blockquote,body,details,dialog,fieldset,figure,td
Sectioning content elements are always considered subsections of their nearest ancestor sectioning root or their nearest ancestor element of sectioning content, whichever is nearest, regardless of what implied sections other headings may have created.
意訳： セクションルートと呼ばれる要素もあります。これらの要素は、その要素自身のアウトラインを持つことができます。これらの要素の中のセクションと見出しは、これらの要素が入っているページのアウトラインから除外されます。
blockquote,body,details,dialog,fieldset,figure,td
セクションコンテンツ要素は常に、一番近くて上位のセクションルート、又は一番近くて上位のセクションコンテンツ要素のサブセクションとみなされます。一番近いセクションであって、見出し要素によって暗黙的に作成された暗黙的なセクションであっても変わりません。
Sections may contain headings of any rank, and authors are strongly encouraged to use headings of the appropriate rank for the section’s nesting level.
Authors are also encouraged to explicitly wrap sections in elements of sectioning content, instead of relying on the implicit sections generated by having multiple headings in one element of sectioning content.
意訳： セクションはどのようなランクの見出しを含んでもよい。ただ、セクションのレベル（章立て）にあった適切なランクの見出しを使うことが強く推奨される。
また、セクションをセクションコンテンツ要素で明示的に囲うことが推奨される。つまり、一つのセクションコンテンツ要素の中に複数の見出し要素を入れて暗黙的にセクションを作成するのではなく、である。
引用元： 4.4.10 Headings and sections, HTML5, A vocabulary and associated APIs for HTML and XHTML
W3C Candidate Recommendation 6 August 2013, W3C, 2013年8月6日
以上の文章をまとめると、html5でのアウトラインの作り方は、
1.blockquote,body,details,dialog,fieldset,figure,tdがアウトラインのルートとなる。
2.article,aside,nav,sectionがセクションを構成する。
3.上記各要素の一番初めに出てくるheading要素が各要素の見出しとなる。
4.後続に現れる同等以上のランクの見出し要素は、暗黙的に新しいセクションを開始する。同等未満のランクの見出し要素は、そのセクションのサブセクションとなる。どちらの場合も、見出し要素は暗黙的なセクションの見出しとなる。
ここで、4.の「後続に現れる同等以上のランクの見出し要素は、暗黙的に新しいセクションを開始する。」について、暗黙的に作成された新しいセクションのアウトライン上の挿入位置についての説明がありませんが、後述する具体例を見る限り、
ｰ セクション要素の見出しとなっているheading要素と比較して同等以上のランクの見出し要素である場合には、そのheading要素のランクに関わらず、そのセクションと並列のセクションとして作成される。
ｰ セクション要素の見出しとなっていないheading要素、つまり暗黙的にセクション要素を作成するheading要素と比較して同等以上のランクの見出し要素である場合には、そのheading要素のランクを考慮して、他の暗黙的にセクション要素を作成するheading要素と比較しつつ、セクションの挿入位置が決まる。
と処理されるようです。後者は、従来の章立ての方式と同じです。
具体例を引用します。
<body> <h1>Foo</h1> <h2>Bar</h2> <blockquote> <h3>Bla</h3> </blockquote> <p>Baz</p> <h2>Quux</h2> <section> <h3>Thud</h3> </section> <p>Grunt</p> </body>
上記の例は、
1.Foo（明示的bodyセクションの見出し、Grunt段落を含む）
1.Bar （暗黙的なセクションを開始する見出し、Bla引用分とBaz段落を含む）
2.Quux （暗黙的なセクションを開始する見出し、内容なし）
3.Thud（明示的sectionセクションの見出し）
というアウトラインを表します。
ちなみに、Bla引用分はセクションルートになり、アウトラインから除外されています。
以下はすべて同じアウトラインを示します。
<body> <h4>Apples</h4> <p>Apples are fruit.</p> <section> <h2>Taste</h2> <p>They taste lovely.</p> <h6>Sweet</h6> <p>Red apples are sweeter than green ones.</p> <h1>Color</h1> <p>Apples come in various colors.</p> </section> </body><body> <h1>Apples</h1> <p>Apples are fruit.</p> <section> <h2>Taste</h2> <p>They taste lovely.</p> <section> <h3>Sweet</h3> <p>Red apples are sweeter than green ones.</p> </section> </section> <section> <h2>Color</h2> <p>Apples come in various colors.</p> </section> </body><body> <h1>Apples</h1> <p>Apples are fruit.</p> <section> <h1>Taste</h1> <p>They taste lovely.</p> <section> <h1>Sweet</h1> <p>Red apples are sweeter than green ones.</p> </section> </section> <section> <h1>Color</h1> <p>Apples come in various colors.</p> </section> </body>
ちなみに、
1.Apples
1.Taste
1.Sweet
2.Color
というアウトラインを表すと思われます。
引用元： 4.4.10 Headings and sections, HTML5, A vocabulary and associated APIs for HTML and XHTML
W3C Candidate Recommendation 6 August 2013, W3C, 2013年8月6日
以上のように、多少分かりにくい部分もありますが、html5のアウトラインをしっかり作ってWEBサイトを構築することは、検索エンジンにWEBサイトの内容を正しく伝えるために重要な作業になります。