PageSpeed Insightsでモバイルだけ遅い原因と改善方法

「PageSpeed Insightsで測定したら、モバイルだけスコアが30点台で真っ赤なんだけど、どうすればいいの？」

こんな悩みを抱えている方、実は非常に多いんです。PCでは80点以上なのに、モバイルだけ30点台というのはよくある話で、私自身も同じ問題に直面していました。

でも安心してください。この記事で紹介する改善方法を実践すれば、モバイルスコアを確実に向上させることができます。実際に、32点だったモバイルスコアを84点まで改善できた実証済みの方法をお伝えします。

ウェブサイトの表示速度は、もはやSEOにおいて無視できない重要な要素です。Googleは2021年からCore Web Vitalsをランキング要因として正式に採用し、特にモバイルファーストインデックスの時代において、モバイルでの表示速度は検索順位に直接影響します。

この記事では、PageSpeed Insightsでモバイルだけ遅くなる根本的な原因から、具体的な改善方法まで、実体験に基づいて詳しく解説していきます。

PageSpeed Insightsとは？なぜ重要なのか

PageSpeed Insightsは、Googleが提供する無料のWebサイト表示速度測定ツールです。URLを入力するだけで、モバイル版とPC版それぞれのスコアと具体的な改善点を表示してくれます。

スコアは100点満点で表示され、一般的には以下のような評価になります：

90-100点：高速（緑色）
50-89点：改善が必要（オレンジ色）
0-49点：低速（赤色）

Googleで上位表示を目指すなら、最低でも50点以上、できれば70点以上を維持したいところです。

表示速度がSEOに与える影響

Googleの調査によると、ページの表示速度が遅いと以下のような影響があります：

1秒から3秒になると直帰率が32%増加
1秒から5秒になると直帰率が90%増加
1秒から6秒になると直帰率が106%増加
1秒から10秒になると直帰率が123%増加

つまり、表示速度が遅いだけで、せっかく来てくれたユーザーの大半が離脱してしまうということです。これじゃあ、どんなに良いコンテンツを作っても意味がないですよね。

なぜモバイルだけスコアが低くなるのか？

多くの方が疑問に思うのが「PCは80点なのに、なぜモバイルだけ30点なの？」という点です。これには明確な理由があります。

PageSpeed Insightsの測定条件の違い

PageSpeed Insightsは、モバイルとデスクトップで異なる測定条件を設定しています：

モバイルの測定条件

CPU スロットリング: 4x slowdown（4倍遅い処理速度）
ネットワーク: 150ms TCP RTT, 1,638.4 kb/秒（4G相当）

デスクトップの測定条件

CPU スロットリング: 1x slowdown（通常速度）
ネットワーク: 40ms TCP RTT, 10,240 kb/秒（光回線相当）

つまり、モバイル測定では意図的にCPU処理能力を4分の1に下げ、通信速度も約6分の1に制限して測定しているんです。これは、実際のモバイル環境を想定した測定条件なので、スコアが低くなるのは当然なんですね。

初期の輻輳ウィンドウの影響

さらに複雑な話になりますが、「初期の輻輳ウィンドウ」という概念も影響しています。これは、ネットワーク通信において、最初のデータ送信で一度に送れるデータ量が制限されているという話です。

具体的には、各ファイルは14.6KB以内でないと、追加のラウンドトリップが必要になり、モバイルのような遅延の多いネットワークではページ読み込みが大幅に遅延する可能性があります。

これを聞いた時、「14.6KB？そんな小さなファイルサイズで何ができるんだ！」って思いましたよね。私も同じでした(笑)

モバイルスコアが低くなる具体的な原因

PageSpeed Insightsでモバイルだけスコアが低くなる主な原因は以下の通りです：

1. 画像のファイル容量が大きい

これが最も多い原因です。特に以下のような画像が問題になりがちです：

アイキャッチ画像（2000px以上の高解像度画像をそのまま使用）
ヘッダー画像やメインビジュアル
記事内の装飾画像
未圧縮のPNG画像

2. 不要なソースコードが多い

使っていないCSSやJavaScriptが残っている
プラグインが自動生成する重複コード
最適化されていないHTML構造

3. 外部リソースの読み込みが多い

Google Analytics、Google Tag Manager
SNSのフォローボタンやタイムライン
ブログランキングのバナー
外部フォントの読み込み
YouTube埋め込み動画

4. サーバーの応答時間が長い

安価な共有サーバーを使用している
データベースが最適化されていない
キャッシュ機能を使っていない

5. Webフォントの読み込みが最適化されていない

