• SEOを学ぶ

モバイルファーストインデックス:モバイルフレンドリーなウェブサイトを確保するためのガイド

  • Yoni Yampolsky
  • 11 min read
モバイルファーストインデックス:モバイルフレンドリーなウェブサイトを確保するためのガイド

イントロ

モバイルファーストインデックスは、検索エンジン最適化(SEO)やウェブサイト開発の世界では目新しい話題ではない。実際、Exploding Topicsによると、全世界のトラフィックの55%以上がモバイルデバイスからのものだという。

あなたのビジネスがモバイルフレンドリーなウェブサイトを持っていない場合、潜在的な顧客はおそらくあなたのサイトから数秒で離脱するでしょう。

あなたのウェブサイトがGoogleの検索エンジン結果ページ(SERP)に表示されるための最善の方法は、モバイルファーストインデックスを採用することです。

これは、Googleがサイトのコンテンツのモバイル版に基づいてウェブサイトをランク付けする方法である。

このガイドでは、正しい道へと導くために、レスポンシブ・ウェブサイトデザインを作成することでモバイルファーストインデックスを取り入れる方法を説明します。

ウェブサイトがモバイルフレンドリーかどうかをチェックする

モバイルファーストインデックスでは、検索エンジンはあなたのウェブサイトのモバイル版をクロールし、何よりも優先して表示します。あなたのウェブサイトがモバイルフレンドリーでない場合、デフォルトでデスクトップ版がモバイルディスプレイに表示されます。

そして、モバイルユーザーは、スマートフォンやタブレットで、特大サイズの使いにくいウェブサイトを見ることになるかもしれません。控えめに言っても、理想的な状況ではありません。あなたはレスポンシブデザインを逃しているのです。そして、あなたのウェブサイトは異なるスクリーンサイズに適応していないのです。

Ranktrackerの紹介

効果的なSEOのためのオールインワン・プラットフォーム

ビジネスが成功する背景には、強力なSEOキャンペーンがあります。しかし、数え切れないほどの最適化ツールやテクニックがあるため、どこから手をつければいいのかわからないこともあります。でも、もう心配はありません。効果的なSEOのためのオールインワンプラットフォーム「Ranktracker」を紹介します。

Ranktrackerの登録がついに無料になりました。

無料アカウント作成

または認証情報を使ってサインインする

あなたのウェブサイトがすでにモバイルフレンドリーであるかどうかを確認することによって、このシナリオを回避することができます。最良の方法は、GoogleのPageSpeed Insightsツールを使用することです。

PageSpeed Insights (画像ソース)

あなたのウェブサイトのURLを検索バーに差し込むだけで、モバイルデバイスでのパフォーマンスに関するリアルタイムのデータを見ることができる:

PageSpeed Insights results (画像ソース)

ご覧の通り、モバイルフレンドリーウェブサイトのスコアを90~100の間で維持することが極めて重要です。もしあなたのウェブサイトがモバイルフレンドリーでないことがわかったら、Google Search Consoleにアクセスしてみましょう。

Mobile Usability from Search Console (画像ソース)

Ranktrackerの紹介

効果的なSEOのためのオールインワン・プラットフォーム

ビジネスが成功する背景には、強力なSEOキャンペーンがあります。しかし、数え切れないほどの最適化ツールやテクニックがあるため、どこから手をつければいいのかわからないこともあります。でも、もう心配はありません。効果的なSEOのためのオールインワンプラットフォーム「Ranktracker」を紹介します。

Ranktrackerの登録がついに無料になりました。

無料アカウント作成

または認証情報を使ってサインインする

そこで、クロールの問題、サイトスピードの問題、モバイル体験を妨げている可能性のあるその他のエラーを見つけることができます。

しかし、Google Search Consoleの記事を読むと、モバイルフレンドリーに関する最も一般的な問題を見つけることができる:

  • モバイルユーザーのタッチ入力(リンクとボタン)に関する問題
  • レスポンスの悪いウェブサイトのデザイン、テンプレート、テーマ
  • モバイルフレンドリーでないポップアップ
  • 奇妙なウェブサイト・ナビゲーション
  • 読みにくいフォント

あなたのウェブサイトがゼロから構築されたものであれ、WordPressのようなコンテンツ管理システム(CMS)を使用しているものであれ、あなたのサイトがすでにモバイルフレンドリーであると考えるべきではありません。

PageSpeed InsightsとGoogle Search Consoleは、あなたのウェブサイトのモバイルパフォーマンスの概要を教えてくれるので、モバイル画面のために必要な改善を行うことができます。

デスクトップとモバイルデバイスの両方で同じエクスペリエンスを提供できるようにする。

SEO担当者や開発者は、優れたユーザー体験(UX)を促進するために、モバイルウェブサイトからいくつかのウェブ機能をカットするのが一般的だ。

結局のところ、無駄な要素でいっぱいの不便なモバイルサイトを持つことは決して良い考えとは言えません。しかし、これらの機能を排除しすぎると、ウェブサイトのモバイルファーストインデックスに影響を与える可能性があります。

