WPBeginner のページ読み込み速度を向上させる方法 (6 つのヒントを公開)

当サイトの読者からは、WPBeginnerをこれほど高速に読み込ませる方法をよく尋ねられます。私たちはベストプラクティスに従っていますが、高トラフィックサイトの管理を通じて、トップパフォーマンスのためのいくつかの追加の秘訣を学びました。

GoogleがFirst Input Delay（FID）を新しいInteraction to Next Paint（INP）に置き換えるなど、指標を変更するとストレスを感じることは承知しています。これらのアップデートを常に把握しておくことは、サイトを高速に保ち、SEOを強化するために重要です。

この記事では、WPBeginnerで実際に使用している正確な戦略を公開します。これらは、サイトの規模に関係なく、あらゆるウェブサイトに役立つ実践的なヒントです。

以下では、ホスティングプラットフォームから競合他社に対する優位性を与える特定のツールまで、すべてを説明します。

この記事で議論するすべての項目を簡単に概観します。

• ページ読み込み速度が重要なのはなぜですか？
• WPBeginnerのページ読み込み速度を向上させる方法
• より高速なホスティングプラットフォーム
• CloudFlare DNS
• WP Rocket を使用したパフォーマンス最適化
• 4. JavaScriptとCSSのエンキュー
• ブロックエディタースタイルのアンロード
• その他のパフォーマンス向上策
• ページ読み込み速度の向上に関するFAQ
• 追加リソースと次のステップ

ページ読み込み速度が重要なのはなぜですか？

ページの読み込み速度とは、ユーザーがリンクをクリックしたときにウェブサイトが表示される速さのことです。

私たちの目標は、ユーザーが必要な情報を迅速に入手できるようにすることです。読み込みの速いウェブサイトは、ユーザーが探している情報をすぐに取得できるため、ユーザーを満足させます。

一方、読み込みの遅いウェブサイトは、ユーザーを離脱させる可能性があります。これは、私たちがすべてのウェブサイトで避けたいことです。ユーザーは、あなたのサイトに長く滞在するほど、購読者や顧客になる可能性が高くなります。

読み込みに3秒かかるウェブサイトをユーザーが離れる（直帰する）可能性は36%高くなります。また、読み込みに5秒以上かかるウェブサイトを離れる可能性は90%高くなります。

Source: ThinkWithGoogle

ページの読み込み速度が非常に重要な理由は他にもいくつかあります。

• ユーザーエンゲージメントの向上：高速に読み込まれるウェブサイトは訪問者を引きつけ、迅速な情報アクセスを可能にします。サイトでより多くの時間を費やすユーザーは、購入またはコンバージョンする可能性が高くなります。
• 検索エンジンのランキング向上： 優れたユーザーエクスペリエンスにより、検索エンジンは高速読み込みウェブサイトをより高くランク付けすることで優遇します。
• モバイルユーザーにとって重要： モバイルブラウジングではスピードが特に重要です。モバイルユーザーは、デスクトップユーザーよりも遅いウェブサイトを離れる可能性が2倍高いです。
• 信頼性と権威性を構築する：読み込みの速いサイトは、より信頼性が高くプロフェッショナルに見え、ユーザーがあなたのビジネスから購入することを説得するのに役立ちます。

要約すると、ページの読み込み速度は、顧客満足度とエンゲージメントの向上により、全体的なユーザーエクスペリエンスを向上させます。

WPBeginnerのページ読み込み速度を向上させる方法

当社の WordPress パフォーマンスおよび速度最適化ハンドブック のすべての標準的なベストプラクティスを適用します。

さらに、WPBeginnerのWordPressパフォーマンスをさらに向上させるために、いくつかの追加措置を講じました。

ここに、実装したテクニックの前後のパフォーマンス最適化の最近のスクリーンショットを示します。

ウェブサイトで同様のテストを行い、Googleコアウェブバイタルのスコアを確認したい場合は、 PageSpeed Insights ツールを使用してください。