Googleフォントを複数種類読み込んでいる
日本語フォントのサブセット化ができていない
フォントの遅延読み込み設定がない

6. Google アドセンスの自動広告

これは意外と知られていないのですが、Google アドセンスの自動広告は表示速度に大きな影響を与えます。皮肉なことに、Googleが「表示速度を上げろ」と言いながら、自社の広告サービスが重いという状況です。

【実証済み】モバイルスコアを劇的に改善する方法

ここからは、実際に32点から84点に改善できた具体的な方法をお伝えします。簡単にできるものから順番に紹介していくので、まずは手軽なものから試してみてください。

改善方法1: 画像の最適化（効果大★★★）

これが最も効果の高い改善方法です。画像の最適化だけで20〜30点スコアが上がることも珍しくありません。

すぐにできる画像最適化

1. アイキャッチ画像のサイズを適正化

フリー素材をそのまま使っていませんか？多くのフリー素材は2000px以上の高解像度です。これをそのまま使うと、容量が大きすぎてモバイルでの読み込みに時間がかかります。

推奨サイズ：

アイキャッチ画像：横幅800〜1200px
記事内画像：横幅600〜800px
サムネイル：横幅300〜400px

2. TinyPNGで画像を圧縮

TinyPNGは、画像の見た目を変えずにファイルサイズを40〜60%削減できる神ツールです。使い方も簡単で、サイトに画像をドラッグ＆ドロップするだけ。

実際に使ってみると、300KBの画像が120KBになったりします。この差は大きいですよ！

3. 次世代画像フォーマット（WebP）の採用

WebPは、Googleが開発した画像フォーマットで、JPEGより25〜34%、PNGより26%も軽量化できます。最近のブラウザはほぼ対応しているので、積極的に使いたいところです。

WordPressユーザー向け画像最適化プラグイン

EWWW Image Optimizer（無料）

このプラグインは本当に優秀です：

アップロード時に自動で画像を圧縮
既存画像の一括最適化
WebP形式への自動変換
遅延読み込み機能

設定も簡単で、インストール後に「一括最適化」を実行するだけで、サイト内の全画像が最適化されます。

改善方法2: 不要な外部リソースの削除（効果大★★★）

外部リソースの読み込みは、自分でコントロールできない部分なので、できるだけ減らすのが鉄則です。

見直すべき外部リソース

1. SNS関連

Twitterタイムライン埋め込み → 削除または画像に変更
Facebookページプラグイン → シンプルなリンクに変更
SNSフォローボタン → 本当に必要なものだけ残す

2. ブログパーツ

ブログランキングバナー → 検索流入が増えたら削除検討
アクセスカウンター → Google Analyticsで十分
天気予報ウィジェット → ユーザーには不要

3. 解析ツール

Google Analytics → 必要だが、gtag.jsを使って軽量化
複数の解析ツール → Google Analytics一本に統一
ヒートマップツール → 常時動作させず、必要時のみ

PageSpeed Insightsでの確認方法

診断結果の「第三者コードの影響を抑えてください」という項目を見ると、どの外部リソースが重いかが分かります。ここで上位に表示されているものから優先的に対処しましょう。

改善方法3: WordPressプラグインの最適化（効果中★★）

WordPressを使っている方の多くが、プラグインを入れすぎています。「便利だから」と入れているプラグインが、実はサイトを重くしている犯人かもしれません。

重いプラグインの代表例

All in One SEO Pack → テーマにSEO機能があるなら不要
Jetpack → 機能を絞って使うか、個別プラグインに分散
WordPress Popular Posts → データベースに負荷をかける
Contact Form 7 → 軽量な代替プラグインを検討

プラグインの負荷チェック方法

「P3 – Plugin Performance Profiler」というプラグインを使うと、各プラグインの負荷がグラフで確認できます。これを使って重いプラグインを特定し、代替案を検討しましょう。

改善方法4: サーバー環境の見直し（効果大★★★）

どんなに最適化しても、サーバーが遅ければ意味がありません。特に格安の共有サーバーを使っている場合は、サーバー変更を検討した方がいいかもしれません。

サーバー選びのポイント

1. 応答速度（TTFB）

200ms以下が理想
500ms以上は要改善

2. 同時接続数

アクセス集中時にも安定している
503エラーが頻発しない

3. SSD搭載

HDDよりもSSDの方が高速
データベース処理が速い

改善方法5: フォントの最適化（効果中★★）

意外と見落としがちなのがフォントの最適化です。特に日本語Webフォントは容量が大きく、表示速度に大きな影響を与えます。

Googleフォントの最適化