グーグルは、デベロッパーがデスクトップとモバイルの両方のユーザーに同じ体験を提供できるようにしたいと考えている。以下は、この件に関するグーグルの具体的なコメントである:

"モバイルサイトのコンテンツがデスクトップサイトより少ない場合は、モバイルサイトの主要コンテンツがデスクトップサイトと同等になるように更新することを検討してください。あなたのサイトのインデックスは、ほぼすべてモバイルサイトからもたらされます。"

簡単なことだ。

モバイルサイト版のコンテンツが少なければ、SERPで良い結果を出すことはできません。

検索エンジンがコンテンツを重視するのは、あなたのウェブサイトの内容を判断する唯一の方法だからです。ウェブサイトのデスクトップ版とモバイル版を同じに保つために、以下にいくつかの重要な推奨事項を挙げます:

  • UX、SEO、開発チームと協力して、ウェブサイトの重要な要素を削除するのではなく、モバイルフレンドリーな方法でコンテンツを表示しましょう。
  • 画像、動画、その他の大きなコンテンツファイルは、タブレット、スマートフォン、その他のスマートデバイスなど、さまざまなモバイルデバイスに基づいて正しく最適化されなければなりません。
  • すべての構造化データ、メタロボットタグ、および技術的なウェブサイトデータを、すべてのIoTデバイスで共通に保つ。

モバイルファーストインデックスとは、検索エンジンが主にあなたのウェブサイトのモバイル版をクロールすることを意味します。モバイルサイトがコンテンツに飢えているのであれば、デスクトップサイトがどれだけ最適化されていても意味がありません。

どちらも、あなたが求めているSEOのパフォーマンスを生み出すことはない。

モバイルユーザビリティとモバイルファーストインデックスの違いを学ぶ

モバイルファーストインデックスとモバイルユーザビリティは、しばしば同じ意味で使われます。実は、これらの用語は同じではありません。

モバイル・ユーザビリティは、モバイル・デバイス上でのウェブサイトのパフォーマンスを説明する。先に説明したように、モバイルファーストインデックスとは、Googleがデスクトップ版よりもモバイル版のウェブサイトを優先的にクロールすることです。

ここで注意点がある。

もしあなたのウェブサイトがモバイルフレンドリーでなく、モバイルユーザビリティに多くの問題を抱えていたとしても、Googleにインデックスされる可能性はありますし、されるでしょう。例えば、あなたがレストランを経営していて、メニューページの1つがPDFファイルだとします。

もちろん、PDFファイルはモバイル端末では読みにくく、ナビゲートしにくい。しかし、十分な量があれば、Googleはモバイルファーストインデックスでも情報をクロールすることができる。

最終的には、モバイルファーストインデックスに十分なコンテンツがあれば、スマートフォンのGooglebotがあなたのウェブサイトを自動的にクロールする。それでも、まずはウェブサイトのモバイルユーザビリティの問題を解決する必要がある。

ウェブサイトの高速化

ユーザーがウェブサイトに費やす平均時間は54秒

あなたのウェブサイトが読み込まれるのを一日中待っている人はいない。結局のところ、ほんの2、3秒でアクセスできる他のウェブサイトが何十億とあるのです。

したがって、ウェブサイトの速度を向上させることは、モバイルユーザーのためだけでなく、SEOの観点からも不可欠です。

ウェブサイトの読み込み時間が遅いと、滞在時間と直帰率の両方に影響します。これらの指標は、人々がどれくらいあなたのウェブサイトに滞在しているか、または何もせずに去っているかを推定するものです。

あなたのウェブサイトの速度が遅いためにこのようなことが発生した場合、Googleはそれに気づき、SERPであなたのウェブサイトを降格させます。このような事態を避けるためには、サイト監査を実施することで、ウェブサイトの速度をチェックし、監視することができます。

Ranktrackerを使って包括的なウェブ監査を実施し、モバイルデバイスにおけるサイトの速度を測定することができます。

遅延ロードコンテンツ用にウェブサイトを最適化する

レイジー・ローディング・コンテンツは、最近のウェブサイトでは当たり前になっている。ニュース出版物は、このタイプのコンテンツを使用して、サイトをスクロールダウンするにつれて、より多くのストーリーを継続的に入力します。

スポーツニュース出版社ClutchPointsは、ユーザーが特定のスポーツカテゴリーのニュース記事をもっと読みたい場合、「More Stories」ボタンをクリックできるようにしている:

Lazy Loading content (画像ソース)

レイジー・ローディング・コンテンツの原理は、ユーザーが要求したときだけコンテンツを表示することである。また、Googleがクロールするための不要なコード行を減らすことで、ウェブサイトの速度を向上させます。

また、モバイル・ユーザーにとって、ウェブサイトのページがコンテンツに偏らないようにすることは、UXの良いアクセントになります。しかし、問題は、遅延ロードコンテンツが検索エンジンにインデックスされにくいということです。

クラッチポイントの話に戻そう。

当然ながら、"More Stories "ボタンをクリックして表示されるストーリーがまだなければ、グーグルはそれをインデックスすることはできない。

