PageSpeed Insights モバイルだけが遅い原因とは？原因と改善方法を解説

2024年2月8日 カテゴリ - サイトスピード

Web サイトのページの表示速度は Web マーケティングにおいて重要な指標です。
PageSpeed Insights でページの表示速度を調べたときに、モバイルだけが遅いと感じている方もいるのではないでしょうか。

この記事では、PageSpeed Insights のモバイルだけが遅い原因と改善方法まで解説します。

PageSpeed Insights とは

PageSpeed Insights とは、Google が提供している Web サイトのページの表示速度を無料で測定できるツールです。
このツールを使うことで、モバイル版のページ、PC 版のページのそれぞれのスコアと具体的な改善点が表示されます。
スコアは100点満点で表示されますが、Google で上位表示を目指すには少なくとも50〜89点の範囲のスコアを取る必要があります。

ページの表示速度が重要な理由

ページの表示速度は非常に重要です。
ページの表示速度が遅いとユーザーがページを見るまでに待つ時間が長くなり、ユーザビリティが悪化します。

Google は2017年にページの表示速度が遅い場合の損失について、以下のような調査結果を公表しています。

ページの表示速度が
・1秒から3秒になると直帰率が32%増加
・1秒から5秒になると直帰率が90%増加
・1秒から6秒になると直帰率が106%増加
・1秒から10秒になると直帰率が123%増加

Find Out How You Stack Up to New Industry Benchmarks for Mobile Page Speed
https://www.thinkwithgoogle.com/intl/en-ca/marketing-strategies/app-and-mobile/mobile-page-speed-new-industry-benchmarks/

ページの表示速度が遅いと直帰率やコンバージョン率、検索順位といった Web マーケティングにおいて重要な指標に影響します。
そのため、ページの表示速度が重要です。

PageSpeed Insights でモバイルだけが遅い原因

モバイルだけが遅くなる原因は多岐にわたりますが、大きな要因としては「PageSpeed Insights のスコアは海外から計測されるため、4G通信を前提としているモバイルのスコアは低くなりやすい」ということがあげられます。
また、モバイルは PC よりもリソースに限りがあり、大量のデータや複雑なソースコードの処理に時間がかかります。

具体的な要因としては以下のようなものがあります。

・画像のファイル容量が大きい
・無駄なソースコードがある
・ネットワークリクエスト数や転送データの量が多い
・サーバーの応答時間が長い
・Web フォントの読み込みが最適化されていない
・Google アドセンスの自動広告を利用している

これらの改善施策については次の章で解説します。

PageSpeed Insights でモバイルだけが遅い場合の対策

この章では PageSpeed Insights でモバイルだけが遅い場合の具体的な対策について解説します。

画像を軽量化する

画像は Web サイトのソースコードと比べてファイル容量が大きい傾向にあります。
そのため、画像の軽量化はサイトの表示速度の改善に大きく貢献します。

画像の軽量化には、以下の2つの方法があります。

・画像の圧縮
・次世代画像フォーマットでの配信

画像の圧縮

画像の圧縮とは、画像の不要な部分を取り除くことで画像のファイル容量を縮小する手法です。
画像の不要な部分と言っても、人間には知覚できない部分なので圧縮しても見た目で違いは分かりません。

画像の圧縮には可逆圧縮方式と非可逆圧縮方式の2種類があります。

可逆圧縮方式とは、画像データを圧縮した後、完全に元に戻すことができる圧縮方式です。
PNG 画像や GIF 画像は可逆圧縮の画像形式です。
圧縮率は非可逆圧縮方式と比べて低くなっています。

非可逆圧縮方式とは、画像データを圧縮した後、元に戻すことができない圧縮方式です。
JPG 画像や JPEG 画像は非可逆圧縮方式です。
圧縮率は可逆圧縮方式と比べて高くなっています。

次世代画像フォーマットでの配信

WebP や AVIF といった次世代画像フォーマットを使用することで、JPEG や PNG よりもさらにファイルサイズを削減しつつ、高品質な画像を提供できます。

WebP は Google が表示速度高速化を目的として開発した新しい画像フォーマットです。
開発した Google によれば、JPG より25〜34%、PNG より26%も軽量化できると言われています。