テストしたい URL を入力し、「分析」ボタンをクリックするだけです。

ツールは数秒間ウェブページを分析し、テスト結果を表示します。

さて、このパフォーマンススコアを達成するために行った手順を見ていきましょう。

1. より高速なホスティングプラットフォーム

WordPressベースのビジネスを長年運営してきた経験から、最適なWordPressホスティングを選択することの重要性を学びました。

小規模なウェブサイトの場合、BluehostやHostingerのようなトップホスティング会社のいずれかから始めることができます。

ただし、WPBeginnerはトラフィック量の多い大規模なウェブサイトです。共有またはVPSホスティングプランでは、その規模では制限が多すぎます。

そのため、WPBeginner は Google Cloud Platform 上で実行される SiteGround のエンタープライズ クラウド インフラストラクチャにホストされています。

なぜSiteGroundを使用するのか

• SiteGround のエンタープライズグレードのホスティングインフラストラクチャには、複数の冗長性レイヤーがあり、最大の稼働時間を保証します。
• Googleの最先端ネットワークに接続されたGoogle Cloud Platform上で実行され、世界中のあらゆる場所から最速の速度を保証します。
• 個別の専用ホスティングサーバーの管理にかかるコストと手間を削減します。
• SiteGround独自の強化機能（Ultrafast PHP、より高速なMySQL、Brotli圧縮など）は、さらなるパフォーマンス向上をもたらします。
• SiteGroundのサポートチームとは直接的な業務経験があります。彼らのエンジニアの専門知識、迅速な対応、そして全体的な親切さには常に感銘を受けています。

詳細については、WPBeginnerがSiteGroundホスティングに切り替えた理由に関する記事をご覧ください。

現在、WPBeginnerユーザーには無料のドメイン名付きで、大変お得な割引も提供しています。月額2.99ドルからで、提供されるテクノロジーとサービスレベルを考慮すると非常に手頃な価格です。

最も良い点は、SiteGroundのメリットがエンタープライズ顧客に限定されないことです。SiteGroundの共有ホスティングアカウントはすべて、Google Cloud Platformでホストされています。

2. CloudFlare DNS

以前の WPBeginner Insider 記事で、Sucuri から Cloudflare への切り替えのケーススタディを共有しました。

セキュリティ以外にも、Cloudflare DNS を使用することで WPBeginner はパフォーマンスにおいて大きな優位性を得ています。

DNS (ドメインネームシステム) は、ウェブサイトの電話帳のようなものです。

ブラウザにウェブサイトのアドレスを入力したり、リンクをクリックしたりすると、DNSサービスがドメイン名を検索し、その特定のウェブサイトのIPアドレスにウェブサイトを誘導します。

通常、ウェブサイトはホスティング会社のネームサーバーを使用してDNSを管理します。これらはCloudflareほど高速ではなく、世界中の310以上の都市にあるデータセンターでネットワークエッジでのDNS解決を可能にします。

Cloudflare DNSを使用する理由

• 最速のDNS解決：Cloudflareのグローバルネットワークにより、DNSは任意のユーザーに最も近い場所で解決されます。
• 組み込みセキュリティ： すべてのトラフィックがCloudflare DNSを通過するため、Webアプリケーションファイアウォール（WAF）はDDoS攻撃、スパム、不要なボット、SQLインジェクション、ハッキング試行などを迅速に軽減およびブロックできます。
• CDN配信 – 同社のネットワークは静的アセットを自動的にキャッシュし、グローバルネットワークを通じて配信します。ウェブサイトの読み込みを高速化します。これはDNSレベルで行われるため、CDNアセット用の個別のサブドメインは必要ありません。

当社ではエンタープライズプランを使用していますが、Cloudflareは小規模なウェブサイト向けに無料のCDNとDNSを提供しており、機能は少ないものの実質的に同じことを行います。

3. WP Rocketを使用したパフォーマンス最適化

