• TOP
  • SEO対策ガイド
  • モバイルSEOに不可欠なモバイルフレンドリーとは?その対策やチェック方法

モバイルSEOに不可欠なモバイルフレンドリーとは?その対策やチェック方法

スマホの普及が進み、PCよりもスマホからインターネットを利用するユーザーが多くなる中、モバイル対応はサイト運営者にとって喫緊の課題となっています。

中でも、Googleのランキング要素として検索順位に影響する「モバイルフレンドリー」への対応は非常に重要です。

今回は、モバイルフレンドリーの基礎知識から、モバイルフレンドリーであるための条件やモバイルフレンドリーにするための方法まで紹介します。

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

モバイルフレンドリーとは、携帯・スマホやタブレットなどのモバイル端末で見やすく使いやすいように最適化することです。

モバイルへの対応が加速したきっかけのひとつに、Googleが2015年4月、モバイルフレンドリーアップデートの導入を開始したことがあります。

このアップデートにより、モバイル端末からの検索に際しては、モバイルフレンドリーであるページが上位に表示されやすくなりました。

モバイルフレンドリーが導入された背景

Googleがモバイルフレンドリーアップデートを導入した背景には、昨今の著しいスマホの普及そしてモバイルユーザーの増加があります。

たとえば、総務省|令和2年版 情報通信機器の保有状況 によると、2019年における個人のモバイル端末の保有状況の中で、「スマートフォン」の保有者の割合が67.6%との結果が出ています。また、2015年には日米など10か国において、Google検索の半数以上がモバイルからとなっています。

こうした急速なモバイルユーザーの増加の中、Googleが問題視するようになったのが「モバイルフレンドリーではない」ページの存在です。

モバイルフレンドリーでないページはユーザー体験を損なう

モバイル端末のことを考慮せず、従来どおりPCからの閲覧しか想定していないページは、その多くがモバイルユーザーから敬遠されがちです。

画面サイズや縦横比をPC前提に表示していることからくる「文字が小さすぎる」「コンテンツを全て表示するためには横スクロールもしなくてはならない」などは、モバイルユーザーが読みづらいと感じる要因です。

あるいは、スマホ特有の操作である指によるタップを考慮していないため、リンクやナビなどの要素が互いに近すぎて、上手くタップできないという操作性の悪さもユーザーにストレスを感じさせます。

そして、こうしたモバイルフレンドリーでないページは、ユーザーの満足度を低下させてしまい、Googleに対する不満増加や信頼低下にもつながってしまいます。

そこで検索の大半を占めるモバイルユーザーの満足度を向上させるためにも、モバイルフレンドリーアップデートの導入は必須だったと言えるでしょう。

モバイルフレンドリーはランキング要素として順位に影響

SEO対策においてもランキングの上位を狙うためには、モバイルフレンドリーは重要です。

Googleのアルゴリズムにおけるランキング要素は200以上ありますが、基本的にその詳細は公開されていません。

そうした中、モバイルフレンドリーがランキング要素として順位に影響すると公表し、さらにアップデートの開始日(2015年4月21日)までアナウンスしていたことからも、いかにGoogleがモバイルへのシフトを重視しているかが伺えます。

なお、モバイルフレンドリーが影響するのは、あくまでスマホなどのモバイル端末からの検索における順位に対してのみであり、PCからの検索における順位には影響しません。

モバイルフレンドリーなサイトに求められる条件

では、モバイルフレンドリーである状態とは、具体的にどのようなページを指しているのでしょうか。

以下の4つの項目が挙げられます。

  1. モバイルではあまり使うことがないFlashなどのソフトウェアは避ける
  2. 横にスクロールしたりズームしたりしなくて済むように、コンテンツのサイズについて配慮する
  3. ズームしなくても判読できるように、文字の大きさに配慮する
  4. 関係ないところをタップしなくて済むように、リンクを付ける箇所は十分に離れた状態で配置する

①モバイルではあまり使うことがないFlashなどのソフトウェアは避ける

Flashなどのプラグインは、ほとんどのモバイルブラウザでサポートされていないため、HTML5などの広くサポートされた技術で対応する必要があります。

