Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法 | Google ウェブマスター向け公式ブログ

このページは、外部サイト Google ウェブマスター向け公式ブログ の情報をRSSフィード経由で取得して表示しているため、記事の一部分しか表示されていなかったり、画像などが正しく表示されなかったり、オリジナル記事が意図したデザインと異なっていたりする場合があります。
完全な状態のオリジナル記事は 「Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法」 からご覧ください。
スマートフォンの普及が現在急速に進んでおり、それに合わせてスマートフォンに最適化されたコンテンツも日々増えています。私たちは以前、Google 検索と相性の良い携帯電話 / スマートフォン向けウェブサイトを運営する方法 をご紹介しましたが、その後も Google は、スマートフォンに最適化されたコンテンツの対応の向上に努めてきました。その取り組みの一環として、スマートフォン専用コンテンツを識別する方法として、2011年12月に スマートフォン版 Googlebot-Mobile を導入 しました。

そして今回、Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法、そしてデスクトップとスマートフォンにそれぞれ最適化された両方のサイトが Google の検索結果で良い結果が得られるような方法を説明したいと思います。

スマートフォンに最適化されたサイト構築の推奨方法
私たちの推奨する方法の詳細については、こちらのサイト(英語)でご確認ください。

簡単に要約しますと、スマートフォンに最適化されたサイトを構築する際に、Googleは、次の 3 つの構成をサポートしています。
  1. レスポンシブ・ウェブデザインを使用しているサイト、すなわち、すべてのデバイスに単一の URL で同じ HTML を提供し、CSSを使用してデバイスごとにデザインを変更するサイトです。こちらが Google の推奨する設定方法となります。
  2. すべてのデバイスに対し単一の URL で、ユーザーエージェントに応じてデスクトップ用かモバイル用かなどを判断して動的に異なる HTML と CSS を提供するサイト。
  3. モバイル用のサイトとデスクトップ用のサイトを別々に構築しているサイト。
レスポンシブ・ウェブデザイン
レスポンシブ・ウェブデザインは、CSS3のメディアクエリを使用して見た目を変更するWeb ページの構築手法です。つまり、デバイスに関わらず共通の 1 つの HTML を用意し、CSS メディアクエリを使用して、そのページを表示する画面サイズからデバイスを判断しCSSを選択し、そのデザインを変更します。レスポンシブ・ウェブデザインについてより詳しい情報は、Google のウェブマスターによる こちらの記事(英語)や 今回の推奨方法のセクション(英語)をご覧ください。

レスポンシブ・ウェブデザインを使用すると、次のような利点があります。
  • PC 用のページとモバイル用のページを単一の(同一の) URL とすることができるため、ユーザーにとってはシェアやリンクが容易であり、Google のアルゴリズムにとってはコンテンツを適切にインデックスできるようになります。
  • ユーザーエージェントの異なる Googlebot ごとにページをクロールする必要がないため Google がより効率的にコンテンツを発見することができます。
デバイスごとに最適化した HTML
しかし Google は、レスポンシブ・ウェブデザインを使用することが適切とはいえない状況があることを理解しています。そのため、私たちはサイトがデバイスごとに最適化した HTML を使って同等のコンテンツを提供することをサポートしています。デバイス固有の HTML の提供方法は、デスクトップ版とスマートフォン版で同じ URL(動的な配信と呼ばれています)で提供する方法と、異なる URL(たとえば、www.example.comとm.example.comなど)で提供する方法に分けることができます。

あなたのサイトが動的な配信をされている場合、ユーザーエージェントごとにコンテンツを変えている事をキャッシュサーバや Google のアルゴリズム伝えるために Vary HTTP ヘッダを使用することを強くお勧めします。また、Googlebot-Mobile でもクロールのシグナルとして利用します。詳細は こちら をご覧ください。

デスクトップ版とモバイル版で別のサイトを構築しているケースに関しては、その実装方法は様々な方法が考えられますが、重要なのは、デスクトップ版とモバイル版がそれぞれ存在しつつも同一の目的、内容のページであればそのことを我々のアルゴリズムにアノテーションで伝えることです。アノテーションを利用することで、デスクトップ用のページとモバイル用のページとして別々に作られたページが実はデバイスごとに最適化して作成された同一の内容であり、同一のものとして取り扱われるべきことを Google に伝えることができます。

これらのアノテーションは、Google があなたのスマートフォンに最適化されたコンテンツを発見し、アルゴリズムがコンテンツの構造を理解する助けになり、そして検索結果においても良い結果が得られる可能性が高まります。

結論
このブログ記事は、Google がお勧めするスマートフォンに最適化されたサイトの構築方法の要約です。より詳しい内容につきましては、完全版をぜひご覧いただき、みなさまのサイトに最適な実装方法を見つけて頂ければと思います。

また、ウェブマスター ヘルプフォーラムではこの記事に関するご質問を受け付けています。(質問締め切り:2012 年 6 月 22 日)この記事に関するコメントやご意見・ご感想は、ウェブマスター ヘルプフォーラムのこちらのスレッド までお寄せください。

Posted by Pierre Far, Webmaster Trends Analyst
Original version: Recommendations for building smartphone-optimized websites
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

モバイル広告
インターネット広告のひとつ。モバイル端末(携帯、PDA、タブレット、スマートフォ ...→用語集へ

連載/特集コーナーから探す

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]