Webmasters

スマートフォン向けウェブサイトの構築

はじめに

スマートフォンの利用が増加している中、スマートフォン ユーザーにとって使いやすいウェブサイトを作成することは、ウェブサイト管理の重要な部分を占めるようになってきています。このドキュメントでは、PC とスマートフォンの両方向けに最適化された形式でのコンテンツの配信に関して、Google の推奨事項を概説し、よくあるミスを防ぐ方法を紹介します。また、タブレットやフィーチャーフォン向けのウェブサイトについても説明します。

Google の推奨事項の概要

Google では、スマートフォン向けウェブサイトの作成について、次の 3 種類の設定がサポートされています:

  • レスポンシブ デザイン: 1 つの URL について同一の HTML を配信し、CSS メディア クエリを使ってクライアント側でどのようにコンテンツをレンダリングするかが決まります。これにより、ユーザー エージェントの検出で生じる問題がなくなり、ユーザーのリダイレクトが不要になります。 Google ではこの設定をおすすめしています。
  • 動的な配信: 1 つの URL について、ユーザー エージェントごとに異なる HTML を配信します。このような方法で配信することを示すために、Vary HTTP ヘッダーを使用します。
  • 別個のモバイル サイト: ユーザー エージェントに応じて、ユーザーを別の URL にリダイレクトします。双方向のリンク アノテーションを使用して、検索エンジンに対し、2 つの URL 間の関係を示します。

どの設定を使用する場合でも、検索エンジンに対して JavaScript や CSS のようなリソースをブロックしていないことを確認してください。技術的な実装の方法については、詳細のページをご覧ください。

携帯端末の種類

  1. スマートフォン: 通常の PC 用ページをある程度まではレンダリング可能なブラウザを搭載した携帯端末。このカテゴリには、HTML5 をレンダリングできる最新のモバイル ブラウザが含まれ、Android 搭載端末や iPhone などさまざまな端末が対象となります。
  2. フィーチャーフォン: 通常の PC 用ウェブページをレンダリングする機能のないブラウザを搭載した携帯端末。これには、cHTML(iMode)、WML、WAP など向けのブラウザが含まれます。

タブレットについては、前述の端末よりも画面が大きい場合が多いなどの理由から、ここでは携帯端末とは見なしません。タブレット ユーザーの大半は、ウェブを閲覧する際にはタブレット向けのページか PC 向けのページを見ようとしています。つまり、タブレット向けのコンテンツを提供していない限り、ユーザーはスマートフォン用サイトではなく PC 用サイトを見るつもりなのです。

目次

  • 詳細のページでは、使用可能な各種設定の実装方法を説明します。
  • よく見られるミスのページでは、スマートフォン向けのウェブサイトでしばしば見られる問題を取り上げます。
  • リダイレクトとユーザー エージェントの検出のページでは、ユーザー エージェントを使ってユーザーをリダイレクトする際に役立つヒントを紹介します。
  • JavaScript のページでは、レスポンシブ ウェブ デザインでの JavaScript のさまざまな実装方法を説明します。
  • タブレットのページでは、タブレット ユーザー向けのコンテンツ配信について説明します。
  • フィーチャーフォンのページでは、スマートフォンとフィーチャーフォンの両方をサポートするウェブサイトの作成方法を説明します。
  • Googlebot ユーザー エージェントのページでは、モバイル向けウェブサイトのクロールに使用されるユーザー エージェントを紹介します。
  • ウェブサイトを改善するためのチェックリストのページでは、モバイル サイトの準備完了後に利用可能な改善方法を提供します。

認証が必要です

この操作には Google+ でのログインが必要です。

ログインしています...

この操作には Google デベロッパーに対する許可が必要です。