1. 必要最小限のスタイルのみ読み込む

Googleフォントを使う時、ついつい「Regular、Bold、Light」など複数のスタイルを読み込んでしまいがちです。でも、実際に使うのはRegularだけということも多いですよね。

2. font-displayの指定

CSSに以下の記述を追加すると、フォント読み込み中もテキストが表示されるようになります：

@font-face {
  font-family: 'Noto Sans JP';
  font-display: swap;
}

3. プリロードの活用

HTMLのheadタグ内に以下を記述すると、フォントの読み込みを早めることができます：

<link rel="preload" href="font-file.woff2" as="font" type="font/woff2" crossorigin>

日本語フォントの扱い

日本語フォントは文字数が多いため、どうしても容量が大きくなります。可能であれば：

システムフォント（游ゴシック、ヒラギノなど）を使用
サブセット化したフォントを使用
フォント読み込みの遅延化

改善方法6: Google アドセンス自動広告の見直し（効果大★★★）

Google アドセンスを使っている方で、自動広告を設定している場合は要注意です。自動広告は便利ですが、表示速度に大きな影響を与えます。

自動広告の問題点

広告読み込みのタイミングをコントロールできない
不要な場所にも広告が表示される
ページ読み込み時にレイアウトが変わる（CLS悪化）

改善方法

1. 手動広告への切り替え

自動広告をオフにして、必要な場所にのみ手動で広告を配置します。これにより、広告の表示タイミングをコントロールできます。

2. 遅延読み込みの実装

JavaScriptを使って、ユーザーがスクロールした時に広告を読み込むように設定できます。

3. 広告サイズの最適化

レスポンシブ広告を使って、デバイスに合わせて最適なサイズの広告を表示します。

【上級者向け】さらなる高速化テクニック

基本的な最適化が完了したら、さらに高度なテクニックに挑戦してみましょう。

CDN（コンテンツデリバリーネットワーク）の活用

CDNを使うと、ユーザーに最も近いサーバーから画像やCSSファイルを配信できるため、読み込み速度が向上します。

おすすめCDNサービス

Cloudflare → 無料プランでも高機能
Amazon CloudFront → AWS利用者におすすめ
KeyCDN → シンプルで使いやすい

AMPの導入

AMP（Accelerated Mobile Pages）は、Googleが開発したモバイル向け高速化技術です。AMPページは通常のページより格段に速く表示されます。

ただし、AMPには制限もあるため、サイトの性質を考慮して導入を検討しましょう。

HTTP/2の活用

HTTP/2は従来のHTTP/1.1より高速な通信プロトコルです。多くのモダンサーバーで対応しているので、設定を確認してみましょう。

データベースの最適化

WordPressを長期間使っていると、データベースに不要なデータが蓄積されます。定期的にクリーンアップすることで、動作を軽快に保てます。

WP-Optimizeプラグインを使うと、簡単にデータベースの最適化ができます。

改善効果の測定方法

改善施策を実施した後は、必ず効果を測定しましょう。

PageSpeed Insightsでの測定

注意点

時間帯によってスコアが変動する
サーバーの混雑状況に影響される
複数回測定して平均値を見る

測定のコツ

同じ時間帯に測定する
5回測定して最高値と最低値を除いた平均を取る
異なるページでも測定する

その他の測定ツール

GTmetrix

詳細な分析結果が得られる
ウォーターフォールチャートで読み込み状況を確認
履歴管理ができる

WebPageTest

様々な地域・ブラウザでのテストが可能
詳細なパフォーマンス分析
フィルムストリップ表示で視覚的に確認

Google Analytics / Search Consoleでの確認

確認すべき指標

直帰率の変化
平均セッション時間
ページビュー数
Core Web Vitalsの数値

よくある質問と回答

Q: 改善してもスコアがすぐに上がらないのはなぜ？

A: PageSpeed Insightsは過去28日間のデータを基に評価しているため、改善効果が反映されるまで時間がかかります。また、「実際のユーザーの環境で評価する」部分は、実際のユーザーのアクセスデータが必要なので、アクセス数が少ないサイトでは数値が表示されないことがあります。

Q: モバイルとデスクトップ、どちらを優先すべき？

A: Googleがモバイルファーストインデックスを採用しているため、モバイルを優先すべきです。現在のユーザーの多くもモバイルからアクセスしているため、モバイル体験の改善がビジネス成果に直結します。

Q: スコア50点と90点で、実際にどれくらい差があるの？

A: スコアの差は体感速度にも大きく影響します。50点のサイトは「ちょっと重いな」と感じるレベルですが、90点のサイトは「サクサク動く」と感じられます。この差がユーザーの満足度、延いては離脱率やCV率に影響します。

