どれがベスト?スマホ対応サイトの構築方法3種

SEOならSEOパック
ご利用実績8396件 (2016/09/30現在)

どれがベスト?スマホ対応サイトの構築方法3種

Googleは今週、スマホ対応の設定方法3種について、レクチャーを(英語圏向けに)行うと発表しました。今年はスマホ対応強化が更に強く進められそうです。

この、Googleが提示する3種のスマホ対応方法について、それぞれの長所・短所、また参考になるツールを、本記事で改めてまとめます。

20150107multi-device

スマホ対応の設定方法3種

サイトをスマホ対応させたい場合、Googleが提示する下記の3種の方法から、いずれかを選ぶことになります。
なお、方法によっては、同じコンテンツでもデバイスごとに別のURL、あるいは別のHTMLで配信することになります。こちらも併記します。

設定方法 URLの変更 HTMLの変更
レスポンシブウェブデザイン なし なし
動的な配信 なし あり
別々のURL あり あり

どの方法を選ぶかにより、その後のサイト管理の方法が変わってくるため、それぞれの長所・短所を確認する必要があります。一つずつ見ていきましょう。

PR【初めてのSEO対策】初期費用なし!月額7,980円(税込)-総合SEOパッケージ⇒

レスポンシブウェブデザイン

レスポンシブ・ウェブデザインとは、1つのURL・1つのHTMLで、デバイス環境ごとにデザインだけ変えて表示する方法です。

レスポンシブ・ウェブデザインの長所と短所

長所
○ URLが一つ 訪問ユーザが、デバイスをまたいでシェアやリンクでき、使い勝手が良い

検索エンジンがインデックスしやすい
○ 合理的なユーザビリティ デバイスごとに、コンテンツをカスタマイズして配信できる
○ 横長画面・縦長画面への対応が柔軟 ユーザごとに縦長画面・横長画面の違いがあっても、自然に対応可能

リダイレクトがないため、サイト読み込みに時間がかからず、パフォーマンスが改善する
短所
☓ 慎重な計画が必要 HTMLがデバイス間で共有されるため、デバイスごとに最高のユーザビリティを実現するには、慎重な設計が必要になる

サイト管理者にもGooglebotにもメリットのある配信方法

公式Googleディベロッパーズガイドでは、3種のスマホ対応方法のうち「特定のURL形式が優先されることはありません」と書いていますが、その実Googleは、レスポンシブウェブデザインを最も頻繁に推奨しています。

その理由は、後述する他の方法に比べ、サイト運用管理が比較的シンプルになること、そして、Googlebotがクロールしやすいことです。

レスポンシブウェブデザイン採用自体が直接SEO評価につながるわけではありませんが、サイト管理者側にもGoogle側にも、サイトを扱ううえでメリットがあるわけです。

動的な配信

動的な配信とは、URLは1つながら、アクセスするデバイスごとに異なるHTMLを配信する方法です。
Webサーバがデバイスの種類を検知して別々のHTMLを配信する方法で、「動的コンテンツ配信」あるいは「ダイナミックサービング」とも呼ばれます。

動的な配信(ダイナミックサービング)の長所と短所

長所
○ ユーザビリティをカスタムできる デバイスごとにカスタムされたコンテンツ・レイアウトを利用できる
○ 変更が簡単 他のデバイスを気にせずに、特定のデバイスの画面サイズ向けコンテンツやレイアウトを作れる
○ 読み込みが早い 合理的なコンテンツ作成でデバイスごとに最適な読み込み時間に調整できる
○ URLが1つ レスポンシブ・デザイン同様、ユーザは1つのURLで利用できる
短所
☓ コンテンツが分岐する 同じコンテンツなのに複数のカスタムセットが存在してしまう

CMSがそれに対応していない限り、セット間のコンテンツ更新・同期が煩雑

別々のURL

別々のURLとは、基本的には同じコンテンツを、デバイス環境ごとに異なるURL・別のHTMLで配信する方法です。セパレートURLとも呼ばれます。

別々のURL(セパレートURL)の長所と短所

長所
○ デバイスごとにユーザビリティを
カスタムできる
デバイスごとにカスタムされたコンテンツ・レイアウトを利用できる
○ 変更が簡単 他のデバイスを気にすることなく、自由にスマホ向けサイトを作れる
短所
☓ URLが複数できる デバイスをまたいだページ共有の際など、リダイレクトほか注意が必要

リダイレクトの際に余計な読み込み時間が生じる
☓ コンテンツが分岐する 1つのコンテンツに2つ以上の異なるセットが存在し続けるため、データ管理が非常に煩雑
PR【利用実績6,000件】Googleガイドラインを考慮。月額7,980円(税込)の人気SEO対策⇒

まとめ

最初は大変、あとはらくらく – レスポンシブデザイン

レスポンシブデザインは、最初の設計が面倒なため、多くのサイト管理者が導入に二の足を踏んでいるのが現状だと思われます。

ただ、一度しっかり設計されたレスポンシブデザインを導入してしまえば、その後のサイト・コンテンツ管理は、他の方法に比べてシンプルになるはずです。あえてお勧めを挙げるなら、このレスポンシブデザインになるでしょう。

最初はらくでも後が大変 – 動的配信と別々のURL

一方、動的な配信、および別々のURLという方法だと、比較的楽にスマホ対応ページを用意できる反面、その後の管理は大変になります。

とくに、コンテンツが複数のセットに分岐してしまう点と、リダイレクト等の設定に気を使う点では、常に情報の整合性やユーザビリティ、Googlebotのクローラビリティを細かく気にしてサイト管理を続けることになりかねません。

参考:導入に役立つGoogle公式ツール

導入とチェック

いずれの方式についても、Googleディベロッパーズガイドで 具体的な導入方法が説明されています。icon-openonnewtabページ中段にあるリンクからそれぞれたどって下さい。

また、あなたのサイトのスマホ対応状況を こちらのツール(モバイルフレンドリーテスト)icon-openonnewtabで簡単にチェックできます。これで「合格」なら問題なし、スマホ版Googleで「スマホ対応」のラベルが表示されるようになります。

SEO対策を忘れない

注意して欲しいのが、スマホ対応しても順位は上がらないという点です。
SEO対策していないページでスマホ対応だけ済ませても、集客の意味では効果はありません。

スマホ対応はあくまで、スマホ検索で順位を「落とさない」ための対策であって、順位を上げるためのSEO対策ではありません。順位を上げる(ランキング評価対策)ためには、Googleが明言しているとおり、被リンク対策と高品質コンテンツの2点が必須になっています。
20160330top3-chartv6

注力するサイトやページのスマホ対応に取り組む際は、まずそのページに被リンク対策を導入済みか、そして高品質コンテンツの配信ができているか、必ずチェックしましょう。

そのページで被リンク対策が初めての際はバランスのよいSEO Packを選択icon-openonnewtabしましょう。
また、高品質コンテンツの配信には、こちらのコンテンツicon-openonnewtabが参考になるはずです。

必須で最も効果のあるSEO対策と、いますぐ始められる対策

この記事が役に立ったらSNSで共有してください。

特集:効果のある被リンクを知る - SEO効果を決める、リンク対策の6つの基準とは

SEO Pack導入事例

全事例一覧

SEO対策FAQ

全質問一覧

最新記事

全記事一覧

カテゴリ一覧

全記事一覧

SEO Packブログ byディーボ

このブログについて