③横にスクロールしたりズームしたりしなくて済むように、コンテンツのサイズについて配慮する・④ズームしなくても判読できるように、文字の大きさに配慮する

モバイルとPCでは画面のサイズおよび縦横比が大きく異なります。

スマホでもコンテンツを読みやすくするためには、ビューポート(viewport)を端末の幅に収まるように設定し、その上でフォントサイズやコンテンツ幅をビューポートにあわせて適切に設定する必要があります。

④関係ないところをタップしなくて済むように、リンクを付ける箇所は十分に離れた状態で配置する

指を使って操作することは、スマホならでの特徴です。

複数のリンクの位置が近すぎると、目的のリンクをタップするためにわざわざピンチ操作で拡大しなければならず、ストレスを感じるユーザーは多くいます。

こうしたスマホでの操作性を考慮して、リンクやボタン、ナビゲーションなどの要素が近すぎないように配置する必要があります。

ページスピードもモバイルフレンドリーの要素に追加

またGoogleは、2016年にページスピードもモバイルフレンドリーのアルゴリズムに追加しました。

この背景には、ページの読み込みに3秒以上かかるとモバイルユーザーの半数以上がサイト訪問を諦めて離脱するというGoogleの調査結果があります。

とくにモバイル環境においては、軽くて、早くて、見やすいサイトがユーザーに好まれ、またユーザーの役に立つとGoogleが評価していることが伺えます。

そしてスクロールせずに見える範囲のコンテンツを1秒未満で配信することを推奨しています。

モバイルフレンドリーであるかを確認するには

自サイトのページが実際にモバイルフレンドリーに対応できているかを確認する方法を見ていきましょう。

モバイルフレンドリーへの対応状況はGoogleのツールで確認できます。

モバイルフレンドリーテストツールの活用

モバイルフレンドリーへの対応状況をページ単位で確認するには、Googleの「モバイルフレンドリーテストツール」を利用します。

使い方は非常にシンプルで、対象ページのURLを入力するだけで調べることができます。

モバイルフレンドリーかどうかは、スマホ画面のイメージとともに提示されます。

モバイルフレンドリーでない場合は、どの点が、どのような理由でモバイルフレンドリーでないのかというエラーメッセージが表示されます。

エラーメッセージの種類

モバイルフレンドリーテストツールでは、モバイルフレンドリーでない要素があった場合に以下のようなエラーメッセージが表示されます。

メッセージの内容に従って、適切な修正を行うようにしましょう。

  • 互換性のないプラグインを使用しています
  • ビューポートが設定されていません
  • ビューポートが「端末の幅」に収まるよう設定されていません
  • コンテンツの幅が画面の幅を超えています
  • テキストが小さすぎて読めません
  • クリックできる要素同士が近すぎます

「互換性のないプラグインを使用しています」と表示される場合、Flashなどのプラグインを使用している可能性があります。アニメーションなどを利用したい場合は、HTML5などの広くサポートされた技術を利用する必要があります。

サイズに関するエラーが出た場合は、スマホ画面で適切なサイズで表示できるように、メタタグを用いてビューポートプロパティを設定するなどを行うといいでしょう。ビューポートプロパティで画面サイズに合わせてページのサイズとスケーリングを調整する方法をブラウザに指示し、その上で画像要素やフォントサイズをビューポート内で適切にスケーリングします。

さらに、「クリックできる要素同士が近すぎます」と出るのは、ボタンやリンクなどのタップ要素が近すぎるために指で操作しにくくなっていることを表しています、タップターゲット同士の距離を適切に調整する必要もあります。

Search Consoleでモバイルユーザビリティもチェック

モバイルフレンドリーテストツールでページ単位でのモバイルフレンドリー対応を確認したら、次のステップとしてサイト全体のモバイルユーザビリティもチェックしましょう。

これにはSearch Consoleの「モバイルユーザビリティレポート」を利用します。サイト全体でモバイルユーザビリティの問題を検出できるので、対応できていないページを探し出してモバイルフレンドリーに修正しましょう。

サイトをモバイルフレンドリーにする際の注意点

モバイルサイトの実装方法

サイトをモバイルフレンドリーにする実装方法には以下の3つがあります。

  1. レスポンシブデザイン
  2. ブラウザのUA(ユーザーエージェント)に応じて動的に配信
  3. PCとモバイルで別々のURLを用意

