WordPressサイトの読み込み速度がカタツムリのように遅いと、非常にイライラすることがあります。WPBeginnerで数百ものウェブサイトを管理してきた経験から、速度低下の最大の原因の1つは、目に見えないかもしれない「HTTPリクエストが多すぎる」ことだとわかっています。
画像、スクリプト、またはファイルの各リクエストは、読み込み時間をわずかに増加させ、それが積み重なると訪問者が離れてしまう原因となります。良いニュースは、開発者でなくてもサイトのパフォーマンスに大きな違いをもたらすことができるということです。
これらのリクエストを削減するために私たちが使用している、初心者向けの正確な方法のリストを作成しました。サイトを明らかに速くするための簡単な手順を見ていきましょう。
WordPressでHTTPリクエストを削減する理由
一部のウェブサイトが読み込みに時間がかかる理由を疑問に思ったことはありますか？各WordPressページは、画像、CSSファイル、JavaScript、動画埋め込みなど、さまざまなピースで構成されたパズルのようなものです。ページが表示されるためには、これらのすべてのコンポーネントが連携する必要があります。
あなたのブラウザを、すべての材料を個別に集めるためにキッチンを行ったり来たりする忙しいウェイターだと想像してみてください。特にあなたのサイトがビジュアルや機能に富んでいる場合、これは物事を遅くする可能性があります。各要素が読み込み時間に影響します。
さらに、当社のウェブサイトはサーバーに保存されているものだけに依存していません。Google Analyticsやソーシャルメディアウィジェットなど、外部ソースからデータを取得することもよくあります。これらの追加機能はサイトをより豊かでインタラクティブなものにすることができますが、最適化されていない場合はサイトの速度を低下させる可能性があります。
これらの最適化されていない要素は、高速読み込みを期待する訪問者をイライラさせる重い荷物となり得ます。Strange Loop の調査で指摘されているように、ウェブサイトの表示速度が遅いと、コンバージョン、ページビュー、さらには顧客満足度を失う可能性があります。
だからこそ、HTTPリクエストを削減することが重要です。WPBeginnerで私たちがここで行ったように、これに焦点を当てることで、サイトの速度を大幅に向上させ、ユーザーエンゲージメントを高め、最終的にはビジネスを後押しすることができます。スピードは単なる技術的な勝利ではなく、戦略的な優位性です。
HTTPリクエストを特定する方法
WordPressでHTTPリクエストを削減する方法を説明する前に、それらをどのように特定できるかを見ていきましょう。
ブラウザの開発者ツールを使用すると、ウェブサイトが行ったHTTPリクエストを簡単に表示できます。これにより、ウェブページを表示するためにロードする必要があるファイルのリストが表示されます。
例えば、Google Chromeでは、表示 » 開発 » 検証に移動することで開発者ツールを開くことができます。ページを右クリックしてメニューから「検証」を選択することもできます。
次に、「ネットワーク」タブに移動します。ページをリロードすると、内部および外部のHTTPリクエストを含む、読み込まれたすべてのリソースのリストが表示されます。
外部HTTPリクエストのみを簡単に表示するには、ネットワークパネルの上部にあるフィルターツールバーを探し、「サードパーティリクエスト」というラベルのチェックボックスをオンにします。これにより、自分のドメインから読み込まれたすべてのファイルが非表示になります。
読み込み時間に影響を与える可能性のある特定の種類のファイル（JS（JavaScript）やCSSなど）のみを表示したい場合は、上部にあるボタンを使用してリストをフィルターするだけです。
読み込みの遅いファイルに注意してください。「時間」列を見ると、これらの各リソースが読み込まれるのにかかる時間を確認できます。次に、この列ヘッダーをクリックして時間を基準にリストを並べ替え、もう一度クリックすると最も読み込みの遅いファイルが一番上に表示されます。
4番目の「イニシエーター」列を見ると、ファイルが読み込まれたプラグインまたはテーマの名前が表示されることがあります。遅いファイルのリクエストを要求しているプラグインまたはテーマがあればメモしておきましょう。
Pingdomのようなサードパーティツールを使用して、より詳細なレポートを取得できます。詳細については、WordPressでサードパーティドメインリクエストを追跡する方法に関するガイドをご覧ください。
HTTPリクエストを特定する方法がわかったので、WordPressサイトでそれらを削減するための最も効果的な方法を詳しく見ていきましょう。
- CSSとJavaScriptファイルを結合する
- 画像と動画の遅延読み込み
- コンテンツ配信システム（CDN）を使用する
- ブラウザキャッシュの活用
- 外部リソースの使用を最小限に抑える
- ボーナス：Gzip圧縮を有効にする
- HTTPリクエストの削減に関するよくある質問
- WordPressのパフォーマンスに関する追加リソース
1. CSSとJavaScriptファイルを結合する
ウェブサイトへのHTTPリクエストの数を減らす最良の方法は、アクセスする必要のあるファイルの数を減らすことです。機能の損失なしにHTTPリクエストを減らすために、複数のファイルを結合することができます。
例えば、ウェブサイトのデザインのさまざまな部分に対して複数のCSSファイルを持つ代わりに、それらを単一のファイルにマージすることができます。この単一のファイルには必要なすべてのスタイリングコードが含まれており、ブラウザは多くのリクエストの代わりに1つのリクエストを行うだけで済みます。
同様に、複数のJavaScriptファイルを1つにまとめることで、ウェブサイトのインタラクティブな要素を読み込むために必要なリクエスト数を減らすことができます。
注意：ファイルを結合することは素晴らしい習慣ですが、HTTP/2のような最新のWebプロトコルは、複数の小さなファイルを非常に速く、時には1つの大きなファイルよりも速く読み込むことができることを知っておくと役立ちます。
ただし、古いホスティングを使用しているサイトや最大限の互換性を求める場合は、ファイルを結合および最小化することが、リクエストを削減するための確実な戦略であり続けます。WP Rocketのようなツールは、これをインテリジェントに処理してくれます！ 👍
いくつかのWordPressプラグインがこのプロセスを自動化してくれます。人気のオプションには、WP Rocket（有料）やAutoptimize（無料）があります。
これらのプラグインの使用方法の詳細については、WordPressでレンダリングをブロックするJavaScriptとCSSを修正する方法に関するガイドを参照してください。
ファイルを結合するだけでなく、これらのプラグインはファイルを圧縮します。これにより、コードから空白やコメントなどの不要な文字が削除され、機能に影響を与えることなくファイルが小さくなります。
これにより、ダウンロードする必要のあるデータ量が削減され、読み込み速度がさらに向上します。
2. 画像と動画の遅延読み込み
特にページに多くの画像や動画が含まれている場合、遅延読み込みはウェブサイトのパフォーマンスを向上させるもう1つの優れた方法です。
WordPressはデフォルトで画像を遅延読み込みするため、これは素晴らしいスタートであることに注意する価値があります。しかし、WP Rocketのようなプラグインを使用すると、より多くの制御が可能になり、動画やiframeも遅延読み込みできるため、さらに大きな違いを生む可能性があります。
通常、WordPressは、それらの画像や動画がページのさらに下の方にあり、ユーザーにすぐには表示されなくても、ウェブページを表示する前にすべてのメディアファイルを読み込みます。これは初期のページ読み込み時間を大幅に増加させる可能性があります。
遅延読み込みは、画像や動画がユーザーのビューにスクロールされるまで読み込みを遅延させることで、このプロセスを最適化します。
これらの役立つチュートリアルは、WordPressウェブサイトで遅延読み込みを設定する方法を学ぶのに役立ちます。
3. コンテンツデリバリーネットワーク（CDN）を使用する
コンテンツ配信ネットワーク（CDN）を使用することは、特にウェブサーバーから遠くにいるユーザーにとって、WordPressウェブサイトの読み込み速度を向上させるためのもう1つの効果的な戦略です。
前の方法とは異なり、CDNはHTTPリクエストの数を減らしません。代わりに、それらのリクエストの処理方法を最適化します。
通常、ウェブサイトのファイルは単一のウェブサーバーに保存され、世界中のユーザーはこの1つの場所からファイルをリクエストする必要があります。
CDNは、世界中にある高速サーバーにウェブサイトのファイルのコピーを保存し、ユーザーのブラウザには最も近いサーバーから配信されます。
あなたのウェブサイトに最適なオプションを学ぶために、最高のWordPress CDNサービスの専門家による比較をご覧ください。
WPBeginnerでは、ページ読み込み速度を向上させるためにCloudflareを使用しています。WordPressでCloudflare無料CDNをセットアップする方法に関するステップバイステップのチュートリアルに従うことができます。WordPressでCloudflare無料CDNをセットアップする方法。
4. ブラウザキャッシュを活用する
特に繰り返しサイトを訪れるユーザーがいる場合、ブラウザキャッシュを活用してウェブサイトへのHTTPリクエストを減らすこともできます。
ユーザーが初めてウェブサイトを訪れる際、ブラウザは画像、スタイルシート、JavaScript ファイルなどの必要なリソースをすべてダウンロードします。ブラウザキャッシュにより、ブラウザはこれらのファイルのコピーをユーザーのコンピューターにローカルに保存できます。
次回ウェブサイトにアクセスした際、ブラウザはHTTPリクエストをサーバーに送信する前にローカルキャッシュを確認します。キャッシュに有効期限切れでないファイルのコピーが見つかった場合、ブラウザはファイルを再度ダウンロードする代わりにローカルファイルを使用します。
これにより、サーバーへのHTTPリクエストの数が大幅に減少し、再訪問者の読み込み時間が短縮されます。
ただし、ウェブサイトのコンテンツが頻繁に更新される場合は、キャッシュされたリソースに適切な有効期限を設定することが重要です。これにより、ユーザーが最終的にファイルの最新バージョンを受け取ることができます。
WordPressにExpiresヘッダーを追加することで、リソースがキャッシュされる期間を制御できます。これらのヘッダーは、キャッシュされたファイルがいつ古いと見なされ、サーバーから再ダウンロードする必要があるかをブラウザに伝えます。
5.外部リソースの使用を最小限に抑える
多くの WordPress プラグインやテーマは、Google Analytics、Facebook、フォントプロバイダーなどの外部ウェブサイトからスクリプト、スタイルシート、画像などのリソースを読み込みます。
これらの外部HTTPリクエストは、ブラウザが必要なコンポーネントをすべて取得するために複数のサーバーに接続する必要があるため、ウェブサイトの読み込み速度に影響を与える可能性があります。
これらの外部リソースがスピードのために最適化されていても、多すぎる使用はウェブサイトのパフォーマンスを低下させる可能性があります。
これらの外部HTTPリクエストを削減するために、実際に必要のないプラグインやテーマを無効化して削除することから始めることができます。
遅いファイルを読み込むプラグインやテーマがあれば、代替手段を探すことも検討してください。以前にHTTPリクエストを特定した際に、いくつか気づいたかもしれません。
WordPress プラグインを選択する際は、読み込む外部リソースに注意してください。パフォーマンスを優先するプラグインを選択し、過剰な外部スクリプトやスタイルを読み込むプラグインは避けるようにしてください。
プラグインをより詳細に制御するには、Plugin Organizerのようなプラグイン管理ツールを検討してください。これにより、必要なページにのみプラグインを選択的に読み込むことができます。
最後に、カスタムWebフォントは、Google Fontsのような外部プロバイダーからロードされることが多く、HTTPリクエストに大きく寄与する可能性があります。使用するフォントファミリーとウェイトの数を制限するか、ユーザーのコンピューターに既にインストールされているシステムフォントの使用を検討してください。
WPBeginnerでは、2021年にシステムフォントに切り替え、特にインターネット接続が遅いユーザーのページ読み込み時間を改善しました。WordPressウェブサイトでGoogleフォントを無効にする方法に関するガイドで、同様の方法を学ぶことができます。WordPressウェブサイトでGoogleフォントを無効にする方法。
6. ボーナス：Gzip圧縮を有効にする
最後に、ウェブサーバー上のファイルのサイズを縮小するために、GZIP圧縮を有効にすることをお勧めします。
これは直接HTTPリクエストの数を減らすわけではありませんが、プロセスを高速化し、ウェブサイトファイルの転送をより速くします。
HTTPリクエストの削減に関するよくある質問
以下に、HTTPリクエストの最適化とWordPressサイトの速度向上に関する最も一般的な質問をいくつか示します。
1. HTTPリクエストとは何ですか？
HTTPリクエストとは、ウェブブラウザがウェブページを読み込むために必要な情報をサーバーに要求することです。これは、画像、スタイルシート（CSSファイル）、スクリプト（JavaScriptファイル）、またはサイトのその他の部分である可能性があります。個々のファイルごとに個別のリクエストが必要です。
2. ウェブサイトにとってHTTPリクエストが多すぎるのは何件ですか？
サイトの複雑さによって異なるため、単一の魔法の数字はありません。しかし、ほとんどの中小企業ウェブサイトにとっての目標は、1ページあたり50〜60リクエスト未満に抑えることです。サイトが行う必要のあるリクエストが少ないほど、通常は訪問者にとって速く読み込まれます。
3. 初心者がHTTPリクエストを削減する最も簡単な方法は？
初心者にとって最も簡単な方法は、WP Rocketのようなキャッシュ・最適化プラグインを使用することです。数回のクリックでCSSおよびJavaScriptファイルを自動的に結合できるため、コードに一切触れることなく、リクエスト数を大幅に削減できます。
4. CDNはHTTPリクエストの数を減らしますか？
いいえ、CDN（Content Delivery Network）は実際のリクエスト数を減らすわけではありません。代わりに、リクエストをはるかに高速にします。CDNはファイルのコピーを世界中のサーバーに保存するため、ユーザーのブラウザがファイルをリクエストすると、最も近い場所から配信され、読み込み時間が短縮されます。
WordPressのパフォーマンスに関する追加リソース
このチュートリアルでWordPressのHTTPリクエストを削減する方法を学んでいただけたことを願っています。サイトの速度とパフォーマンスを向上させるための他の専門家ガイドもぜひご覧ください。
サイト速度のテストと診断
コアパフォーマンスの改善
高度な最適化テクニック
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
質問や提案はありますか？コメントを残して、議論を開始してください。