このページの本文へ

変更直前! もう一度確認しよう

Google検索順位が変わる!スマホ対応の最終チェック法

2015年04月20日 13時40分更新

菊池 崇

  • この記事をはてなブックマークに追加
本文印刷

スマートフォンなどのモバイル端末からGoogleで検索した結果表示が4月21日から変わります。新しい検索結果では、スマートフォンでの表示に最適化されている(モバイルフレンドリー)かどうかが表示順位に影響するようになります。

すでに対応しているサイト運営者も多いと思いますが、自社サイトが「モバイルフレンドリー」になっているかどうかを確認する方法を改めて紹介しましょう。「自分のサイトは大丈夫」と思っている人ほど、チェックが必要ですよ。

4/21からモバイルフレンドリーが順位に影響する

グーグルが発表したアルゴリズムの変更について理解しましょう。

モバイルフレンドリーとは

モバイルフレンドリーとは、Webサイトがスマートフォンでの表示に最適化されている状態を指します。具体的にはスマートフォンでの表示を想定し、操作しやすく、読みやすいサイトになっているということです。

2014年秋からはGoogleによってモバイルフレンドリーと判断されたページは、下図のようにモバイル版の検索結果で「スマホ対応」というラベルが追加されるようになっています。

01.png
モバイルフレンドリーと判断されると表示される「スマホ対応」 出典=Google ウェブマスター向け公式ブログ:検索ユーザーがモバイル フレンドリー ページを見つけやすくするために(http://googlewebmastercentral-ja.blogspot.jp/2014/11/helping-users-find-mobile-friendly-pages.html)

4/21にアルゴリズムが変更される

グーグルは2015年2月、モバイルフレンドリーを検索順位を決定する要素にすると発表しました。その適用開始日が4月21日なのです。モバイルフレンドリーなサイトにしておかないと、モバイル端末での検索順位が低下してしまう可能性が高くなります。

モバイルフレンドリーかどうかチェックしよう

自社サイトがモバイルフレンドリーかどうかを判断する方法は、「モバイルフレンドリーテスト」と「Googleウェブマスターツール」の2つあります。

モバイルフレンドリーテスト

モバイルフレンドリーテストは、サイトを解析し設計がモバイルフレンドリーであるかどうかを教えてくれるツールです。アクセスして表示されるページに、調べたいWebサイトのURLを入力してチェックします。対応している場合は図のように「問題ありません。このページはモバイルフレンドリーです」と表示されます。

02.png
モバイルフレンドリーと判断された場合の表示

問題がある場合は、下図のように「モバイルフレンドリーではありません」と表示され、詳細が表示されます。

03.png
モバイルフレンドリーではないと判断された場合の表示

Googleウェブマスターツール

Googleウェブマスターツールも確認しておきましょう。モバイルユーザビリティ レポートにエラーが出ていたら、対処する必要があります。エラーの内容と対処方法については、Googleウェブマスターツールから送られてくるメッセージを読んで対応していきましょう。

04.png
Googleウェブマスターツール

なんちゃってモバイルフレンドリーに注意

Web担当者や制作者が陥りがちなのは「うちのサイトはレスポンシブWebデザインだから大丈夫」とチェックしない、「モバイルフレンドリーテストに合格したからOK」と油断してエラーを見逃すケースです。それぞれ、よくある間違いを紹介してましょう。

ユーザーエージェントの識別ミスの場合

デバイスごとに表示ページを振り分ける場合は、ユーザーエージェント情報の識別が必要になります。しかし、ユーザーエージェント(UA)の識別ミスがあっても、モバイルフレンドリーテストに合格してしまうのです。この問題は、英語版のGoogle公式ヘルプフォーラムでも話題に挙がっています。

05.png
話題になったUAの識別ミス。出典=Google公式ヘルプフォーラム(https://productforums.google.com/forum/#!topic/webmasters/m0lc9D0Ow-k/discussion)

UAの識別ミスがあるかどうかは、Googleウェブマスターツールで確認するのが手っ取り早い方法です。多数のサイトで生じている現象なので、必ずGoogleウェブマスターツールでもチェックするようにしましょう。

レスポンシブWebデザインの誤解

グーグルが推奨しているレスポンシブWebデザインならモバイルフレンドリーなはず、と思う方も多いのではないでしょうか。しかし、あなたが考えている「レスポンシブWebデザイン」は実はモバイルフレンドリーではないかもしれません。

特に、一見レスポンシブWebデザインに見えるものの、実は特定のデバイスの画面幅に依存したpx単位のブレイクポイントを設定している場合は気をつけましょう(このようなサイトは「アダプティブデザイン」と呼ばれます)。端末によって横スクロールバーが表示されたり、レイアウトが崩れたりしてはレスポンシブWebデザインとは言えません。

レスポンシブWebデザインを本気で学びたい人は、基礎から学ぶことをおすすめします。正しいレスポンシブWebデザインを理解していれば、モバイルフレンドリー対応は怖くないでしょう

この記事は、「4月21日以降の順位低下に注意!モバイルフレンドリー対応のチェック方法」をもとに再構成したものです。

レスポンシブWebデザイン
マルチデバイス時代のコンセプトとテクニック

レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック (WEB PROFESSIONAL)

菊池崇 著

  • 定価:2,625円 (本体2,500円)
  • 発売日:2013年7月31日
  • 形態:B5変 (232ページ)
  • ISBN:978-4-04-886323-0
  • 発行:アスキー・メディアワークス
  • 発売:KADOKAWA

Web Professionalトップへ

Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く