パフォーマンスをさらに最適化するために、WP Rocket を使用しています。これは、市場で最高の WordPress パフォーマンスプラグインの 1 つです。とりわけ、キャッシュを処理します。これは、ウェブサイトのコピーを保存して、再訪問者のページ読み込みを高速化することを意味します。

WP Rocketの最も気に入っている点は、最も包括的なWordPressパフォーマンス最適化プラグインであるため、多くの異なるタスクを処理するために必要なツールは1つだけで済むことです。

なぜWP Rocketを使用するのか

• キャッシュプリロード – 通常、キャッシュプラグインはユーザーがページにアクセスするまで、そのページのキャッシュコピーを作成しません。WP Rocketは自動的にキャッシュを準備しておくため、ページの読み込み時間に大きな違いが出ます。
• ブラウザキャッシュ – 画像、JavaScript、CSSなどの静的アセットをブラウザキャッシュに保存すると、後続のページビューでの読み込みが高速になります。
• ファイル最適化 – WP Rocketは、JavaScriptやスタイルシートなどの静的ファイルを最小化し、配信を最適化するのに役立ちます。これらのファイルを小さくすることで、ページの全体的な読み込み時間が大幅に短縮されます。

このプラグインに関する詳細な経験を、長所と短所を含めてWP Rocketのレビューで共有しました。

WP Rocketで使用している設定は？

以下の WP Rocket 設定がオンになっています:

• フルページキャッシュ
• ファイルの最適化（JSおよびCSSファイルのミニファイとクリティカルCSSの配信）
• JavaScriptの遅延読み込み（JSの読み込みを遅延させ、レンダリングブロックの問題を修正するのに役立ちます）
• 画像とメディアファイルの遅延読み込み

これらの設定をサイトで使用する方法についてサポートが必要ですか？最良の結果を得るためにWP Rocketを設定するためのステップバイステップガイドがあります。

4. JavaScriptとCSSのエンキュー

WP Rocket で JavaScript および CSS ファイルの配信を最適化しますが、まず、特定のページに必要な JavaScript および CSS ファイルのみをウェブサイトに読み込むようにします。

これを処理する最善の方法は、WordPressのコーディング標準に従った高品質のテーマとプラグインを使用することです。これらのツールは、スクリプトが必要な場合にのみロードするように構築されています。

ただし、開発者は機能が正しく動作するように、サイト全体でスクリプトを読み込む場合があります。WPBeginnerでは、開発チームがこれらの不要なスクリプトを手動でデキューし、その後、それらが必要なページにのみエンキューします。

以下のようなPHPスニペットを追加する、より安全で簡単な方法は、無料のWPCodeプラグインを使用することです。これにより、テーマファイルを編集することなくカスタムコードを追加および管理できるため、エラーを防ぐのに役立ちます。詳細については、完全なWPCodeレビューをご覧ください。

コードを手動で追加したい場合は、まず不要なスクリプトを見つける必要があります。最も簡単な方法は、Query Monitor プラグインを使用することです。

ページに読み込まれているすべてのJavaScriptおよびCSSファイルが表示されるため、不要なファイルを特定できます。スクリプトをデキューするには、Query Monitorからそのハンドルを取得する必要があります。その後、次のコードを使用できます。

function prefix_remove_scripts() {
	if ( is_front_page() ) {
		wp_dequeue_script( 'plugin-script-handle' );
	}
}
add_action( 'wp_print_scripts', 'prefix_remove_scripts', 100 );

同様に、不要なスタイルシートを削除するには次のコードを使用できます：

/**
 * Remove unnecessary stylesheets
 */
function prefix_remove_styles() {
	if ( is_front_page() ) {
	wp_dequeue_style( 'stylesheet-handle' );
	}
}
add_action( 'wp_enqueue_scripts', 'prefix_remove_styles', 100 );

詳細については、WordPressでJavaScriptとCSSを適切に追加する方法に関するチュートリアルを参照してください。

5. ブロックエディタースタイルのアンロード

WPBeginnerでは、デフォルトのWordPressブロックエディターを使用しています。これは非常に高速であり、WordPressコア開発チームはパフォーマンスの向上に多くの時間とリソースを費やしています。

