モバイルファーストとは？導入する方法や取り組む際の注意点を解説

モバイルファーストとは

モバイルファーストとは、スマートフォンのようなモバイル端末からWebサイトを訪問した際に快適に閲覧できるようにすることを指します。
つまり、スマートフォン向けにWebサイトを作成することがモバイルファーストです。
あくまでもモバイル端末へ最適化することを優先する考えであり、パソコンからの閲覧をないがしろにするものではありません。

モバイルファーストインデックスが導入されたのはなぜ？

モバイルファーストインデックス（Mobile First Index：MFI）とは、Googleが2018年ごろから導入したSEO評価システムです。
この評価システムでは、インデックス登録と検索順位の決定にモバイル端末向けのWebサイトが優先的に使用されます。
では、モバイルファーストインデックスはなぜ導入されたのでしょうか。

モバイルファーストインデックス導入の理由

モバイルファーストインデックスが導入された理由は、パソコンユーザーよりもスマートフォンユーザーが増加したこととされています。

実際にGoogleは、2015年に「Google 検索セントラル ブログ」にて以下のように述べています。

インターネットへのアクセスに携帯端末が使用されるケースが増えてきたため、Google の アルゴリズム もこうした使用状況への対応が必要となっています。
引用：検索結果をもっとモバイル フレンドリーに｜Google 検索セントラル

総務省が発表した調査結果によると、2022年の個人のインターネット利用率は84.9％で、端末別に見るとスマートフォンが71.2％、パソコンは48.5％となっており、スマートフォンが22.6ポイント上回る結果となっています。
出典：令和5年版 情報通信白書｜総務省

およそ7割の人がインターネットを利用する際にスマートフォンを使用していることを鑑みても、モバイルファーストインデックス導入の理由にはスマートフォンの普及が大きく関わっていることがわかるでしょう。

パソコン用クローラーは2024年7月5日以降廃止

Googleは、クローラーと呼ばれる自動巡回ロボットを使用することでWebサイトの情報を収集し、評価しています。

クローラーには、「パソコン用 Googlebot クローラー」と「スマートフォン用 Googlebot クローラー」の2種類がありますが、2024年6月には「パソコン用 Googlebot によるクロールの終了」がアナウンスされました。
このことにより、2024年7月5日以降は「スマートフォン用 Googlebot クローラー」のみが巡回をするようになっているため、モバイル端末に適用していないWebサイトはインデックス登録の対象外となっています。

しかしGoogleは以下のように述べていることから、モバイル端末からのアクセスを制限しているような一部のWebサイトを除き、影響はほとんどないとされています。

大半のウェブサイトはすでに同クローラーを使用してクロールされており、そうしたウェブサイトに関する変更はありません。
引用：パソコン用 Googlebot によるクロールの終了｜Google 検索セントラル

モバイルファーストを取り入れない際に発生し得るリスク

ここまでご紹介したように、スマートフォンが普及していること、2024年7月5日以降「パソコン用 Googlebot クローラー」が廃止されたことを考慮すると、モバイルファーストを取り入れることは必要不可欠であるといえるでしょう。

しかし現在では、「パソコン用クローラーは2024年7月5日以降廃止」でも述べたように、多くのWebサイトでモバイルファーストが取り入れられているため、ほとんどのWebサイトでは特別な対応をする必要がないとGoogleも名言しています。
ではモバイルファーストを取り入れない場合、どういったリスクが発生する恐れがあるのでしょうか。

SEO評価が低下する

Googleは、「モバイルファースト インデックスに関するおすすめの方法」にて、検索順位を決定づける要素として、スマートフォン向けのWebページを用意することは必須ではないと述べています。
しかし、モバイルファーストを取り入れていないWebページにスマートフォンからアクセスした際に、スムーズに閲覧できない可能性があると、ユーザーエクスペリエンスの観点からSEOで低評価を受ける可能性があります。

Googleは以下のように述べていることから、ユーザーエクスペリエンスはSEO評価を向上させる要素であるといえます。

Google のコアランキング システムは、優れたページ エクスペリエンスを提供するコンテンツを高く評価するように設計されています
引用：有用で信頼性の高い、ユーザーを第一に考えたコンテンツの作成｜Google 検索セントラル

これらのことから、モバイルファーストを取り入れない場合、ユーザーエクスペリエンスが低下する恐れがあり、結果的にSEOで低評価を受ける可能性がある点は起こり得る最大級のリスクといえるでしょう。

Webサイト制作にコストがかかる

モバイルファーストを取り入れない場合、Webサイト制作にかかるコストが取り入れた場合と比較して高価になる可能性があります。 
モバイルファーストの場合は、はじめからスマートフォン向けに設計・開発することから、Webサイトの構造がパソコン向けと比較してシンプルになる傾向にあり、開発の手間が軽減されます。

読み込み速度が低下し離脱が増える

