header(ヘッダー)とh1とSEOの深い関係

2009年5月 1日

未だに悩むヘッダーとh1

SEOに強い(x)htmlの組み方(レイアウト/サイトの構造)については、まだまだ勉強しなければならないところが多いのですが、私を悩ませる1つの要素がヘッダーの構造です。つまり、重要と言われるh1をどこにどのように配置するか、ということです。いまさら・・・と言われそうですが、まぁ、ゴールデンウィークということで、自分で整理してみたいと思ったので。


私もそれなりに色々なサイトやブログを見ていますが、結構色々なパターンがあります。

画像ロゴ&h1(コンテンツページは「ページ/カテゴリタイトル+サイト名」)

ヘッダーその1
トップページ
ヘッダーその1(コンテンツページ)
コンテンツページ

これはこのサイトのパターンです。私はこのスタイルが一番好きですし、効果もあると思っています。h1をリンク(h1の中にアンカータグを入れる)にしたほうが良いという方もいらっしゃいますが、それほど大きな効果は無いと思っていますので、とりあえずやっていません。

サイト名称をh1に(全ページ統一)

ヘッダーその2
ブログではオーソドックスですね

ブログではこのパターンも良く見かけます。サイト名称をテキストでh1にして、さらにその中にアンカータグを入れてリンクさせる方法です。

サイト名称をh1にしてさらにh2をサブタイトル的に入れる(全ページ統一)

ヘッダーその3
欲張りすぎか?

気持ちは分かるのですが、個人的には好きじゃないですね。コンテンツページのSEOスモールキーワードのSEO)を考えた場合に、やはりh2は統一させたくないというのもありますし、なんだかなぁ・・・と思ってしまいます。

画像ロゴをh1にしてaltにキーワードを詰め込む

ヘッダーその4
やめた方が良いかも知れません・・・

デザイン重視で、余計なテキストなんて使いたくない!でもSEOのことは考えたい!といった場合に、苦肉の策として用いられる方法ではないかと思います。imgをh1で囲み、imgのalt属性にキーワードを入れる方法です。やったことが無いのでなんとも言えませんが、SEO的にはあまり意味が無いような気がします、と言うかやらないほうが良い気がします。

画像ロゴ&人の目には見えないh1

ヘッダーその5
やめましょう・・・

これもデザイン重視でSEOもそこそこ知っているデザイナーさんがやりがちな例だと思います。text-indent: -9999px;とやったり、top: -100px;とやったり、display:none;とやったりして、h1を画面から追い出してしまう方法です。私たちヒトの目にはh1が見えません。

これらの方法は、あからさまな隠しテキスト行為と判断される可能性を持っています。通常のWebデザインの範疇を超えて、Googleのガイドライン(隠しテキストと隠しリンク)に触れる恐れがあるということです。ということで、やらないほうが懸命だと思います。

うまくまとまらないけどまとめます・・・

バリエーションは無限にありますので、これくらいにします。記述の通り、私は一番目のパターン(このサイトの方法)が好きです。ページに応じてh1が変わる、ページごとの重要キーワードをh1に入れることができるというのが魅力です。

ちなみに、このサイトではh2以降は記事の中で使うようにしています。ナビゲーションにh2を持って来ているサイトもありますが、コンテンツページのSEOを考えれば、やはり各コンテンツの中で使うのが理想だと思っています(というか、普通の使い方ですけど・・・)。


さて、色々書いてきましたが、こんなまとめでいかがでしょうか?

  • 重要タグ(h1とか)、重要キーワードはページの上の方に入れる(参照:見出しタグ(h1〜h6)
  • コンテンツページでも効果的にhxを使う
  • やばそうな事(隠しテキスト系)はしない

このエントリーのトラックバックURL: http://www.seo-motto.com/mtos/mt-tb.cgi/385

コメント(4)

こんちわ。これは悩むところですよね。私はデザイン寄りの人間なので、「画像ロゴをh1にしてaltにキーワードを詰め込む」方法をながらくやってましたが、おっしゃる通りアレな部分がありますんで、どうしたもんだかと思いつつ、さいきんは

h1のみ、あるいはh1 + h2 を絶対配置する

というのをケースに応じて取り入れています。一般的なデザインですと、ヘッダロゴ画像の下にカラムが2つないし3つあったとして、左右どちらかのカラムのいちばん上に「プロフィール」的な部分があるでしょう?サイト紹介とか。アレをh1でくくって、絶対配置するんです。

デザインによっては違和感なくとりこめますし、text-indent: -9999pxやdisplay:noneみたいにトバす手法でないからいいかなと思って。私の個人的な意見ですが、これをやるときは、やけに小さい文字で目立たないところに置く、なんていうのはかなりワザとらしいかんじがするので、やるなら堂々と目立つテキストにするというのがよいかなと思っています。

こんにちは。
MIXさんも色々苦労されているようですねw

確かに絶対配置を使えば、htmlソース的には上部に重要タグ(h1)を置いて、どこにでも配置することができますね。余計なブロックを下に持っていくこともできますしね。絶対配置を駆使するというのも1つの考え方だと思います。

ただ、私なんかは素直にヘッダーにh1を置いちゃて良いんじゃないかなぁと思っちゃうんですけどね・・・。そこまでこだわらないというか。やっぱりデザイン寄りの方は、気になっちゃうんでしょうか。


こんにちは、はじめまして。私もSEOに苦労しているひとりです。実は昔(3年程前)にやっていて、PPCにシフトして、またSEOに戻ってきたら色々全然変わっていてビックリしてます。h1って意外と外した方が順位が上がったりとか、いろいろな話を聞きますよね。記事参考にしております。ありがとうございます。

こんにちは。コメントありがとうございます。
私もこんなサイトを運営しながら、未だにSEOには苦労しています(笑)試行錯誤の連続ですね。

何かお役に立てる情報をお届けできれば幸いです。

コメント

SEOもっと!のフィードRSSリーダーで購読する なう

 SEOもっと!のはてなブックマーク


有料ディレクトリ研究・5サービスを比較
サイトを検索
アクセスランキング
    loading

SEO Topics(最新6件)
SEO Topics(カテゴリ)
SEO Topics(アーカイブ)
最新のコメント
SEO 気まぐれ連載
SEOもっと!について
あわせてどうぞ!
  • あわせて読みたいブログパーツ