見出し構造

解説

見出し構造は、ページの中身を、見出しの階層によって表した構造です。HTMLではh1からh6までのタグでレベルを分け、どの段落がどの話題に属するのかを、人にも機械にも伝えます。たとえば、スクリーンリーダーの利用者は、本文を頭から読むのではなく、見出しの一覧をたどって目的の節へ移動します。したがって、見た目の文字の大きさではなく、見出しタグそのものが意味を持つ点が要点です。

実務での使われ方

FAQサイトでは、見出しがページ内目次と記事内検索の手がかりになります。見出しは、ページ内目次の項目名としてそのまま使われることが多く、記事内を検索したときのヒット位置を示す手がかりにもなります。一方で、「概要」「注意点」のように中身の分からない語を並べると、利用者は目次を見ても目的の節にたどり着けません。そのため、「エラーコード403が出たときの対処」のように、節の中身を言い切る見出しにします。そうすれば、途中から読む人でも、自分の状況に合う節を選べます。手順が長い記事ほど、見出しの付け方の差が読み手の迷いに直結します。

注意点

見出しタグは、階層を飛ばさずに組み立てます。主な原則は次のとおりです。

• h1には、ページの主題を示す見出しを置く（1ページに1つとする運用が一般的）
• レベルを飛ばさない（h2の次にh4を置かない）
• 文字を大きく見せたいだけの目的で見出しタグを使わない

装飾のつもりで見出しタグを使うと、読み上げソフトが作る目次に本文の断片が紛れ込みます。そのため、強調だけが目的の場合は、太字やスタイルの指定で対応します。