①レスポンシブデザイン

レスポンシブデザインは端末の種類に関係なく、同一のURLから同一のHTMLコードを配信し、画面サイズに応じて表示のみを自動的に変える方法です。管理が楽な反面、デザインにはある程度の制限も生じます。

②ブラウザのUA(ユーザーエージェント)に応じて動的に配信・③PCとモバイルで別々のURLを用意

モバイルとPCで異なるHTMLコードを配信することで、端末に最適なデザインを利用できます。

その反面、②ではUAの検出や照合においてミスが発生しやすく、③ではリダイレクトやアノテーションの設定、更新作業などが煩雑になってしまいます。

Googleはレスポンシブデザインをとくに推奨していますが、必ずしもレスポンシブデザインでなくても構いません。現在のWebサイトの状況や今後の展開にあわせて、適切な実装方法を選択するようにしましょう。

【スマホ・モバイルのSEO対策】Googleで検索順位を上げる方法

Googleが評価するコンテンツとは

モバイルフレンドリーはモバイル検索からの順位に影響するランキング要素ですが、注意しておきたいのは、「モバイルフレンドリーかどうかだけで評価が決まるわけではない」という点です。全体としての評価にはコンテンツ内容やその他のSEO対策も大きな割合を占めます。

「いくらコンテンツが良くても、モバイルフレンドリーでないとモバイル検索の評価が下がる」というのがモバイルフレンドリーの趣旨ですが、逆にどれだけモバイルフレンドリーに対応しても、コンテンツの内容が伴わなければ順位は上がらないのです。

Googleが評価する良質なコンテンツとは、おもに以下の条件を満たすコンテンツであると考えられます。

  1. ユーザーの役に立つコンテンツであること
  2. 内容が正しいコンテンツであること
  3. 情報源として信頼できるコンテンツであること
  4. 関連した情報の網羅性が高いコンテンツであること

こうしたコンテンツを作るためには、適切なコンテンツSEOの実施が欠かせません。

Googleの考え方や方針、具体的なコンテンツSEOの手順などについては下記から詳細をご確認いただけます。

コンテンツでSEO対策!プロが教えるユーザーからも検索エンジンからも評価される高品質コンテンツの作り方

【まとめ】ツールを活用してモバイルフレンドリーを実現しつつ、良質なコンテンツの提供を

モバイルフレンドリーとは、スマホなどのモバイル端末で閲覧した際の読みやすさや操作性の良さを示します。

バイルフレンドリーであるかどうかはモバイル端末からの検索順位に影響します。

モバイルフレンドリーであるための条件としては、

  1. モバイルではあまり使うことがないFlashなどのソフトウェアは避ける。
  2. 横にスクロールしたりズームしたりしなくて済むように、コンテンツのサイズについて配慮する
  3. ズームしなくても判読できるに、文字の大きさに配慮する
  4. 関係ないところをタップしなくて済むように、リンクを付ける箇所は十分に離れた状態で配置する

という4点が挙げられます。また、これに加えてページスピードもモバイルフレンドリーの要素として評価されます。

ページがモバイルフレンドリーであるかどうかを確認するためには、Googleの提供するツールである「モバイルフレンドリーテストツール」を利用します。さらに、Search Consoleの「モバイルユーザビリティレポート」でサイト全体のモバイルユーザビリティもチェックしましょう。

サイトをモバイルフレンドリーにする際は実装方法にも注意するほか、良質なコンテンツの提供を第一に考えることが重要です。

SEO Japanを運営するアイオイクスでは、モバイルフレンドリーへの対応支援やモバイルサイトの構築支援に加えて、お客さまのサイトや事業における課題・状況に応じて効果的なSEO対策のコンサルティングを行っております。

テクニカルSEOやコンテンツSEOによる上位表示を目指すための、サイトの本質的な価値向上についてもご支援いたします。

SEO・サイト運用・コンテンツマーケティングでのお悩みをお気軽にご相談ください。

お気軽にご相談ください

詳しい要件等が固まっていなくてもご相談ください。
ご相談はもちろん無料です。

Webマーケティングの
詳しいご相談はこちらから

サービス資料を
ダウンロードいただけます