パフォーマンスをさらに向上させるために、WPBeginnerでは使用しないブロックエディタースタイルの一部をアンロードします。

これによりDOMサイズが削減され、ブラウザがリクエストされたページを処理する速度が向上します。

ブラウザの用語では、DOMはページ上の要素とサブ要素（見出し、テキスト、画像、スタイルシート、スクリプトなど）のマッピングのようなものです。

DOMが大きくなると、ブラウザはそれを処理するのに少し時間がかかります。DOMが小さいと、すぐに処理されます。

ただし、これによるパフォーマンスの向上はそれほど大きくなく、小規模なWordPressウェブサイトを持つほとんどのユーザーにはお勧めしません。

6. その他のパフォーマンス向上策

上記のヒント以外にも、ページ読み込み速度を向上させるためのベストプラクティスを実施しています。

以下は、ウェブサイトに簡単に実装できるもののいくつかです。

• 最適化された画像 – 当社のチームは、アップロードするスクリーンショット、画像、メディアのファイルサイズを削減するために高度に最適化されていることを保証します。WordPressで画像を最適化する方法については、ガイドをご覧ください。WordPressで画像を最適化する方法。
• Cronジョブの最適化 – Cronジョブは、更新の確認、予約投稿の公開などのためにバックグラウンドで実行されるスケジュールされたWordPressタスクです。WordPressプラグインも独自のバックグラウンドプロセスを追加できます。Cronジョブの最適化は、サーバー負荷を軽減し、パフォーマンスを向上させます。
• 外部HTTPリクエストを減らす – 使用している一部のプラグインやツールは、外部ドメインからファイルを読み込む必要がある場合があります。これらのリクエストが多すぎると、ページの読み込み時間が長くなる可能性があります。これを修正するには、プラグインのCSSファイルとJavaScriptを無効にする方法に関するチュートリアルをご覧ください。

これらの方法やその他のページ読み込み時間を改善するための戦略の詳細なウォークスルーについては、WordPressのスピードとパフォーマンスに関する完全ガイドに従ってください。

ページ読み込み速度の向上に関するFAQ

サイトの読み込み速度をさらに速くする方法について、まだ疑問があるかもしれません。ここでは、よく受ける質問への回答をいくつかご紹介します。

ウェブサイトの適切なページ読み込み速度とは？

ページの読み込みを 2 秒未満にすることが素晴らしい目標です。サイトが速ければ速いほど、訪問者と検索エンジンのランキングの両方にとって良い結果となります。

ウェブサイトの速度をテストするにはどうすればよいですか？

GoogleのPageSpeed Insightsのような無料のオンラインツールを使用してサイトをテストできます。ウェブサイトのURLを入力するだけで、ツールが詳細なパフォーマンスレポートと改善のための提案を提供します。

サイトを高速化するために開発者である必要がありますか？

全く必要ありません。質の高いホスティングの選択、WP Rocketのようなキャッシュプラグインの使用、画像の最適化など、最も効果的な戦略の多くはコーディングスキルを必要としません。

これらのヒントの中で、最もパフォーマンスを向上させるのはどれですか？

あなたのWordPressホスティングは、あなたのウェブサイトのスピードの基盤です。初日からパフォーマンスに最も大きな影響を与えるのは、SiteGroundのような高速で信頼性の高いホストから始めることです。

追加リソースと次のステップ

このパフォーマンス戦略の内部的な解説が、ご自身のウェブサイトをより速くするための明確な道筋を示してくれることを願っています。共有したヒントは、あらゆるサイトのユーザーエクスペリエンスとSEOを改善できます。

さらに詳しく知りたい場合は、以下の追加ガイドが役立つかもしれません。

• WordPressの速度とパフォーマンスを向上させるための究極のガイド
• 大量トラフィックイベントに備えるためのWordPressサイトの準備方法
• ウェブサイトを高速化する最高のWordPressキャッシュプラグイン

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。