ヒットサーチ

検索され易いタグ・HTML構成

検索され易いページの基本を理解して下さい!

とにかくページ数を増やしましょう!!

コツは一気に増やさず、徐々に増やす!と検索エンジンも「あ!定期的に運営しているサイトだな」と評価されます。また、メタタグなどもそのページに沿った内容に書き換えることをお忘れなく!

同ページをコピーして増やす行為はSEOスパムなので絶対NGです。

キーワードは連打しないで下さい!!

例えば狙っているキーワードが「SEO」の場合、「SEO,SEO,SEO・・・」と文章、あるいは画像(alt)に埋め込むのはNGです。本当にさりげなく入れて下さい。

画像(alt)にテキストを入れるようW3Cで推奨しているので、そのテキストに記述する際も意識し過ぎないようにして下さい。

見出し「H1〜H6」をきちんと使い分けましょう!!

ご承知の通り「H1」で囲んだ言葉は文章内で最重要視されます。だからと言って、このH1タグを1ページに複数使用するとSEOスパムになりますので十分ご注意下さい。また、画像(altタグ)にキーワードを入れ、その画像をH1タグで囲んでいるサイトが現在なお多数存在します。2011/1現在ではスパムとされておりませんが、これはグレーラインのSEOテクニックなので絶対止めて下さい!
尚、CSSで装飾する場合は、文字サイズを小さくし過ぎないように注意して下さい。また、「H1が12px/H6が12px・・・」というようなサイズ指定をせず、きちんと「H1は20px/H2は18px・・・」という見出しとサイズを比例させて下さい。H1〜H6の背景にCSSで画像を入れれば、多少見栄えも良くなります。できるだけタイトルはテキストで構成することを推奨します。

濃い背景画像(背景色は白)と文字に白を使用する場合は、必ず「CSSが適応されない状態!」と「注意:ロボットから見た状態!」を想定し、必ず背景に濃い色を指定して下さい。

CSSを駆使して「読み込まれる順」を考える!

現在インターネット上にあるウェブサイトは「骨組みはDIVタグ、DIVタグの位置指定はCSS」という作り方が大半です。それでは、まず見直したいサイト内のソースを見て下さい。するとページごとに変わる個所(ページごとのコンテンツ)より、ページごとに変わらない個所(メニュー・ヘッダ・フッタ部分など)の割合が多いはずです。もし「ロボット目線」でソースを見て「どのページもあまり変わりがない・・・」と感じた場合は、「更新頻度の多いコンテンツ(DIVタグ)を出来るだけ左上部へ持っていく努力!」をして下さい。
しかし「コンテンツが常に左上部にあるサイト!」はあまりにも見づらい、かっこ悪いので、「loat:left/loat:right」を使って「見た目は見やすく!そしてロボットには更新コンテンツを早めに読ませる!」を意識してサイトを制作して下さい。当サイトも左にメニューがありますが、ソースをご覧の通り実際は右側にあります。

DIVタグを[loat:left/loat:right]で操作した後は[clear:both]を必ず入れて下さい。尚、[<br style="clear:both" />]はW3C的にはNGですが、個人的に便利なのでよく使ってしまいます(笑) ちなみに[<br style="clear:all" />]でも同様な効果があります。

画像はDIVタグ(背景画像)ではなくIMGタグで!

CSSが主流になり、以前の「画像IMGタグで表示されていた手法」は、時代の流れとともに「DIVタグなどの背景に読み込ませて表示させる手法」へと変化を遂げました。変化を遂げた理由は「障害をお持ちの方(音声読み上げソフト)にとって優しいサイト」「画像が読み込めない環境・回線への気配り」「不要なソースを最大限カットするため」など、様々な理由があります。
しかし、SEOという観点から言わせていただくと、IMGタグにはALT(TITLE)タグがあり、そこにキーワードを含める事によりSEO効果を出せる!」ということを優先して下さい。
以前は回線が遅く、そしてPCスペックも低かったので「ソースのダイエット!」が一時流行りました。しかし、昨今では回線・PC共に目まぐるしい発展を遂げたので、多少タグが増えても、まず問題無いと思います。また、画像にリンクを貼るとIEなどでは「画像が点線で囲われる現象=リンクターゲット範囲」が見た目NGという方が多いです。そういった場合はaタグに直接[onFocus="this.blur()"]を入れるか、またはCSSに以下(例2)を入れて下さい。

ソースダイエットや最新技術に固着せず、構築時は常に「ロボット目線」を意識して下さい。

  • 例1:<a href="リンク先URL" onfocus="this.blur()"><img src="画像URL"></a>
  • 例2:もしくはCSS側に a:focus { outline:none;} 、または a { outline:none; }を記述する。画像からはみ出た部分も消す場合は a {overflow: hidden;}を使って下さい。注意:outlineプロパティはIE5/5.5/8には効きますが、IE6/7には効きません。

このページの最上部へ戻る


(C)copyright Hit-Search.com All rights reserved.