「WordPressのサイトが重い」「ページの表示に時間がかかる」「スマートフォンで見ると遅い」
WordPressでWebサイトを運営していると、このような悩みを感じることがあります。
Webサイトの表示速度は、ユーザーの使いやすさだけでなく、検索エンジンからの評価やお問い合わせなどのコンバージョンにも関係する重要なポイントです。
しかし、WordPressの表示速度が遅くなる原因はひとつではありません。
画像が大きすぎる、プラグインを入れすぎている、JavaScriptやCSSが多い、サーバーの性能が不足しているなど、さまざまな原因が考えられます。
この記事では、WordPressのサイトが重くなる主な原因と、初心者でも取り組みやすい表示速度改善の方法について解説します。
WordPressの表示速度が重要な理由
Webサイトを訪れたユーザーは、ページが表示されるまで長く待たされると、そのまま離脱してしまうことがあります。
特にスマートフォンからWebサイトを見るユーザーが多い現在では、表示速度を意識したサイト制作が重要です。
ユーザーの離脱を防ぐ
ページをクリックしたのに、なかなか内容が表示されない。
このような状態が続くと、ユーザーは「このサイトは重い」と感じて、前のページへ戻ってしまう可能性があります。
せっかく広告や検索結果、SNSなどからユーザーを集めても、ページの表示が遅ければ問い合わせや購入などにつながりにくくなります。
SEOにも関係する
Googleでは、Webページのユーザー体験を評価する指標のひとつとして、Core Web Vitalsを使用しています。
代表的な指標として、LCP、INP、CLSがあります。
- LCP:ページの主要なコンテンツが表示されるまでの時間
- INP:ユーザーの操作に対するページの応答性
- CLS:ページの表示中にレイアウトがどれだけずれるか
表示速度を改善する際は、単純に「何秒で表示されるか」だけではなく、こうしたユーザー体験も意識することが重要です。
WordPressのサイトが重くなる主な原因
WordPressの表示速度が遅くなる原因は、サイトによって異なります。
代表的な原因には、以下のようなものがあります。
- 画像ファイルの容量が大きい
- 不要なプラグインが多い
- JavaScriptやCSSの読み込みが多い
- Webフォントを大量に使用している
- キャッシュが適切に設定されていない
- サーバーの性能が不足している
- データベースが肥大化している
- 外部サービスを大量に読み込んでいる
- テーマやプラグインの処理が重い
そのため、「とりあえずキャッシュ系プラグインを入れる」という方法だけでは、十分な改善ができないことがあります。
まずは、何が原因でサイトが遅くなっているのかを調べることが大切です。
まずはPageSpeed Insightsで速度を確認する
WordPressの表示速度を改善する場合、最初におすすめしたいのがPageSpeed Insightsです。
PageSpeed Insightsでは、Webページのパフォーマンスを測定し、改善できるポイントを確認できます。
URLを入力するだけで測定できるため、専門的な知識がなくてもサイトの状態を確認できます。
PageSpeed Insightsで確認できること
PageSpeed Insightsでは、パフォーマンスだけでなく、アクセシビリティやSEO、ベストプラクティスなどについても確認できます。
ただし、表示されるスコアを100点にすることだけを目標にする必要はありません。
重要なのは、実際のユーザーにとってWebサイトが快適に利用できる状態になっているかどうかです。
WordPressの表示速度を改善する方法
ここからは、WordPressの表示速度を改善する代表的な方法を紹介します。
画像を最適化する
WordPressサイトが重くなる原因として、まず確認したいのが画像です。
最近のWebサイトでは、高解像度の写真や大きなビジュアルを使用することが多くなっています。
しかし、必要以上に大きな画像をそのままアップロードすると、ページの読み込みに時間がかかります。
例えば、Webサイト上では横幅800pxで表示している画像なのに、4000px以上の画像をそのまま使用している場合、必要以上のデータを読み込んでいることになります。
WebPなどの次世代画像形式を利用する
画像の容量を削減する方法として、WebPなどの次世代画像形式を利用する方法があります。
JPEGやPNGと比較して、画質を大きく損なわずにファイルサイズを小さくできる場合があります。
ただし、WebPに変換するだけで必ず高速化できるわけではありません。
画像の表示サイズに合わせて適切な解像度にすることや、不要な画像を読み込まないことも重要です。
画像の遅延読み込みを利用する
ページを開いた直後に画面外の画像まで全部読み込んでしまうと、最初の表示に必要のないデータまで読み込むことになります。
そこで利用できるのが「Lazy Load(遅延読み込み)」です。
ユーザーがスクロールして画像が必要になったタイミングで読み込むことで、初期表示時の通信量を減らすことができます。
ただし、ページ上部にあるメインビジュアルなど、最初に表示される重要な画像まで遅延読み込みしてしまうと、逆にLCPへ悪影響を与える場合があります。
そのため、画像の位置や役割に応じて設定することが重要です。
不要なプラグインを削除する
WordPressの大きな特徴のひとつが、プラグインを追加することでさまざまな機能を簡単に追加できることです。
一方で、必要以上にプラグインを追加すると、サイトの処理や外部ファイルの読み込みが増える場合があります。
使っていないプラグインを確認する
WordPressの管理画面から「プラグイン」を確認し、現在使用していないプラグインがないか確認しましょう。
不要なプラグインは停止するだけでなく、必要がなければ削除することをおすすめします。
プラグインの数だけが問題ではない
ここで注意したいのが、「プラグインが10個だから遅い」「20個だから重い」という単純な話ではないということです。
プラグインによって処理内容は大きく異なります。
少数のプラグインでも、大量のJavaScriptやCSSを読み込むものや、データベースへ頻繁にアクセスするものがあれば、表示速度へ影響する可能性があります。
そのため、単純にプラグインの数だけで判断するのではなく、実際に何を読み込んでいるのかを確認することが重要です。
JavaScriptとCSSの読み込みを見直す
Webサイトでは、デザインやアニメーション、スライダーなどさまざまな機能を実現するためにJavaScriptやCSSを使用します。
しかし、必要以上のファイルを読み込むと、ページの表示に時間がかかる場合があります。
使っていないCSSやJavaScriptを読み込んでいないか確認する
例えば、トップページでしか使用していないスライダー用のJavaScriptを、サイト内のすべてのページで読み込んでいるケースがあります。
このような場合は、必要なページだけでファイルを読み込むようにすることで、不要な通信を減らせます。
WordPressをオリジナルテーマで制作している場合は、ページごとに必要なCSSやJavaScriptを読み込む設計にすることも表示速度改善につながります。
Webフォントを見直す
Google FontsなどのWebフォントを利用すると、Webサイトのデザイン性を高めることができます。
一方で、フォントファイルを読み込むための通信が発生するため、使い方によっては表示速度に影響することがあります。
使用するフォントの種類を減らす
複数のフォントやウェイトを使用すると、それだけ読み込むデータも増えます。
例えば、通常・Medium・Bold・ExtraBoldなど、多数のウェイトを読み込んでいる場合は、本当に必要なものだけに絞ることを検討しましょう。
Webフォントをローカル配信する方法もある
Webサイトの構成によっては、Webフォントをサーバーへ配置してローカルから読み込む方法もあります。
外部サービスへの通信を減らせるため、サイトの構成によっては表示速度改善につながる場合があります。
ただし、フォントファイルのライセンスや利用規約については、事前に確認しておきましょう。
キャッシュを利用する
WordPressの表示速度改善では、キャッシュも重要なポイントです。
キャッシュとは、一度取得したデータなどを一時的に保存しておき、次回以降の表示を高速化する仕組みです。
WordPressで利用できるキャッシュ
WordPressでは、さまざまな方法でキャッシュを利用できます。
- ページキャッシュ
- ブラウザキャッシュ
- オブジェクトキャッシュ
- サーバー側のキャッシュ
- CDNのキャッシュ
レンタルサーバーによっては、サーバー側でキャッシュ機能が提供されている場合もあります。
すでにサーバー側でキャッシュが設定されている場合は、WordPress側のキャッシュ系プラグインとの設定が競合しないよう注意が必要です。
キャッシュ系プラグインは慎重に使う
WordPressには、表示速度を改善するためのキャッシュ系プラグインが数多くあります。
キャッシュを適切に設定できれば、ページ表示の高速化に役立ちます。
しかし、設定を間違えると、以下のような問題が発生することがあります。
- CSSが反映されない
- JavaScriptが正常に動作しない
- フォームが送信できない
- 更新した内容が表示されない
- レイアウトが崩れる
特に、JavaScriptの結合や遅延実行など、高度な最適化機能を有効にする場合は注意が必要です。
速度改善の設定は、一度にすべてを有効にするのではなく、ひとつずつ変更して動作を確認することをおすすめします。
サーバーの性能を確認する
WordPressの表示速度が遅い場合、Webサイト側だけでなく、サーバーが原因になっている可能性もあります。
特にアクセスが増えてきたサイトでは、サーバーの処理能力が重要になります。
安価なサーバーだから必ず遅いわけではない
サーバーは単純に料金だけで性能を判断することはできません。
サーバーのCPUやメモリ、ストレージ、Webサーバーの構成、データベースの性能、キャッシュ機能など、さまざまな要素が関係します。
サイトの規模やアクセス数に合わせて、適切なサーバー環境を選ぶことが重要です。
データベースを整理する
WordPressでは、記事や固定ページ、設定情報などがデータベースに保存されています。
長期間サイトを運用していると、不要なリビジョンや一時データなどが蓄積される場合があります。
こうしたデータが増えすぎると、データベースの管理や処理に影響する可能性があります。
不要なデータを削除するときの注意
データベースの最適化は効果が期待できる一方で、設定を誤るとWebサイトが正常に動作しなくなる可能性があります。
特に、データベースを直接編集する場合は、必ずバックアップを取得してから作業を行いましょう。
WordPressに詳しくない場合は、無理にデータベースを直接操作せず、専門知識のある制作者へ相談することをおすすめします。
外部サービスの読み込みを確認する
Webサイトでは、Google Analytics、Google Tag Manager、SNS埋め込み、Instagramフィード、YouTube、チャットツールなど、さまざまな外部サービスを利用することがあります。
これらは便利な反面、外部サーバーとの通信が発生します。
外部サービスを大量に導入すると、ページの表示速度に影響する可能性があります。
本当に必要なサービスだけを利用する
Webサイトに導入されている外部サービスを一度確認してみましょう。
現在ほとんど利用していない機能や、導入したものの効果を確認していないサービスがあれば、削除や見直しを検討します。
特にSNSフィードや動画など、大量のデータを外部から読み込むコンテンツは、表示速度への影響を確認しておきましょう。
LCPを改善するには?
PageSpeed Insightsで「LCP」が問題になっている場合は、ページを開いたときに最初に表示される大きなコンテンツを確認しましょう。
企業サイトでは、トップページのメインビジュアルがLCPの対象になっているケースがあります。
ファーストビューの画像を最適化する
ファーストビューに大きな画像を使用している場合は、画像の容量やサイズを見直します。
必要以上に大きな画像を使用せず、実際に表示するサイズに合わせて最適化しましょう。
LCP画像を遅延読み込みしない
ページ上部にある重要な画像までLazy Loadの対象にすると、LCPの改善を妨げる場合があります。
「画像はすべて遅延読み込みすればいい」と考えるのではなく、最初に表示する重要な画像と、スクロール後に表示される画像を分けて考えることが大切です。
CLSを改善するには?
ページを読み込んでいる途中で、画像や広告などが後から表示され、コンテンツの位置がずれることがあります。
このようなレイアウトのずれはCLSに関係します。
画像のサイズを指定する
画像を表示する領域の高さがあらかじめ確保されていないと、画像が読み込まれたタイミングでコンテンツが下へ移動することがあります。
画像の幅や高さ、またはCSSのaspect-ratioなどを適切に設定して、画像が読み込まれる前から必要なスペースを確保することが重要です。
INPを改善するには?
INPは、ユーザーがページを操作したときの応答性に関係する指標です。
ボタンをクリックしたのに反応しない、メニューを開こうとしても遅れて動くといった状態は、ユーザー体験を悪化させます。
JavaScriptの処理を見直す
JavaScriptで大量の処理を行っている場合、ユーザーの操作に対する反応が遅くなることがあります。
不要なJavaScriptを削減したり、処理を分割したりすることで改善できる場合があります。
特にアニメーションやスライダー、複雑なインタラクションを多用しているサイトでは、JavaScriptの処理を確認することが重要です。
WordPressの表示速度改善でやってはいけないこと
表示速度を改善するときは、「とにかく設定を増やせば速くなる」と考えないことが重要です。
PageSpeed Insightsのスコアだけを追いかける
PageSpeed Insightsのスコアを100点にすること自体がWebサイトの目的ではありません。
例えば、スコアを上げるためにJavaScriptを極端に遅延させた結果、メニューやお問い合わせフォームが正常に動作しなくなってしまっては本末転倒です。
大切なのは、スコアだけではなく、実際のユーザーが快適にWebサイトを利用できる状態を作ることです。
キャッシュ系プラグインを複数入れる
複数のキャッシュ系プラグインを導入すると、それぞれの設定が競合する可能性があります。
「速度を改善したいから」という理由だけで、似たような機能を持つプラグインを追加するのは避けましょう。
バックアップを取らずに設定を変更する
WordPressの設定やデータベースを変更するときは、万が一に備えてバックアップを取得しておくことが重要です。
特に、本番環境で大幅な速度改善を行う場合は、テスト環境で動作を確認してから公開環境へ反映する方法がおすすめです。
WordPressの表示速度改善は原因を特定することが重要
WordPressの表示速度を改善するために重要なのは、最初から設定を変更することではありません。
まず、「何が原因で遅くなっているのか」を調べることが重要です。
例えば、画像が原因なのにキャッシュ設定ばかり変更しても、大きな改善は期待できません。
逆に、サーバーが原因なのに画像を圧縮し続けても、問題を根本的に解決できない場合があります。
そのため、PageSpeed Insightsやブラウザの開発者ツールなどを利用して、ページのどこに時間がかかっているのかを確認してから対策を行いましょう。
WordPressの表示速度改善チェックリスト
最後に、WordPressサイトの表示速度を改善するときに確認したい項目をまとめます。
- 画像のファイルサイズを確認する
- WebPなどの画像形式を検討する
- 画像の表示サイズを最適化する
- Lazy Loadを適切に設定する
- 不要なプラグインを削除する
- CSSやJavaScriptの読み込みを見直す
- Webフォントの種類やウェイトを見直す
- キャッシュ設定を確認する
- サーバーの性能を確認する
- データベースを適切に管理する
- 外部サービスの読み込みを見直す
- LCP・INP・CLSを確認する
- PageSpeed Insightsで改善状況を確認する
まとめ
WordPressの表示速度が遅くなる原因は、画像、プラグイン、CSS、JavaScript、Webフォント、キャッシュ、サーバーなど、さまざまなところにあります。
そのため、「このプラグインを入れれば必ず速くなる」という方法はありません。
まずはPageSpeed Insightsなどを利用して現在の状態を確認し、どこに問題があるのかを把握することが大切です。
特に最初に確認したいのは、画像の容量、不要なプラグイン、JavaScriptやCSS、キャッシュ、サーバー環境です。
また、表示速度を改善するときは、PageSpeed Insightsのスコアだけを追いかけるのではなく、実際のユーザーが快適にWebサイトを利用できるかという視点も忘れないようにしましょう。
WordPressサイトは、制作して終わりではありません。
コンテンツを追加したり、プラグインを導入したり、画像を増やしたりすることで、時間が経つにつれて表示速度が変化することもあります。
定期的にサイトの状態を確認し、必要に応じて改善していくことが大切です。
SCSolutionではWordPressサイトの改善・運用にも対応しています
SCSolutionでは、WordPressを利用したホームページの制作だけでなく、公開後の運用や改善にも対応しています。
「WordPressのサイトが重くなってきた」「PageSpeed Insightsのスコアを改善したい」「画像やプラグインを見直したい」といった場合も、Webサイトの状態を確認したうえで、必要な対策をご提案します。
表示速度だけを改善するのではなく、デザイン、SEO、ユーザビリティ、問い合わせにつながる導線など、Webサイト全体を考えた改善を行うことが重要です。
WordPressサイトの表示速度や運用についてお困りのことがありましたら、SCSolutionまでお気軽にご相談ください。