WordPressサイトの表示が遅いと感じても、最初からプラグインを追加したり、サーバーを変更したりする必要はありません。
表示速度には、画像の容量、キャッシュ、プラグイン、テーマ、サーバーなど複数の要因が関係します。原因を確認せずに対策を重ねると、効果が分からないまま構成だけが複雑になることもあります。
この記事では、WordPressの表示速度を改善するときに確認したい項目を、取り組みやすい順番で整理します。
まずPageSpeed Insightsで現在の状態を測る
改善作業の前に、対象ページの現在の状態を記録します。GoogleのPageSpeed InsightsへURLを入力すると、モバイルとデスクトップの結果を確認できます。
主に確認したい指標は、Core Web Vitalsの次の3つです。
- LCP:主要なコンテンツが表示されるまでの速さ
- INP:クリックやタップに対する反応の速さ
- CLS:読み込み中にレイアウトがどの程度ずれるか
Googleの解説では、良好とされる目安はLCPが2.5秒以内、INPが200ミリ秒以内、CLSが0.1以下です。ただし、点数だけを100に近づけることが目的ではありません。実際の利用者が問題なく閲覧・操作できる状態を目指します。
PageSpeed Insightsには、実際のChromeユーザーから集計したフィールドデータと、検証環境で測定したラボデータが表示される場合があります。両者は測定条件が異なるため、一回の点数だけで判断せず、同じURLを同じ条件で測って変更前後を比較します。
測定結果から、最初に確認する項目を選ぶ
7つの対策をすべて試す必要はなく、測定結果や実際の症状を手がかりに、関係する項目から確認しましょう。
| 測定結果・症状 | 最初に確認すること | 本文の参照先 |
|---|---|---|
| 大きな画像の表示が遅く、LCPが悪い | その画像の容量と、読み込みが始まるタイミングを確認する。画像だけが原因とは限らない | 「1. 大きすぎる画像を見直す」「4. テーマと外部スクリプトを確認する」 |
| 最初の応答までの時間(TTFB)が長い | ページキャッシュの利用状況と、サーバーの処理・通信に時間がかかっていないかを確認する | 「2. キャッシュが利用できるか確認する」「6. サーバーの応答時間を確認する」 |
| クリックやタップへの反応が遅く、INPが悪い | どの操作で遅くなるかを確かめ、関連するプラグインやJavaScriptの処理を調べる | 「3. 不要なプラグインを整理する」「4. テーマと外部スクリプトを確認する」 |
| 読み込み中に画像や文章が動き、CLSが悪い | 画像の表示領域が確保されているか、広告や埋め込みなどが後から挿入されていないかを確認する | 「1. 大きすぎる画像を見直す」「4. テーマと外部スクリプトを確認する」 |
この表は原因を確定するものではなく、あくまでも調べるための目安です。関連する指摘や実際の動作を確認してから、一項目ずつ変更してください。
1. 大きすぎる画像を見直す
WordPressサイトでは、画像が表示速度を下げる原因になりやすいです。スマートフォンで表示する画像に、数千ピクセル幅の写真をそのまま使っていないか確認します。
次の点から見直すと整理しやすくなります。
- 表示サイズに対して画像の縦横寸法が大きすぎないか
- JPEGやPNGを、WebPやAVIFなどの形式へ変換できないか
- 画質を保てる範囲で圧縮されているか
- ファーストビューより下の画像に遅延読み込みが使われているか
widthとheightが出力され、読み込み前に表示領域が確保されているか
画像の寸法指定は、読み込み時のレイアウトずれを抑えるためにも重要です。WordPressのメディア機能を使うと複数サイズの画像やレスポンシブ画像が生成されますが、テーマや独自実装によって適切に出力されているかは別途確認が必要です。
2. キャッシュが利用できるか確認する
WordPressは、アクセスのたびにPHPやデータベースを使ってページを生成します。ページキャッシュを利用すると、生成済みのページを配信できるため、サーバーの処理を減らせます。
ただし、最初からキャッシュプラグインを追加するのではなく、契約中のサーバーにキャッシュ機能があるか確認してください。サーバー側のキャッシュとプラグインの機能が重複すると、更新内容が反映されない、フォームやカートが正常に動かないといった問題が起こる場合があります。
導入・変更するときは、バックアップを取り、キャッシュ削除の方法と元に戻す手順を確認してから進めます。
3. 不要なプラグインを整理する
プラグインは、インストール数だけで速さが決まるわけではありません。読み込むCSSやJavaScript、データベース処理、外部サービスとの通信など、プラグインごとの処理内容が影響します。
まず、現在使っていないプラグインを確認します。そのうえで、重い処理が疑われるものを一つずつ停止し、同じ条件で再測定します。
本番サイトで突然停止すると機能が使えなくなる可能性があるため、問い合わせフォーム、セキュリティ、バックアップ、EC関連のプラグインは特に慎重に扱います。可能であれば、ステージング環境で確認してから本番へ反映します。
4. テーマと外部スクリプトを確認する
テーマが読み込む大きなCSSやJavaScript、スライダー、アニメーション、Webフォントなども表示に影響します。アクセス解析、広告、チャット、SNS埋め込みなど、外部サービスのスクリプトが原因になる場合もあります。
PageSpeed Insightsで「レンダリングを妨げるリソース」や「JavaScriptの実行時間」に関する指摘が出たら、どのファイルが関係しているかを確認します。
ファイルを一括で結合・遅延させる設定は、見た目や操作を壊すことがあります。複数の最適化機能を一度に有効にせず、一項目ずつ変更して表示と操作を確認することが大切です。
5. WordPress・PHP・テーマを更新する
古いWordPress本体、PHP、テーマ、プラグインを使い続けると、性能だけでなくセキュリティや互換性の問題にもつながります。
更新前にはバックアップを取得し、利用中のテーマやプラグインが更新後の環境に対応しているか確認します。PHPのバージョン変更は影響が大きいため、サーバーの推奨バージョンへ機械的に切り替えず、ステージング環境で動作確認を行います。
6. サーバーの応答時間を確認する
画像やJavaScriptを軽くしても、HTMLが返り始めるまでの時間が長いと、ページ全体の表示も遅れます。LCPには、サーバーから最初のデータを受け取るまでの時間であるTTFBも関係します。
次のような場合は、サーバー側の確認が必要です。
- キャッシュを設定しても応答が遅い
- 管理画面も重い
- アクセスが増える時間帯だけ遅くなる
- CPU、メモリ、プロセス数などの上限に達している
- データベースの自動読み込みデータが肥大化している
現在のプランのリソース状況やキャッシュ機能を確認し、必要に応じてホスティング会社へ相談します。サーバー移転や上位プランへの変更は、画像やプラグインなど比較的安全な項目を確認した後に検討すると、不要な変更を避けやすくなります。
7. CDNや静的配信を検討する
CDNは画像、CSS、JavaScriptなどを複数の配信拠点から届ける仕組みです。閲覧者とサーバーの物理的な距離による遅延を抑えたり、元のサーバーの負荷を減らしたりできます。
さらに、WordPressで生成したページを静的なHTMLとして事前に用意し、エッジ環境から配信するサービスもあります。この方式はPHPやデータベースへのアクセスを減らせますが、フォーム、会員機能、検索、カートなど動的な機能には個別の対応が必要です。
Nimbicaは、WordPressの編集環境を維持しながら、生成したページを静的なエッジ環境から配信すると説明している海外サービスです。公式情報では、画像最適化、CDN、CSS・JavaScriptの最適化なども案内されています。
ただし、当サイトでは現時点で実際のサイトへの導入検証を行っていません。公式サイトに記載された性能値が、すべてのWordPressサイトで再現されることを保証するものではありません。検討する場合は、無料トライアルの条件、DNS変更、フォームなどの動的機能、解約時の戻し方を確認し、ステージング環境で比較するのが安全です。
改善作業は一項目ずつ進める
WordPressの表示速度改善では、複数の対策を同時に行うと、どの変更に効果があったのか、どの変更が不具合を起こしたのか分かりにくくなります。
次の流れで進めると判断しやすくなります。
- PageSpeed Insightsで測定して結果を保存する
- バックアップを取る
- 一項目だけ変更する
- キャッシュを削除する
- 同じURLを再測定する
- PCとスマートフォンで表示・操作を確認する
- 問題があれば元へ戻す
最初は画像、不要なプラグイン、サーバーのキャッシュ機能から確認すると取り組みやすいでしょう。CDNや静的配信は有効な選択肢ですが、サイトの機能と運用方法に合うかを確認してから導入することが大切です。