クローラビリティを100点に仕上げてURLを検索エンジンに正しく伝える

URL最適化の仕上げとして、HTMLでURLを展開するときのポイントを紹介

伊藤大典（アユダンテ株式会社） 2010/4/7(水) 9:00

スキルセットや共通言語が異なる
エンジニアとWeb担当者をつなぐための手引書

クローラビリティをきっちり仕上げるには

過去5回の記事ではURLの最適化方法として次のことを解説してきました。

URLの最適化方法

これらは検索エンジン最適化のうち、クローラビリティ改善のための施策となります。「クローラビリティ」とはサイトに対するクローラーの回遊性のことですが、ステータスコードを正しく設定して、URLを正しく設計したことをクローラーに正確に伝えるためには、あと2つ重要な要素があります。

リンクは<a>タグで設置する。
ページからサイト内の関連するページにリンクを設置する。

今回はその2点について説明したいと思います。この2点を理解してクローラビリティをきっちり確保し、正しくインデックスされるようにしましょう。

1. リンクは<a>タグで設置する。

あるHTMLファイル内からあるページへのURLリンクを設置する方法には、次のいずれかがあります。

方法	メソッド	クローラビリティ
a href=""	GET	クローラーが正しくリンクを理解しクロールが行われます。SEOを行ううえでは、この方法が最適です。
フォーム利用	GET/POST	クロールするかしないかでいうと、クロールは行っているようです。しかし、フォームを利用する場合、GET/POSTにかかわらず、フォームデータをサーバーに送信する必要があります。一方、クローラーはフォームにサイト側が意図した正しいデータを入力したりしませんから、クローラビリティの観点からはおすすめできません。（※ただ、クローラーがデータを挿入することは技術的には可能で、一部ランダムに入れているという情報もあります。http://searchengineland.com/google-now-fills-out-forms-crawls-results-13760）
JavaScript	GET/POST	クローラーはJavaScriptを処理しますが、クローラビリティの観点からは完全にNGな方法です。
Ajax	GET/POST	JavaScriptに似ていますが、Ajaxはクローラビリティの観点からは相性が悪いです。
Flash		Flashのswfファイルはクローラーが取得し解析しています。ただしクローラビリティが高いかどうかという意味ではこちらも推奨できません。正しくSEOを行う場合はやめておいた方がいいでしょう。Flashのクローラビリティを高めることにリソースを割くより、通常のSEOにリソースを傾けてください（FlashがサイトにあることでSEOに害があることはありません）。

しかし、クローラビリティの観点から推奨される方法は「<a>タグによるGET」のみです。クローラーがどのようにインデックスしていくのかは、「検索エンジンの仕組みをおさらい。クローラー対策とステータスコード」の回で説明しましたが、SEO上重要なページのつながり（クローラーにしっかりたどってほしい導線）には、<a>タグを利用するようにしてください。

では、<a>タグ以外のリンクがクロールされないかというと、実はクロールしています。あくまでも最大限のSEO効果が出ないだけですので、たとえばクロールさせたくない場所にJavaScriptを利用するというような方法は間違った方法です（本当にクロールさせたくない場合は、robots.txtなどでクローラーをブロックするのが正しい対策です）。

また、<a>タグを使う場合は、リンクを設定する文字列（アンカーテキスト）を意識してリンクを張る必要があります。たとえば、「北海道の賃貸物件」を扱うページへリンクする場合にありがちなのが、次のようなリンクの張り方です。

悪いアンカーテキストの例

HTMLソースの記述
北海道の賃貸物件は<a href="/hokkaido/list/">こちら</a>
ブラウザでの表示
北海道の賃貸物件はこちら

これでは、アンカーテキストが「こちら」になり、SEOしたいキーワードが含まれていません。次のように、アンカーテキストにキーワードを含めると良いでしょう。

良いアンカーテキストの例

HTMLソースの記述
<a href="/hokkaido/list/">北海道の賃貸物件</a>はこちら
ブラウザでの表示
北海道の賃貸物件はこちら

理由は単純で、<a>タグの文字列（アンカーテキスト）とリンク先のページの<title>タグや<h1>タグが同じであると、検索エンジンが「関連のある良いリンク」という判断をするためです。文字列からリンクを張る場合は、なるべくリンク先のページに関連した文字列を設定しましょう。

また、FlashやAjax、FORMのPOSTがSEOに不向きだからといって、使用するとマイナスかというと、必ずしもそうではありません。コンテンツの趣旨やユーザビリティのために必要な技術として使うのはまったく問題ありません。ただそこにSEO効果（クローラビリティ）を求めることはやめておきましょう。SEO効果と両立したいような場合は、<a>タグのリンクも設置するようにすればクローラビリティを確保できます。

余談ですが、Googleは公式ブログでAjaxをクロールしてインデックスする方法を提案しています。あくまで提案レベルで、作り込みが必要で手間もかかるため、一般的な手法としてすぐに使えるかというと、まだ難しいでしょう。

関連するページにリンクを設置する
クローラビリティのポイントまとめ

2. 関連するページにリンクを設置する

クローラビリティの確保とはクローラーがサイトをくまなくクロールするための対策です。そのため、リンクの設置方法だけでなく、サイト内全体のリンク構造も考えておく必要があります。