Q: 画像を軽くしすぎて画質が悪くなることはない？

A: 適切な圧縮であれば、見た目の劣化はほとんど感じられません。TinyPNGなどのツールは「可逆圧縮」と「非可逆圧縮」を適切に使い分けて、視覚的な品質を保ちながらファイルサイズを削減します。心配な場合は、圧縮前後の画像を比較して確認してみてください。

Q: キャッシュプラグインを入れたら、サイトが表示されなくなった

A: キャッシュプラグインと他のプラグインが競合している可能性があります。まずはキャッシュプラグインを一時停止して、サイトが正常に表示されることを確認してください。その後、他のプラグインを一つずつ停止して、競合の原因を特定しましょう。よくある原因は、複数のキャッシュ系プラグインを同時に使用していることです。

Q: 有料テーマに変えれば必ずスコアは上がる？

A: 有料テーマは一般的に最適化されていることが多いですが、必ずしもスコアが上がるとは限りません。重要なのは、テーマの構造やコードの品質です。無料テーマでも適切に最適化すれば高スコアは達成できますし、有料テーマでも設定や使い方次第では重くなることもあります。

改善作業で注意すべきポイント

バックアップは必須

最適化作業を始める前に、必ずサイトの完全バックアップを取りましょう。特に以下の場合は慎重に：

プラグインの大幅な変更
テーマファイルの直接編集
データベースの最適化
.htaccessファイルの編集

「BackWPup」や「UpdraftPlus」などのバックアププラグインを使って、定期的にバックアップを取る習慣をつけましょう。

段階的な改善を心がける

一度にすべての改善を行うと、どの施策が効果的だったか分からなくなります。また、サイトに不具合が発生した時の原因特定も困難になります。

推奨する改善順序

画像の最適化（効果が大きく、リスクが低い）
不要プラグインの削除（効果確認しやすい）
キャッシュプラグインの導入（劇的な改善が期待できる）
外部リソースの見直し（細かい調整）
コードの最適化（上級者向け）

テスト環境での検証

本番サイトでいきなり作業するのはリスクが高いです。可能であれば：

ステージング環境を用意する
ローカル環境で検証する
サブドメインでテストサイトを作る

特に、コードの最適化やプラグインの大幅な変更を行う場合は、テスト環境での検証が重要です。

業界別・サイト種別の最適化ポイント

サイトの種類によって、重点的に対策すべきポイントが異なります。

コーポレートサイト

特徴

画像が多い（会社案内、事例紹介など）
動画コンテンツが含まれることが多い
問い合わせフォームが重要

重点対策

画像の最適化（特にトップページのメインビジュアル）
動画の遅延読み込み
問い合わせフォームの軽量化

ECサイト

特徴

商品画像が大量
決済システムとの連携
在庫管理システムとの連携

重点対策

商品画像の遅延読み込み
CDNの活用（画像配信の高速化）
不要なJavaScriptライブラリの削除

ブログ・メディアサイト

特徴

記事数が多い
アイキャッチ画像が重要
広告との兼ね合い

重点対策

アイキャッチ画像の統一・最適化
広告の遅延読み込み
関連記事表示の最適化

ランディングページ

特徴

1ページ完結型
コンバージョンが最重要
画像・動画を多用

重点対策

ファーストビューの最適化
重要でない要素の遅延読み込み
フォーム周りの軽量化

LandingHub（https://www.landinghub.net/）では、こうしたランディングページ特有の最適化ノウハウを活用して、高速で効果的なランディングページを提供しています。表示速度とコンバージョン率の両方を重視したページ設計が、多くの企業様に支持されています。

まとめ：継続的な改善が成功の鍵

PageSpeed Insightsでモバイルスコアを改善することは、決して一度やって終わりではありません。継続的な監視と改善が重要です。

定期的なチェックポイント

月次チェック

PageSpeed Insightsでのスコア測定
Core Web Vitalsの数値確認
新たな改善点の洗い出し

四半期チェック

プラグインの見直し
画像の整理・最適化
不要なコンテンツの削除

年次チェック

サーバー環境の見直し
テーマの更新・変更検討
新技術の導入検討

改善効果の測定指標

表示速度の改善効果は、スコアだけでなく以下の指標でも測定しましょう：

直帰率：改善すれば直帰率は下がる
平均セッション時間：ページが快適になれば滞在時間が伸びる
コンバージョン率：最終的なビジネス成果への影響
検索순위：SEO効果の確認

最終的に目指すべき数値

