スマートフォン向けに最適化されたサイトを作成するための推奨事項

ウェブマスターレベル:任意


人々はますますスマートフォンを使用することを選択しており、これらのデバイスで表示するコンテンツを最適化するサイトが増えています。 前回 、モバイルプラットフォーム向けのWebサイトの設計についてお話しして以来、コンテンツのサポートを大幅に改善することができました。 そのため、2011年12月に、 Googleはそのようなコンテンツのみを処理するモバイルサイト用のロボットを立ち上げました。

今日、サイトの作成と最適化に関する推奨事項をお伝えします。これにより、通常のコンピューターとスマートフォンの両方でサイトが等しく表示されるようになります。



ウェブサイトのデザインのヒント



以下に簡単な推奨事項を示します 。詳細については、こちらをご覧ください。 最近報告したように 、このサイトはロシア語で利用可能になりました。

スマートフォン向けに設計されたサイトの場合、Googleは3つの異なる構成をサポートしています。

1.レスポンシブWebデザインのサイト。 同じURLが異なるデバイスで開かれていることが理解されます。 HTMLコードは変更されず、特定のプラットフォームへのページの適合はCSSを介して提供されます。 この構成を使用することをお勧めします。

2.すべてのプラットフォームで同じURLセットを使用しているが、異なるHTMLとCSSが通常のコンピューターとモバイルデバイスに動的に提供されるサイト。

3.さまざまなデバイスのコンテンツは別々のサイトに配置されます。



レスポンシブWebデザイン



このテクノロジーは、CSS3メディアクエリを使用します。 すべてのデバイスにはページの同じHTMLコードが提供されますが、メディアクエリを使用して選択されたさまざまなCSSスタイルによって表示が変更されます。 レスポンシブデザインの詳細については、投稿「メディアクエリに基づくレスポンシブデザイン」および推奨事項を参照してください。

レスポンシブデザインの利点は次のとおりです。



さまざまなデバイスの個別のHTMLコード



多くの状況では適応設計ができないため、Webサイトには特定のデバイス用に設計され、同じURL(動的表示)または異なるURL( www.example.comとm.example.comなど)に配置されたHTMLコードが含まれる場合があります。

動的レンダリングを使用する場合は、Vary HTTPヘッダーを使用することを強くお勧めします。 このソリューションでは、キャッシュサーバーを使用できます。また、アルゴリズムは、ページを要求するクライアントアプリケーションによってコンテンツが異なることを考慮しています。 また、クロールにはモバイルサイト用のGooglebotを使用する必要があることをお知らせください。 詳細については、 こちらをご覧ください。

モバイルデバイス用に個別のサイト構成を実装するには、いくつかの方法があります。 あなたのページは通常のコンピューターとモバイルデバイスに相当するというコメントをGoogleアルゴリズムに伝えることをお勧めします。 言い換えれば、新しいコメントは、コンテンツの2つのバージョン間の関係を説明します。これは、同じことですが、プラットフォームが異なると見なされるべきです。

これらのコメントを使用して、スマートフォン用のコンテンツを発見し、アルゴリズムがコンテンツの構造を認識します-そして、サイトは検索結果でより良く見えます。



おわりに



この投稿は、スマートフォン向けに最適化されたサイトを作成するための推奨事項の要約です。 完全版をチェックアウトし、ウェブプロパティに適した設定を選択してください。 通常どおり、追加の質問がある場合は、 ウェブマスターヘルプフォーラムで質問できます。



All Articles