モバイルフレンドリーとは？対応方法やSEOへの影響を解説

モバイルフレンドリーは、スマホ対応していないページの順位を、モバイル検索で低下させるアルゴリズムです。ウェブを閲覧するデバイスとして、スマホが最も使われている現代では対応が必須です。

しかし具体的なSEOへの影響や、スマホページの作成方法がわからない方も多いのではないでしょうか。

この記事では、モバイルフレンドリーの概要や対応方法を解説していきます。モバイルユーザビリティの向上を考えている方は、ぜひ参考にしてください。

＜SEO対策について詳しく知りたい方はこちら＞SEO対策とは？SEO対策のメリット・デメリットと対策方法を詳しく解説

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

モバイルフレンドリーは、2015年4月のアップデートで追加されたGoogleのアルゴリズムです。スマホでの閲覧に対応していないサイトの、モバイル検索での掲載順位を下げるために実装されました。

昨今のスマホユーザーの増加に伴い、スマホで閲覧する時のユーザビリティは無視できないものとなっています。

そこでGoogleは、スマホユーザーがより使いやすい検索エンジンにするために、モバイルフレンドリーアップデートを実行しました。

なお、モバイルフレンドリーの主な特徴は、以下の3つです。

• ページ単位での適用
• モバイル検索の結果にのみ適用
• 世界中のWebサイトに影響する

モバイルフレンドリーのSEOへの影響

モバイルフレンドリーでは、SEOに対して直接的な影響を与えます。スマホ閲覧に対応していない、あるいはモバイルユーザビリティが低いページの検索順位を落とすためです。

また、本来モバイルフレンドリーはPC版の検索結果には関係がありませんでしたが、現在は影響を与えます。2018年3月にGoogleがモバイルファーストインデックスを開始したためです。

モバイルファーストインデックスは、検索結果に表示するページの判断基準を全てスマホページに変更する施策です。これにより、現在はPC版の検索順位を決定する際も、スマホページが優先されています。

つまり、モバイルフレンドリーに未対応のページは、PC版の検索結果でも順位を落とす可能性があります。

モバイルフレンドリーは、検索順位の直接的な影響を及ぼすため、必ず自社サイトがスマホ対応できているか確認しましょう。

自社サイトがモバイルフレンドリーか確認する方法

Googleが提供している以下2つのツールで、自社サイトがモバイルフレンドリーか確認できます。

• モバイルフレンドリーテスト
• Googleサーチコンソール

それぞれ詳しく解説していきます。

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

モバイルフレンドリーテストは、モバイルフレンドリーへの対応状況や改善点を無料で確認できるツールです。

使用方法は、調査したいページのURLを入力するだけです。ページに問題がない場合は「ページはモバイルで利用できます」という文言が表示されます。

「このページはモバイルフレンドリーではありません」という文言とともに以下の改善点が表示されていれば、指示に従ってページを修正しましょう。

• フォントサイズの適正
• ビューポートの設定
• クリック可能な要素の近接度
• コンテンツサイズのビューポートへの対応状況

Googleサーチコンソール

Googleサーチコンソールは、Webサイトにアクセスする前のユーザーの行動やサイトの構造を分析できるツールです。以下の流れで、モバイルフレンドリーの対応状況を確認できます。

1. Googleサーチコンソールを開く
2. 左側のサイドメニューの「モバイルユーザビリティ」をクリック

「問題ありません」と表示されていれば、サイト内のすべてのページがモバイルフレンドリーに対応しています。

未対応のページがあれば、該当ページのURLとともに改善点が表示されます。

チェックの項目については、モバイルフレンドリーテストと変わりはありませんが、一度にすべてのページを確認できるため便利です。

モバイルフレンドリーに対応する方法

モバイルフレンドリーに対応するには、以下のいずれかの方法でスマホページを作成する必要があります。

• レスポンシブウェブデザイン
• ダイナミックサービング
• セパレートタイプ

それぞれ詳しく解説していきます。

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

レスポンシブウェブデザインは、閲覧デバイスの画面サイズに応じて、適切なレイアウトでページを表示できるデザインです。

全デバイス共通のHTMLファイルを1つ用意し、CSSでメディアクエリを使って実装します。管理がしやすく、導入も簡単なため、最もおすすめな方法です。

ダイナミックサービング

ダイナミックサービングは、ページにアクセスしたユーザーのデバイスに応じて、異なるHTMLファイルを呼び出す方法です。

動的な配信とも呼ばれ「user-agent」スニッフィングと「Vary: user-agent」HTTPレスポンスヘッダーを利用して実装します。

セパレートタイプ

セパレートタイプは、PCとスマホで異なるURLのページを用意する方法です。

ダイナミックサービングと同様に、「user-agent」スニッフィングと「Vary: user-agent」HTTPレスポンスヘッダーを利用して実装します。

またURLの違いによるSEO評価の分散を防ぐために、canonicalタグを使ってPCページのURLをスマホページに正規化する必要があります。

モバイルユーザビリティを高めるポイント

モバイルユーザビリティを高めるためには、以下4つのポイントを意識しましょう。

• フォントサイズの最適化
• 画像や動画のサイズを調整
• ページの読み込み速度の改善
• リンクの間隔を調整

それぞれ詳しく解説していきます。

フォントサイズの最適化

PCとスマートフォンでは、見え方が大きく異なります。PCのフォントサイズをそのまま採用すると、スマホで読みづらくなるため注意が必要です。

また、文字の感覚や行間のスペース、開業のポイントなどにも気を配りながら、スマホ用のページを作成しましょう。

画像や動画のサイズを調整

スマホで表示した際に、画像や動画がズレていないか確認しましょう。レイアウトが崩れているとユーザビリティはもちろん、Core Web Vitalsの低下からSEO評価も下がる可能性があります。

また、操作ミスの原因にもなるためユーザーはストレスを感じ、離脱につながる恐れもあります。PCとスマホで使用する画像を分けたり、CSSの値を調整したりして、最適なレイアウトで表示するように工夫しましょう。

ページ読み込み速度の改善

スマートフォンはPCに比べてスペックが低く、サイトの表示に時間がかかることがあります。

表示速度が遅いサイトは、ユーザーにストレスを与えるため、ページを離脱される可能性も高まります。

またGoogleは、極端に表示速度が遅いサイトの検索順位を下げると公言しているため、注意が必要です。画像のファイルサイズを下げる、JavaScriptのコードを最適化するなどの対策をとりましょう。

リンクの間隔を調整

スマートフォンは画面をタップして操作を行うため、クリックできる要素同士が近すぎると、誤操作を誘発します。そのためリンクの範囲が狭い、ボタンが密集しているなどのレイアウトは、ユーザビリティを大きく低下させます。

ページが完成したら自分で実際に操作を行い、ストレスなく回遊できるかテストしてみましょう。

まとめ：現代のSEOではモバイルフレンドリーへの対応が必須

スマホユーザーの増加に伴い、現代ではスマホページの評価が検索順位決定の指標となっています。

そのため、SEO対策で成果をあげるにはモバイルフレンドリーへの対応が必須です。ツールを使って確認し、未対応の場合は早急に対策をとりましょう。

また、モバイルフレンドリーに対応させるには、レスポンシブウェブデザインの採用がおすすめです。この記事を参考に、ユーザビリティの高いスマホページを制作してください。

弊社のSEOサービス「ランクエスト」では、お客様ごとに専任のコンサルタントがつき、戦略立案からコンテンツ制作、効果測定まで、すべて対応いたします。SEO対策にお悩みの方は、お気軽にご相談ください。