HTMLの見出しとは？

「見出し」でドキュメントを構造化しよう！
　クローラー（ロボット）があなたのサイトのドキュメントを読み込んで、適切なキーワードを抽出してくれます。その時にドキュメントが適切な構造化を行っていると、より効果的にキーワードやキーワードの重みを検索エンジンに与えることができます。

　ドキュメントの構造化って何でしょう？構造化とか言われると難しそうに聞こえますが、文章の章立てと同じです。HTMLでは見出しと言い、ｈタグを使って表すことができます。そして、このｈタグは文章の章立てと同じように”深さ”を表すことができます。

ｈタグの記述
＜ｈ１＞～～～～～～～＜／ｈ１＞
上記の”１”の部分が深さになり、１～６まで指定できます。上記は”１”なので一番上位の見出しとなります。

ココで注意しなくてはならないのは、順序構造を正しく記述することです。

例：ホームページのデザインについての説明

＜ｈ１＞より良いページのデザインについて＜／ｈ１＞
 ＜ｐ＞より良いページとは何でしょうか？＜／ｐ＞
 ＜ｈ２＞パソコン向け＜／ｈ２＞
  ＜ｈ３＞ページレイアウト＜／ｈ３＞
  ＜ｐ＞パソコン向けのレイアウトは～＜／ｐ＞
  ＜ｈ３＞アイキャッチ＜／ｈ３＞
  ＜ｐ＞パソコン向けのアイキャッチは～＜／ｐ＞
 ＜ｈ２＞スマホ向け＜／ｈ２＞
  ＜ｈ３＞ページレイアウト＜／ｈ３＞
  ＜ｐ＞スマホ向けのレイアウトは、パソコンとは異なり～＜／ｐ＞
  ＜ｈ３＞アイキャッチ＜／ｈ３＞
  ＜ｐ＞スマホでは～＜／ｐ＞

　上記の例では、「良いページデザイン」が大見出しで、その中にパソコンとスマホの２つのテーマが２番目の見出しとして存在しています。パソコンとスマホではユーザインターフェイスの点からページデザインを考慮しないとならないので、それぞれの中でページレイアウトやアイキャッチについて述べられています。

　このように、構造的に正しい順序とすることと、より上位の見出しが上位のテーマを意味するようなキーワードを配置することが大切です。そして、必ず＜ｈ１＞のレベルから記述を開始して、見出しレベルは順番になるようにしてください。

　また、このような構造を取ることでお客様にもわかりやすいページを作成できるようになります。特に、会社概要・沿革などのページではしっかりした印象を与えることができます。

船橋の頭脳
Lightning Brains