設定を検索エンジンに伝える

別々の URL

この設定では、PC 用 URL ごとに、モバイル端末専用コンテンツを配信する別の URL を用意します。

たとえば、PC ユーザーに配信される www.example.com 上のページに対応するページとして、m.example.com のページをモバイル ユーザーに配信するのが一般的です。Google では、すべての Googlebot ユーザー エージェントがすべてのページにアクセス可能である限り、特定の URL 形式が優先されることはありません。

PC 用とモバイル用に(場合によってはタブレット用にも)、別々の URL から別々のコードを配信します。

TL;DR

  • 2 つの URL の関係を タグと rel="canonical" および rel="alternate" 要素で伝えます。
  • ユーザー エージェント文字列を検出して正しくリダイレクトします。

PC 用 URL とモバイル端末用 URL のアノテーション

Google のアルゴリズムがサイトのこの設定を認識できるように、次のアノテーションを使用することをおすすめします。

  1. PC 用ページに、対応するモバイル端末用 URL を指すための link rel="alternate" タグを追加します。これで、Googlebot がサイトのモバイル端末用ページの場所を検出できます。
  2. モバイル端末用ページに、対応する PC 用 URL を指す link rel="canonical" タグを追加します。

Google では、このアノテーションの追加先として、ページ自体の HTML とサイトマップの 2 つをサポートしています。たとえば、PC 用 URL が http://example.com/page-1 で、対応するモバイル端末用 URL が http://m.example.com/page-1 であるとします。この場合のアノテーションは次のようになります。

HTML に追加するアノテーション

PC 用ページ(http://www.example.com/page-1)には、次のアノテーションを追加します。

<link rel="alternate" media="only screen and (max-width: 640px)"
      href="http://m.example.com/page-1" >

モバイル端末用ページ(http://m.example.com/page-1)に追加する必要があるアノテーションは次のとおりです。

<link rel="canonical" href="http://www.example.com/page-1" >

モバイル端末用 URL には、PC 用ページを指すこの rel="canonical" タグが必要です。

サイトマップに追加するアノテーション

サイトマップには、次のように PC 用ページの rel="alternate" アノテーションを含めることができます。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://www.example.com/page-1/</loc>
<xhtml:link
    rel="alternate"
    media="only screen and (max-width: 640px)"
    href="http://m.example.com/page-1" />
</url>
</urlset>

モバイル端末用 URL 上の必須の rel="canonical" タグはこれまでどおりモバイル端末用ページの HTML に追加する必要があります。

アノテーションの詳細

PC 用ページの link タグの属性に注意してください。

  • rel="alternate" 属性は、このタグが PC 用ページの代替 URL を指定していることを示します。
  • media 属性の値は、代替 URL の適用先のメディア機能を指定する CSS メディア クエリ文字列です。ここでは、モバイル端末がターゲットの場合に一般に使用されるメディア クエリを使用しています。
  • href 属性は、代替 URL の場所、つまり m.example.com のページ上の場所を指定します。

この双方向アノテーションにより、Googlebot でコンテンツの検出が可能となり、アルゴリズムが PC 用ページとモバイル端末用ページの関係を把握したうえで適切に処理できます。異なる URL を使って同じコンテンツを異なるフォーマットで配信する場合は、アノテーションによって Google のアルゴリズムにそれらの 2 つの URL のコンテンツは同等であるために 2 つの構成要素ではなく 1 つの構成要素として扱うことを伝達します。別々に処理されると、PC 用 URL とモバイル端末用 URL はどちらも PC の検索結果に表示され、そのランキングは 1 つの同じ構成要素として扱う場合よりも下がる可能性があります。この設定でよく見られるミスを回避するため、以下の点に注意してください。

  • rel="alternate" と rel="canonical" を使用する場合は、モバイル端末用ページとそれに対応する PC 用ページの関係を 1 対 1 に維持してください。1 つのモバイル端末用ページを複数の PC 用ページから参照するようなアノテーションは避けてください(その逆も同様です)。
  • PC 用ページが無関係なモバイル端末用ページにリダイレクトされていないか十分確認してください。
PC 用とは別にモバイル端末用サイトを実装する場合は、モバイル端末ユーザーを間違ったページにリダイレクトしないよう注意してください。

自動リダイレクト

PC ブラウザ用とモバイル ブラウザ用に別々の URL を使用しているウェブサイトでは、ユーザーの環境に合わせて自動的に最適な URL にリダイレクトすることもできます。ウェブサイトで自動リダイレクトを使用する場合は、他のユーザー エージェントと同じようにすべての Googlebot を処理し、適切にリダイレクトする必要があります。

サポートされるリダイレクト方法

Googlebot では、以下の 2 つのリダイレクトの実装がサポートされます。

  • HTTP リダイレクト
  • JavaScript リダイレクト

HTTP リダイレクトを使用する

HTTP リダイレクトは、クライアントをデバイス固有の URL にリダイレクトする場合によく使用します。通常、このリダイレクトは HTTP リクエスト ヘッダーにあるユーザー エージェントに基づいて行われます。リダイレクト先をページの link rel="alternate" タグやサイトマップに指定されている代替 URL と一致させておくことが重要です。

この目的のために、サーバーのリダイレクトで、HTTP ステータス コード 301 または 302 のどちらを用いても問題ありませんが、可能な限り 302 を使用することをおすすめします。

JavaScript リダイレクト

HTTP リダイレクトの実装が難しい場合は、JavaScript を使って、link rel="alternate" タグが指す URL にユーザーをリダイレクトできます。この方法を選択する場合は、まずブラウザ上でページをダウンロードしてから JavaScript の解析、実行が行われるため、リダイレクトがクライアント側で起こるまでに遅延が発生することに注意してください。

JavaScript ベースのリダイレクトはさまざまな手段で実装できます。たとえば、既にサイトのページのリンク アノテーションで使用しているメディア クエリを、JavaScript の matchMedia() 関数を使って実行することも可能です。

双方向リダイレクトと単方向リダイレクト

ウェブサイトごとにリダイレクトの方針は異なります。PC 用ページにアクセスしたモバイル ユーザーのみをモバイル専用ページにリダイレクトするウェブサイト(「単方向」リダイレクト)もあれば、モバイル ユーザーと PC ユーザーがそれぞれ PC 用サイトとモバイル用サイトにアクセスした場合にその両者をリダイレクトするウェブサイト(「双方向」リダイレクト)もあります。

Googlebot への対応という意味でどちらを推奨する、ということはありません。リダイレクトの方針を決める際は、ユーザーの利便性を考えて検討することをおすすめします。最も重要なのは、正しく一貫性のあるリダイレクトを提供すること、つまり PC サイトまたはモバイル サイトの対応するコンテンツにリダイレクトすることです。設定が正しくないと、一部のユーザーがまったくコンテンツを表示できない可能性があります。

また、リダイレクトを無効にする方法、つまり、選択すればモバイル ユーザーが PC 用ページを表示でき、PC ユーザーはモバイル端末用ページを表示できるようにする方法を用意することもおすすめします。

保存

更新日: 2014 年 11 月 3 日