ページの読み込み速度が遅いと、ユーザーがWebページの閲覧をやめてしまう「離脱」の原因になります。
実際に2017年にGoogleが行った調査によると、読み込みに3秒以上かかった場合は、53％の人が閲覧を中止していると報告されています。
参照：Top 12 marketing insights from 2017｜Think with Google

「Webサイト制作にコストがかかる」でも述べたように、スマートフォン向けWebサイトは、パソコン向けと比較してもコード量や画像の容量などが軽減される傾向にあります。
そのため、読み込み速度が高速化されれば、離脱のリスクは防げるでしょう。

モバイルファーストを取り入れるデメリット

モバイルファーストを取り入れない場合、SEO評価の低下や読み込み速度の低下による離脱の増加などのリスクがあることをお伝えしました。
これらは裏を返すと、モバイルファーストを取り入れることでSEO評価の向上や、読み込み速度の高速化による離脱防止へとつながるといったメリットにもなるといえます。
では一方で、モバイルファーストを取り入れることによるデメリットにはどのようなものがあるのでしょうか。

ユーザビリティが低下する

ユーザビリティとは、いわゆる見やすさや使いやすさを表す言葉です。
モバイルファーストを取り入れることにより、パソコンからWebサイトを閲覧した際に見づらくなる可能性があります。
左右に余白を残したままパソコン画面の中心に縦長のWebページが表示され、文字サイズも小さくスクロール量も多くなってしまえば、パソコン向けWebサイトのユーザビリティの低下を招いてしまうでしょう。
ただし、レスポンシブデザインを導入している場合は、閲覧するデバイスの画面サイズに合わせて自動でWebページが最適化されるため、ユーザビリティの低下は起きにくいといえます。

情報量が減少する

モバイルファーストを導入したコンテンツ作りでは、スマートフォンへの最適化を重視するため、画面サイズの問題からパソコン向けWebサイトと同じ情報量を載せられないケースもあります。
このようなケースでは、スマートフォン向けの情報量をパソコン向けより少なくすることがあります。

画面サイズの問題で情報量が減少してしまうケースがあることは、モバイルファーストのデメリットといえるでしょう。

モバイルファーストインデックスに対応するための5STEP

モバイルファーストに対応することは、モバイルファーストインデックスへ向けた対策にもなります。
「パソコン用クローラーは2024年7月5日以降廃止」で述べたとおり、Googleが「パソコン用 Googlebot クローラー」を廃止し、今後は「スマートフォン用 Googlebot クローラー」を使用するとアナウンスしたことから、モバイルファーストインデックスに対応するための対策も必須となることが予想されます。
ここでは、モバイルファーストインデックスに対応するための手順を、5つのSTEPに分けてご紹介します。

STEP❶レスポンシブデザインを導入する

レスポンシブデザインとは、ユーザーが使用している端末の画面サイズに合わせてWebサイトのデザインを最適化することを指します。
モバイルファーストに対応するなら、まずはレスポンシブデザインを導入しましょう。
レスポンシブデザインは、Googleが運営しているweb.dev内の「Learn Responsive Design」にて学ぶことができます。

レスポンシブデザインは、さまざまな企業でも導入されています。
下記は、大手自動車メーカーである日産自動車の公式Webサイトです。
1枚目がパソコン向けWebサイト、2枚目がスマートフォン向けWebサイトです。

【パソコン向けWebサイト】

【スマートフォン向けWebサイト】

引用：日産自動車

レスポンシブデザインが適用され、同じ内容のWebサイトであっても、メニューの表示方法などが違うことがわかります。

STEP❷Webページの表示速度を最適化する

Webページの読み込み速度が遅い場合は離脱の原因となります。
また、ユーザビリティとユーザーエクスペリエンスの低下を招くことにもつながるため、モバイルファーストを取り入れるのであれば、Webページの表示速度の最適化は欠かせません。

Webページの表示速度を最適化する方法には、以下のようなものがあります。

• 画像・動画サイズを最適化する
• HTML、CSS、JavaScriptなどのコードを最適化する
• ブラウザキャッシュのキャッシュを使用する
• サーバーを移管する

STEP❸ユーザビリティを向上させる

ユーザビリティを向上させることは優れたユーザーエクスペリエンスを提供することにつながります。
ユーザーエクスペリエンスはSEO評価にも関わる指標であるため、モバイルファーストを取り入れる際にはユーザビリティを視野に入れたWebサイト設計を行いましょう。

ユーザビリティを向上させる方法には、以下のようなものがあります。

• 読みやすいテキストサイズにする
• タップしやすいボタンサイズにする
• タップできる場所だとわかりやすいデザインにする
• リンク箇所をわかりやすくする

Googleは、ボタンサイズについてweb.dev内で以下のように述べています。

推奨されるタップ ターゲットの最小サイズは、デバイス非依存ピクセルで約 48 です
（中略）
48x48 ピクセル領域は約 9 mm に相当します。 人の指の腹ほどの大きさです
引用：タップ ターゲットのユーザー補助機能｜web.dev