次の図1の例はあくまで概念図ですが、赤い囲みのページから見たとき、放出されているリンクが良い例の場合は全体的に上下左右くまなく飛んでいるのに対して、悪い例の場合は上から下への狭い範囲でのリンクになっています。

図1　あるページを起点にリンクを張る場合の良い例と悪い例

クローラーが赤で囲ったページに到達した際のクローラビリティを考えると、どちらのクローラビリティが高いかは一目瞭然です。ただし、やみくもにリンクを張ればいいということではありません。リンクを張る際には次のことに注意してください。

2-1. リンク元のページとリンク先のページの関連性

検索エンジンはリンク元とリンク先のページのテーマを認識していますので、テーマが同じページ間のリンクを高く評価します。一方で、テーマとして関係のないリンクはあまり評価しません。

たとえば、ファッションに関連するページであれば、ファッション関連のカテゴリや商品詳細へのリンクは評価されますが、ファッションページからクレジットカードのページへのリンクはあまり評価されません。これは、サイトを実際に利用するエンドユーザーにとってのユーザビリティが良いリンクを検索エンジンが高く評価するためです。

※関係ないコンテンツにはリンクを張ってはいけないという意味ではなく、あくまで検索エンジンが高く評価するリンクの考え方を示しています。

2-2. リンク元のページからの発リンク数は最大で100本前後にする

あるページから100本以上のリンクがある場合、下部にあるリンクはあまり評価されない（＝クロールされない）傾向にあります。下部とはHTMLソースの下のほうにあるリンクになります。

情報量の多いトップページや商品の一覧ページなどは必然的にリンクが増える傾向にありますが、次の2点を意識してリンクの本数を調整することが重要です。

重要なリンクはなるべくHTML上部へ
HTML上で近くにある同一ページへのリンクは1つのタグにまとめる

たとえば、図2のアパレル商材ページのように、左の画像のリンクの飛び先も、右のテキストリンクの飛び先も同一の商品詳細ページの場合は、HTML上では同一のリンクに集約します。

図2　同一ページへのリンクが近くにある場合は1つにまとめる

図2のHTMLソースの例

<a>タグを画像とテキスト、2つに分けてリンクした例

<p class="title">
  <a href="/detail/12345/" >
      <span class="img">
          <img src="/image/12345.jpg" alt="カシミヤ紺ミドルコート" />
      </span>
  </a>
  <a href="/detail/12345/" >
      <span>カシミヤ紺ミドルコート</span>
  </a>
</p>

<a>タグを画像とテキスト、1つにまとめてリンクした例

<p class="title">
  <a href="/detail/12345/" >
      <span class="img">
          <img src="/image/12345.jpg" alt="カシミヤ紺ミドルコート" />
      </span>
      <span>カシミヤ紺ミドルコート</span>
  </a>
</p>

2-3. Googleは同じリンクが複数本ある場合、HTMLソースの一番上のリンクのみ評価する

GoogleはHTML内に同じリンク先へのリンクが2本以上ある場合、HTMLソースの一番上にあるリンクのみを評価の対象とします。次のような例では、/camera/というURLへの大切なリンクの1つ目が画像※1であるため、せっかく「カメラ」というキーワード※2をアンカーテキストに指定してあっても、検索エンジンはリンク先のページがカメラに関連していると認識しないので、SEO効果がないということです。

Googleは同一のリンク先が複数ある場合、HTMLソースの一番上のリンクのみ評価

<html>
  <head>
      :
      :
  </head>
  <body>
      <!--※1 ここのリンクのみ評価するがアンカーテキストがない-->
      <a href="/camera/"><img src="/images/camera.jpg" /></a>
          :
          :
      <!--※2 ここは2番目なのでアンカーテキストがあっても未評価-->
      <a href="/camera/">カメラ</a>
  </body>
</html>

クローラビリティのポイント

少しクローラビリティではない要素までお話してしまいましたが、クローラビリティを確保するポイントをまとめると次の6つになります。

正しいステータスコードの設定
URLの永続化
URLの正規化
URLの静的化
リンクは<a>タグで設置
関連するページへの上下左右のリンク

今回の記事では5と6について説明しました。これまでの連載で説明した以上のことを踏まえていただければ、クローラビリティは必ず最大のパフォーマンスを得ることができます。実際に試してみてください。

ApacheのURLリダイレクト設定｜ RewriteRuleサンプル付

» エンジニアのためのSEO入門のバックナンバーを見る

この記事の筆者

伊藤大典

アユダンテ株式会社　事業開発部長

アユダンテに設立当初より参加し、SEOコンサルタントと共に数十の大規模サイトのバックエンドからフロントエンドまで、SEOに最適化されたアーキテクチャを設計する。また、別プロジェクトとして「携帯秘書モバセク」の設計・開発のマネージメントも務める。携帯への造詣も深く、まだ技術的な情報の少ない携帯SEOのコンサルティング経験も多数あり。定期的にSEOに関するセミナーを開催しています。2009年12月、『SEOを強化する技術』（インプレスジャパン）を執筆。

→伊藤大典（アユダンテ株式会社）のプロフィールページ

バックナンバー