Googleがモバイルフレンドリーアップデートを全世界で更新

  皆様こんにちは。 GMOソリューションパートナー株式会社のWEB改善事例集にて今回ご紹介するのは モバイルフレンドリーアップデートを全世界で更新したという内容です。 2016年5月12日のGoogleジョンミューラー氏のツイッターの発表で全世界に展開済みである旨のコメントがありました。 しばらく前から開始されており、5/12で完了済みとのことでした。  

5月のモバイルフレンドリーアップデートの意味

5月12日に発表されたモバイルフレンドリーアップデートの趣旨は3月に発表されたものになります。 つまり、2015年4月21日に実施されたモバイルフレンドリーアップデートの効果を高めるアルゴリズムの改善です。 Googleは公式ブログでモバイルでも見やすいページが検索結果でさらに多く表示されるようになると発言しているので、スマートフォンで検索した際には、モバイルフレンドリーなサイトがより上位表示しやすくなることは間違い無いでしょう。  

モバイルフレンドリーの対応方法

モバイルフレンドリー対応とは、Googleが推奨するスマートフォンで閲覧した際に見やすいサイトにするということです。 具体的な対応方法はモバイルフレンドリーテストというツールで修正ポイントを知ることができます。 対策ページのURLを調査してみましょう。

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

https://www.google.com/webmasters/tools/mobile-friendly/?hl=ja

モバイルフレンドリーテスト（リニューアル版）

https://search.google.com/search-console/mobile-friendly ※上記モバイルフレンドリーテストは、新バージョンになります。段階的に公開されておりますので、まだ使用できないユーザーもいる可能性があります。  

モバイルフレンドリーテストの主な項目について

 「テキストが小さすぎて読めません」について

PCサイトをそのままスマートフォンで表示してしまうと、字が小さすぎて読みづらい状態になります。 スマートフォンで閲覧した際にも読みやすい文字の大きさにする必要があります。 スマホ用のレイアウトを用意し、次項のviewpointの設定によりフォントサイズを設定することが重要です。

「モバイル用 viewport が設定されていません」について

モバイル用 viewport設定をしているサイトはスマートフォンで見やすいサイズに表示されます。 また、モバイル用 viewport設定が されていないサイトは、PCと同じ見た目がスマートフォンで表示されるため情報が小さく読みづらい状態になります。 具体的には、以下のタグを各ページのheadタグ内に設定しましょう。

<meta name="viewport" content="width=device-width, initial-scale=1" />

「リンク同士が近すぎます」について

メニューやナビゲーションなどで、リンク同士が近すぎると隣のリンクをタップしてしまうかもしれません。 スマートフォンユーザーのユーザビリティが低くなってしまいます。

「コンテンツの幅が画面の幅を超えています」について

横スクロールしなければ、文字の続きが読めない状態は、ユーザビリティが非常に低いです。スマートフォンの画面幅で、横スクロールなしに文字が読めて、画像が閲覧できるようにしましょう。 具体的には、PCからのアクセスの場合と、スマートフォンからのアクセスによって、読み込むスタイルシートを分けて最適なデザインにするレスポンシブデザインにする方法があります。 あるいは、アクセスされた端末がPCかスマートフォンかを判断して、スマートフォンからのアクセスの場合は、スマートフォン用のページに転送する方法などもあります。  

まとめ

スマートフォンユーザーのユーザビリティ向上と、モバイルフレンドリーアップデートによるモバイル検索順位の改善のため、モバイルフレンドリーテストを実施し、スマートフォン対応を進めていきましょう。