ボタンの大きさは、Googleが推奨している48×48ピクセルを目安にするのがよいでしょう。

STEP❹リンクを最適化する

従来のモバイルファーストインデックスでは、スマートフォン向けのWebサイトが優先的にクロールされていました。

しかし先述のとおり、Googleは「パソコン用 Googlebot クローラー」を終了させていることから、現在ではスマートフォン向けのWebサイトのみがインデックスされていると予想されます。
そのため、パソコン向けWebサイトでリンクを設置していても、スマートフォン向けWebサイトでリンクを設置していない場合、そのリンクをクローラーがたどることができません
リンク先をクローラーに巡回させるためにも、リンクを最適化しましょう。

特に内部リンクの場合は、クローラーがたどる際にリンク元とリンク先の記事の関連性を認識し、SEO評価に役立てるとされていることから、パソコン向けとスマートフォン向けの両方に同じリンクを設置する必要があるといえます。
リンクを設置する場所も、ユーザーの立場に立って考え、どのようなかたちであればわかりやすいかを考えて選びましょう。

STEP❺Google Search Consoleを使って確認する

Google Search Consoleとは、Google検索における検索順位をモニタリングし、管理ができるツールのことです。
Google Search Consoleでは、インデックスされなかったりユーザビリティに問題があったりするページがわかります。
モバイルファーストを取り入れるためのSTEP❶～❹が完了したら、Google Search Consoleで問題がないかを確認しましょう。

モバイルファーストインデックス対策に取り組むときの注意点

モバイルファーストインデックスへの対策は、今後も必要不可欠なものとなるであろうことは先述のとおりです。
最後に、モバイルファーストインデックス対策に取り組むときの注意点をご紹介します。

アノテーションの設定が必要なケースもある

アノテーションとは、パソコン向けWebページとスマートフォン向けWebページでURLが違う際に、同じ内容のコンテンツであることをクローラーに伝えるものです。
この設定をしないと、クローラーが重複したコンテンツだと判断し、SEOに悪影響を及ぼしたり、どちらを評価すべきかわからなくなってしまったりと、正しいSEO評価が受けられなくなる要因となります。
忘れずに設定するようにしましょう。

アノテーションの記述例は以下のとおりです。
※今回は、サンプルURLとして、パソコン向け「https://sample.annotation.com/」・スマートフォン向け「https://sample.annotation.com/sp/」を使用します。

パソコン向けWebページ（head内に記述）

<link rel="alternate" media="only screen and (max-width: 640px)" 
　href="https://sample.annotation.com/sp/" >

スマートフォン向けWebページ（head内に記述）

<link rel="canonical" href="https://sample.annotation.com/" >

これらは、別々のURLで運用しているWebページのすべてに適用させるようにしましょう。

モバイル向けコンテンツも用意する

「パソコン用 Googlebot によるクロールの終了」でもアナウンスされていたように、モバイル端末からのアクセスを拒否する設定をしているようなスマートフォンから一切閲覧ができないWebサイトは、今後Googleのクローラーによる巡回がされず、インデックス登録もされなくなってしまいます。
インデックス登録をされなければGoogleの検索結果に表示されません。
そのため、パソコン向けのコンテンツのみを作成している場合は、スマートフォン向けのものも作成しましょう。

構造化マークアップはパソコン向け・スマホ向けともに記述する

構造化マークアップとは、Googleのクローラーにテキストやコンテンツの内容を適切に理解してもらうための手法です。

例えば、「読書」という単語を見ると、私たち人間は「本を読むこと」と意味を理解できます。
しかしGoogleのクローラーにとって、それは文字列でしかなく意味までは理解できません。
その理解を助けるためにあるのが構造化マークアップです。

構造化マークアップをパソコン向けWebページだけに記述している場合は、インデックス対象であるスマートフォン向けWebページが見落とされないよう、スマートフォン向けにも記述する必要があります。
記述後は、誤りがないかどうか「Schema Markup Testing Tool」から確認するようにしましょう。

まとめ

この記事では、モバイルファーストとはどういったものなのかに焦点を当て、モバイルファーストインデックスや、Googleがアナウンスしている情報についてご紹介しました。
モバイルファーストとは、モバイル端末からWebサイトを訪問した際に快適に閲覧できるようにすることを指します。

モバイルファーストインデックスは、インデックス登録と検索順位の決定にモバイル端末向けのWebサイトが優先的に使用されるという、Googleが導入したSEO評価システムです。
モバイルファーストが重要視され、モバイルファーストインデックスが導入された背景にあるのは、インターネット検索時に使用するデバイスが、パソコンではなくスマートフォンへと移り変わったことが背景にあるといえるでしょう。

モバイルファーストインデックスに対応するためには、この記事で紹介した5つのステップが有効です。
取り組む際の注意点に留意しながら、モバイルファーストへの対応を進めていきましょう。