正しいh1の使い方を考えてみた

webサイトをweb標準に準拠して作成する場合、正しいマークアップが必須となります。
今気になっているのが「h1」タグの使い方。
サイトタイトルをh1でマークアップするべきか悩んでいます。

web標準的観点から考えてみる

私はこれまでh1で、ページ毎にひとつ、サイトタイトルをマークアップしていました。 これが正しいマークアップだとずっと思っていたのですが、web標準に準拠した代表的なサイト2xup.orgでは、indexページのサイトタイトルのみh1タグでマークアップ、その他のページはpタグでマークアップしていました。また、indexページ以外では、タグページではタグ名を表示する部分にh1を、個別エントリーページではエントリーのタイトルにh1を使用していました。

最初この構成を見たとき、すごく違和感を感じてしまいました。（後述しますがそれは解消されます。）恐らくこちらの勝手な想像ですが、上ノ郷谷さんはページ内のコンテンツの重要性をあらわしているのかな？と思いました。indexページで一番重要なのはサイトタイトルだけど、その他のページではサイトタイトルはそれほど重要ではなく見出しからは外しているということでしょうか。

で、他の方はどうしているのか調べてみました。まずはhxxk.jpでは、全てのページにおいてh1をサイトタイトルにあててます。Lucky bag::blogも同様。さらにはpur*logも同様。

一方で、CYBER@GARDENと3ping.orgでは2xup.orgと同じ形をとっていました。ただ、3ping.orgは2xup.orgとは違って視覚的に見出しレベルが分かりやすい。indexページ以外では、大見出し的なサイトタイトルがなく、パンくずリストからindexへ戻れる仕組みになっています。h1にはカテゴリ名をマークアップしています。

これを見たとき、2xup.orgを見たときの違和感がなくなっていました。2xup.orgの場合はヘッダーが同じなので、見た目にだまされていました。

結論を言えば、2つのパターンが主流で、どちらも正しい方法と言えそうです。

  1. 各ページのサイトタイトル部分をh1でマークアップする。
  2. サイトタイトルとしての意味を持つのはindexページのみで、h1でマークアップ。その他のページのサイトタイトル表示に関してはindexへの戻りリンクとして機能している。カテゴリページではカテゴリ名、個別エントリーページではエントリータイトルをh1でマークアップ。

１．の場合の個別ページのサンプルソースコード

<html>
<head>
<title>サイトタイトル</title>
</head>
<body>
<h1>サイトタイトル</h1>
<p>サイトの説明</p>
・・・
</body>
</html>

２．の場合の個別ページサンプルソースコード

<html>
<head>
<title>エントリータイトル：サイトタイトル</title>
</head>
<body>
<p>トップページへの戻り（パンくずリストやサイトタイトル）</p>
<h1>エントリータイトル</h1>
<p>エントリー内容</p>
・・・
</body>
</html>

これまでのwebサイトの主流が、必ずページのトップにはサイトタイトルがあるという形でしたが、パンくずリストの導入やblogやCMSの構造からいって、必ずしもサイトタイトルが各ページの最重要項目ではないあるいは特に必要ないという考えに変わってきているのかもしれませんね。

では、逆から考えて、なんでindexページだけサイトタイトルをh1でマークアップするのかという疑問が浮かんできます。indexページだけあってトップのページは「目次」的要素があるからではないかなと思います。つまり「そのサイトの概要」が書いてあるのがindexページではないかと。indexページのテーマは「そのサイトの概要」ということですね。

h1に何を指定するかは、そのページの「テーマ」が何なのかについて考えてみれば、明確になってくるのかもしれません。今回はblog形式のものをみていきましたが、一般的なサイトにも同様のことが当てはまると思います。

SEO的観点から考えてみる

どうしてSEO的には、h1はページに1つしか推奨されていないのでしょうか？（正確には、「推奨されていないと思われているのか」になるとは思いますが。）一般的な文書では1ページに複数のh1（レベル1の見出し）があるのに、なぜwebでは推奨されていないの？

W3Cでは、1ページに1回しかh1タグを使用してはならないと定義していないはずです。そもそも W3Cの仕様書が1ページに複数のh1タグを使用しているのですから。

XHTML 1.0: The Extensible HyperText Markup Language (Second Edition)

多分、これもかなりの憶測にすぎないのですが、レベル1の見出しというのは見出しの中で最も重要な要素と捉えることができますが、h1がたくさんあると、最重要項目がたくさんあるのはおかしいと、スパム判定されるのではないかと思います。 （というか、h1をたくさん使用することにより、不正に検索エンジンのランキングの上位をねらうサイトが増えたため、スパム判定としたんだと思います。）

結局は検索ロボットのロジックが正しくわからないので、1ページ内にh1が複数あるとSEO的に不利なのかどうかはわかりませんが、適切にマークアップしていたら、複数あってもスパムと見なされることは・・・ないのかあるのか謎です。

投稿日:2007年6月 8日
« 前の記事 | webコラムのトップへ | 次の記事 »

トラックバック歓迎です。以下URLにて登録をお願いいたします。

このエントリーのトラックバックURL:

↓↓↓トラックバックしてくださった方々↓↓↓
※トラックバックされても管理人がスパムと判断したものは公開されません。

最近のコラム

top