WebP について詳しく知りたい方は以下をご覧ください。
【参考】次世代の画像フォーマット WebP とは？メリットや変換方法を解説
https://fastest.jp/blog/webp/

AVIF は WebP よりもさらに圧縮率の高い画像フォーマットです。
さらに可逆圧縮と非可逆圧縮を選ぶことができ、アニメーション GIF にも対応しています。
しかし、現状として開くことのできるブラウザやソフトには限りがあります。

AVIF について詳しく知りたい方は以下をご覧ください。
【参考】WebP よりも軽量化できる AVIF とは？フォーマットの特徴や AVIF に変換できるツールを解説
https://fastest.jp/blog/avif/

ソースコードを最適化する

HTML、CSS、JavaScript ファイルの最適化を行い、不要なコードを削除してファイルサイズを減らします。
ソースコードの知識がなく、調整が難しい場合は専用のツールを使うことで簡単に最適化できます。
また、 WordPress を利用している方はプラグインを利用することで JavaScript を圧縮することができます。

ただし、ソースコードを最適化した結果正しく動作しなくなる可能性があるので、圧縮する場合は不具合が生じていないか確認してください。

ネットワークリクエスト数と転送データの量を減らす

ネットワークリクエストとは、ブラウザが Web サイトを表示するために必要な情報をサーバーから取得するために送信を要求することです。
ソースコードや外部との連携ツールへのリクエスト数を減らすことで、サーバーの負荷を軽減し、ページの読み込み速度を向上させることができます。

外部との連携ツールを減らす、もしくは必要なリソースのみを読み込むようにソースコードを調整する必要があります。

サーバーの応答時間の改善

サーバーからの応答時間が長いと、画面に表示させるまでの時間も長くなります。
サーバーの応答時間を改善することで、ページの読み込みを改善することができます。

例えば、以下を行うことでサーバーの応答時間を改善できます。

サーバーの最適化

応答速度が速いサーバーに乗り換える、あるいはサーバーに負荷がかかっているタスク（大量のデータ処理や非効率なコードの実行など）を効率化させることでサーバーの応答時間を改善できます。

キャッシュの活用

キャッシュとは、使用頻度の高いデータや直近に読み込んだデータを一時的に保存する機能です。
ブラウザキャッシュを有効にすることで、ページの再読み込み時にサーバーからのデータの転送を減らすことができます。

ユーザーから地理的に近いコンテンツデリバリーネットワーク（CDN）を活用する

CDN とは、様々な場所に分散して設置されたサーバーのネットワークです。
サーバーとユーザーが地理的に遠いと、データの送受信に時間がかかります。
ユーザーに近い CDN を活用することでサーバーの応答時間を改善できます。

Web フォントの読み込みを最適化する

Web フォントの読み込みはページの表示速度に影響を与えるため、必要最小限のフォントスタイルのみを選択し、フォントの読み込みを最適化します。
Web フォントの読み込みを最適化するには、font-display を CSS に記述したり Font Loading API を利用します。
この２つは Web フォントが読み込まれるまでの挙動を制御したり、読み込まれるまでの時間の短縮に役立ちます。

Google アドセンスの自動広告を手動に切り替える

Google アドセンスとは、Google が提供する広告配信サービスです。
運営しているブログにタグを貼ることで、ユーザーにマッチした広告が配信されます。

しかし、自動広告は掲載される広告をコントロールできないため、ページの表示速度やユーザビリティに影響を与える可能性があります。
広告の配置を手動で制御することで、サイトのパフォーマンスを改善できます。

まとめ

本記事では、PageSpeed Insights のモバイルだけが遅い原因と改善方法まで解説しました。

モバイルユーザーが増加したことにより、Google は Web サイトのモバイル対応化やモバイルの表示速度の改善を重要視するようになりました。
そのため、PageSpeed Insights のモバイルのスコアの改善が必要です。

記事で紹介した改善施策を実施することで、モバイルのスコアを改善し、検索順位の向上やコンバージョン率の改善に繋げましょう。

なお、当社ではページの表示速度の改善を1クリックで行えるランディングページ高速化ツール FasTest（ファーステスト） を開発・販売しています。
無料トライアルも実施しておりますので、ご興味のある方はぜひお気軽にお問い合わせください。