あなたのウェブサイトがページ分割された読み込みを可能にすることで、この問題を解決することができます。これにより、Googleのような検索エンジンは、ClutchPointsのように無限スクロールを使用している場合でも、あなたのサイトのすべてのコンテンツを記録することができます。

不適切な広告配置に注意

グーグルアドセンスを使用している場合、ウェブサイトのモバイル版での広告の表示方法に注意することが重要です。

モバイルデバイスでは、デスクトップコンピューターで表示される一般的な広告ではなく、レスポンシブ・ディスプレイ広告(RDA)が表示されます。

例えば、典型的なデスクトップ広告を紹介しよう:

Watch out for improper ad placement (画像ソース)

そして、これがモバイルデバイスでの表示だ:

here's what they'd look like on a mobile device (画像ソース)

デスクトップのディスプレイ広告をモバイルで再利用することはできません。モバイルRDAを作成する際のベストプラクティスをご紹介します:

  • SEOチームと開発者に、CSSとHTMLタグを使用して、異なる表示サイズに基づいて広告を調整するように指示する。
  • 見出しと本文はわかりやすく簡潔に
  • 画像の上にテキストを追加しないようにする
  • 複数のサイズの広告画像を作成する

ウェブサイトがADAに準拠していることを確認する

米国では6100万人が障害を持ちながら生活しています。アクセシブルなウェブサイトを持つということは、耳の不自由なユーザー、色覚障害のあるユーザー、その他の目に見えない障害を持つユーザーに対応するということです。

より多くの人々があなたのウェブサイトとインタラクトできればできるほど、彼らが滞在し、コンバージョンに至る可能性は高まります。このコンセプトは、モバイルファーストインデックスにとって非常に重要です。

ウェブサイトをアクセシブルにすることは、障害者だけでなく、すべてのユーザーにメリットをもたらします。他のアクセシビリティ機能の中でも、使いやすく、コンテンツ構造が明確で、画像の代替テキストを提供するモバイルフレンドリーなウェブサイトによって、より良い顧客体験が提供されます。

ウェブサイトのアクセシビリティの追求は、倫理的なものであると同時に、賢明な商業的判断でもあります。アクセシビリティの確保には、法的な意味合いを認識することが不可欠です。例えば、米国障害者法(ADA)のような規制は、米国企業に影響を与え、その物理的な敷地を反映したウェブサイトが、すべての訪問者に包括的な体験を提供することを義務付けています。

accessiBeのような無料のウェブサイト・アクセシビリティ・チェッカーを使用すると、ウェブサイトの現在のアクセシビリティ・ステータスを正確に評価し、現行の規制に準拠しているかどうかを判断することができます。

website accessibility checker 画像ソース

Ranktrackerの紹介

効果的なSEOのためのオールインワン・プラットフォーム

ビジネスが成功する背景には、強力なSEOキャンペーンがあります。しかし、数え切れないほどの最適化ツールやテクニックがあるため、どこから手をつければいいのかわからないこともあります。でも、もう心配はありません。効果的なSEOのためのオールインワンプラットフォーム「Ranktracker」を紹介します。

Ranktrackerの登録がついに無料になりました。

無料アカウント作成

または認証情報を使ってサインインする

ウェブサイトをよりアクセシブルにする他の方法としては、以下のようなものがある:

  • ウェブサイトの色を統一すること。非常に明るく、読みにくいネオンカラーを使用しないように注意してください。
  • スクリーンリーダーを使用する障害者に対応するため、画像に代替テキストを追加します。
  • ユーザーが重要な情報を素早く簡単に見つけられるよう、明確なコンテンツ構造を採用。

これらのベストプラクティスをいくつか採用したら、米国障害者法(ADA)に従って、ウェブサイトのコンプライアンスをチェックしてください。あなたのページが合格点であれば、問題ありません。

Access Scan (画像ソース)

アクセシブルなウェブサイトを開発することで、すべての人が参加し、情報を得、コンバージョンする準備が整うことが保証される。

要点

全体として、モバイルファーストインデックスは、ウェブサイトがインターネット上でどのように見え、どのように機能すべきかについて、より高い基準を設定しました。検索エンジンは今、あなたのウェブサイトがモバイルユーザーにどのようにサービスを提供するかに最大の関心を寄せています。

このガイドに従うことで、モバイルフレンドリーなウェブサイトを管理し、より多くのモバイルユーザーに対応する方法がより明確になるはずだ。

Yoni Yampolsky

Yoni Yampolsky

Marketing Manager, Elementor

is a Marketing Manager for Elementor. With more than 10 million active users, Elementor empowers just about anyone to create stunning WordPress websites, code-free. Elementor now offers best-in-class, built-in cloud hosting features. You can build and host your WordPress site in one, single platform.

Link: Elementor

Ranktrackerを無料で使いましょう。

あなたのWebサイトのランキングを妨げている原因を突き止めます。

無料アカウント作成

または認証情報を使ってサインインする

Different views of Ranktracker app