ウェブデザイナーの日記

「h1タグはサイトの大見出しなのだからそこには正しいキーワードを含ませてbody直下に置け」

というのが大前提としてあるわけですが、昨今は効果が薄いように思われます。hタグをスッ飛ばして書かれたようなページが上位に表示されることはとても多いので。「それでもなおやはり私はこれについていきたい」という人だけお読みください。

通常の商用サイトでの話。ヘッダ部には企業ロゴやカテゴリのリンクボタンやFlash等の装飾的な画像が並んで次に見出しが来るというパターンが多いですよね。これだと、h1タグがヘッダの下にきてしまいます。昔は企業ロゴをh1で囲んでaltに適切な文字列を入れとくという方法でみんなやっていましたが、さいきんはaltテキストの重要性が底落ち気味なので悩む。ではどうするかというと、たぶん次の2パターンのどちらかになると思います。

方法その1: インデントで隠す。

body直下に<h1>〜</h1>を配置するが、これをcss指定にてindent:-10000px;でブッ飛ばす。するとブラウザには見えないようになります。このやり方は一見すると、グーグルが禁止している「意図的に文字を隠す」というペナルティに相当するように見えますが、昨今流行のcss + javascriptによるオンマウスオーバーのメニューでは画像転換にこれを使ってるケースが多いので、indent:-10000px;でブッ飛ばすのをペナルティとするならば多くのサイトがその対象になってしまうのだからギリギリオッケーであろうという世間の（どの世間じゃ？といいたくなるけど）認識でしょう。

ここで問われるのは「文字を隠しているか」ではなく「その見出し語がサイトの内容に正しくあっているか」であり、それがアクセシビリティを想定してなされたものであるならば、それをスパムとみなす検索エンジンの怠慢である。だからありえない。というエクスキュ−ズが与えられます。

方法その2: 絶対配置指定を使う。

body直下に<h1>〜</h1>を配置するが、これをcssによるposition指定で下の方にずらす。よってブラウザ上では見出しは下にあるけれど、htmlソース内では<h1>〜</h1>はbody直下にある。

このやり方は上に比べてたいへん公明正大な世間の（どの世間じゃ？）印象を得られます。メインコンテンツが3カラムあったとして真ん中のカラムに見出し語を配置したいというときなんかでも使えるのでグレートです。ただ短所もあって、見出しの長さがページに応じて変わる場合だと、絶対配置で行っているのでマージンが一定ぶんしか空けられず、1行でおさまるつもりが2行になってしまったなんていう場合には文字が重なって醜悪になります。phpで文字数に応じてマージンを可変するという方法もありますが、ブラウザ環境によって表示フォントの大きさが異なってしまうことを考えるとけっこうバギーです。

上のどちらの場合においても、細かい人なんかは外部cssファイルをrobots.txtでクロールされないようにするというところまで気を遣うようです。ごくろうさまです。.htaccessで禁止すると「見るなコノヤロ」という挑戦的な態度になるので、robots.txtの方がジェントルマンだよという認識があるんでしょうか。

-----------------------------

『seo』カテゴリのエントリ

• ページランク6なのに
• スパムなSEO業者
• SEO :: リンクを買うのは広告か？スパムか？
• YST アップデート（update）
• ヤフーで1位になりました :: このまえつくったサイト
• YSTバージョンアップ
• YSTの順位UPはhtml+cssコーディングだけで達成できるか
• 意味のないミラーサイトはやめましょう
• YST 下落のミステリー

コメント・プリーズ！

お名前 (your name)

(required)

url

(optional) ※公開されます。

メールアドレス (email)

(optional) ※公開されません。管理者にだけわかります。

コメント (comment)

(required)

 クッキーにお名前、url、メールアドレスを保存する。

※クッキーに保存すると次回から入力を省略できるので便利ですが、お使いのコンピュータに情報が残りますので、公共のパソコンなどからアクセスするような場合はチェックをはずしたほうがよいでしょう。

※コメント中のhtmlタグは実体参照に変換されます。たとえば、『<』は『&lt;』というかんじになりますのでhtmlタグをそのまま書き込んでくださってオッケーです。

ADD YOUR COMMENT! / コメントする