理想的な目標値は以下の通りです：

モバイルスコア：70点以上（最低でも50点以上）
デスクトップスコア：85点以上
LCP：2.5秒以下
INP：200ms以下
CLS：0.1以下

これらの数値を達成できれば、ユーザー体験の向上とSEO効果の両方を実現できます。

プロフェッショナルなサポートの活用

もし自分での改善に限界を感じたら、専門家のサポートを受けることも検討してみてください。

LandingHub（https://www.landinghub.net/）では、表示速度最適化を含む包括的なWebサイト改善サービスを提供しています。単なる速度改善だけでなく、ビジネス成果に直結する最適化を行うことで、多くの企業様のWeb成果向上をサポートしています。

「時は金なり」という言葉があるように、ユーザーの時間を無駄にしないことは、現代のWebサイト運営において最も重要な要素の一つです。今回紹介した方法を参考に、ぜひあなたのサイトも高速化にチャレンジしてみてください。

最初は大変に感じるかもしれませんが、一つずつ着実に改善していけば、必ず結果はついてきます。ユーザーに愛される快適なサイトを目指して、継続的な改善を続けていきましょう！

さらなる情報収集のために

表示速度最適化は技術の進歩とともに常に変化しています。最新の情報をキャッチアップするために、以下のリソースを活用することをおすすめします：

Google Developers：公式の最新情報とベストプラクティス
web.dev：Googleが提供するWeb開発者向けリソース
PageSpeed Insights API：自動化された継続的な監視
Chrome DevTools：詳細なパフォーマンス分析

この記事が、あなたのWebサイトのモバイルスコア改善に少しでもお役に立てれば幸いです。高速で快適なWebサイトで、より多くのユーザーに価値を提供していきましょう！

PageSpeed Insightsとは？なぜ重要なのか

表示速度がSEOに与える影響

なぜモバイルだけスコアが低くなるのか？

PageSpeed Insightsの測定条件の違い

モバイルの測定条件

デスクトップの測定条件

初期の輻輳ウィンドウの影響

モバイルスコアが低くなる具体的な原因

1. 画像のファイル容量が大きい

2. 不要なソースコードが多い

3. 外部リソースの読み込みが多い

4. サーバーの応答時間が長い

5. Webフォントの読み込みが最適化されていない

6. Google アドセンスの自動広告

【実証済み】モバイルスコアを劇的に改善する方法

改善方法1: 画像の最適化（効果大★★★）

すぐにできる画像最適化

WordPressユーザー向け画像最適化プラグイン

改善方法2: 不要な外部リソースの削除（効果大★★★）

見直すべき外部リソース

PageSpeed Insightsでの確認方法

改善方法3: WordPressプラグインの最適化（効果中★★）

重いプラグインの代表例

プラグインの負荷チェック方法

おすすめの軽量プラグイン

改善方法4: サーバー環境の見直し（効果大★★★）

サーバー選びのポイント

おすすめレンタルサーバー

改善方法5: フォントの最適化（効果中★★）

Googleフォントの最適化

日本語フォントの扱い

改善方法6: Google アドセンス自動広告の見直し（効果大★★★）

自動広告の問題点

改善方法

【上級者向け】さらなる高速化テクニック

CDN（コンテンツデリバリーネットワーク）の活用

AMPの導入

HTTP/2の活用

データベースの最適化

改善効果の測定方法

PageSpeed Insightsでの測定

その他の測定ツール

Google Analytics / Search Consoleでの確認

よくある質問と回答

Q: 改善してもスコアがすぐに上がらないのはなぜ？

Q: モバイルとデスクトップ、どちらを優先すべき？

Q: スコア50点と90点で、実際にどれくらい差があるの？

Q: 画像を軽くしすぎて画質が悪くなることはない？

Q: キャッシュプラグインを入れたら、サイトが表示されなくなった

Q: 有料テーマに変えれば必ずスコアは上がる？

改善作業で注意すべきポイント

バックアップは必須

段階的な改善を心がける

テスト環境での検証

業界別・サイト種別の最適化ポイント

コーポレートサイト

ECサイト

ブログ・メディアサイト

ランディングページ

まとめ：継続的な改善が成功の鍵

定期的なチェックポイント

改善効果の測定指標

最終的に目指すべき数値

プロフェッショナルなサポートの活用

さらなる情報収集のために

ブラウザキャッシュで表示速度改善させる具体策

表示速度改善には画像最適化が必須！実践的手法を紹介！

表示速度改善で売上アップ！ECサイト・LP最適化の極意と実践テクニック

コメントを残す