WordPressでブラウザキャッシュのレバレッジ警告を簡単に修正する方法

スピードテストでは、「ブラウザキャッシュの活用」という警告がよく表示され、複雑な技術的問題のように聞こえます。当社では、ウェブサイトの読み込み速度を向上させ、検索結果でのランキングを改善するために、このエラーを定期的に修正しています。

ブラウザキャッシュは、ユーザーのコンピューターに画像などのファイルを保存するように指示するだけで、再度ダウンロードする必要がなくなります。これにより、ページの読み込み時間が大幅に短縮され、全体的なユーザーエクスペリエンスが向上します。

開発者を雇うことなく、この警告を簡単に修正できます。当社自身のウェブサイトでブラウザキャッシュを有効にするために使用している、初心者向けのソリューションを順を追って説明します。

WordPressでブラウザキャッシュの活用に関する警告を修正する方法

WordPressにおけるブラウザキャッシュとは?

ブラウザキャッシュは、WordPressウェブサイトの読み込み速度を向上させる方法です。

通常、ウェブページが読み込まれるとき、すべてのファイルは個別に読み込まれます。これにより、ブラウザとWordPressホスティングサーバー間で複数のリクエストが発生し、ウェブページの読み込み時間が長くなります。

ブラウザキャッシュが有効になっている場合、ウェブブラウザはウェブページのコピーをローカルに保存します。これにより、ユーザーがサイトの2ページ目にアクセスした際に、スタイルシート、ロゴ、画像などの一般的なファイルをブラウザがより速く読み込めるようになります。

PingdomとGTMetrixによるWPBeginnerスピードテストの結果

これにより、実際のサーバーへのリクエスト数が少なくなり、サーバー全体の負荷が軽減され、結果としてパフォーマンスの最適化とユーザーエクスペリエンスが向上します。

「ブラウザキャッシュの活用」という警告はどこで表示されますか?

「ブラウザキャッシュの活用」という警告は、ブラウザキャッシュが有効になっていないか、キャッシュの設定が間違っていることを意味します。

GTmetrixやGoogle PageSpeed Insightsのようなツールを使用してウェブサイトの速度テストを実行すると、WordPressを高速化するために修正できることを示すレポートが表示されます。

ウェブサイトで現在ブラウザキャッシュを使用していない場合、ブラウザキャッシュを有効にするように警告が表示されます。

PageSpeed Insightsツールでのエラー表示は次のとおりです。

ブラウザキャッシュを活用する警告

「効率的なキャッシュポリシー」が機能していないという警告が表示されることがあります。

これらの警告は両方とも、ブラウザキャッシュの設定に関するエラーを指しています。

キャッシュポリシーの効率に関する警告

「ブラウザキャッシュを活用する」という警告が表示された場合、サイトを高速化するためにキャッシュルールを有効にしてカスタマイズする必要があることを意味します。

それを踏まえて、WordPressで「ブラウザキャッシュの活用」警告を簡単に修正する方法を2つの異なる方法で見ていきましょう。使用したい方法を選択するには、以下のクイックリンクを使用してください。

方法1:WP Rocketで「ブラウザキャッシュを活用する」警告を修正する

WP Rocketは、市場で最高のWordPressキャッシュプラグインです。初心者にも使いやすく、複雑なキャッシュやスピードの用語を知らなくても、サイトをスピードのために最適化するのに役立ちます。

WP Rocket

そのままの状態でも、推奨されるすべてのキャッシュ設定により、WordPressブログが本当に高速化されます。

WP Rocketで「ブラウザキャッシュを活用する」という警告を修正するには、プラグインをインストールして有効化するだけで済みます。

これで完了です。

詳細については、WordPressでWP Rocketを適切にインストールして設定する方法に関するガイドをご覧ください。WordPressでWP Rocketを適切にインストールして設定する方法

WP Rocketは、ブラウザキャッシュを自動的に有効にし、適切なルールで.htaccessファイルを変更します。

注意: SiteGroundのウェブホスティングを使用している場合は、代わりに無料のSiteGround Optimizerプラグインを使用できます。これはWP Rocketとほぼ同じ機能を持っており、ブラウザキャッシュを自動的に有効にします。

方法2:「ブラウザキャッシュの活用」警告をコードで修正する

2番目の方法は、WordPressファイルにコードを追加することです。以前にこれを行ったことがない場合は、ウェブ上のスニペットをWordPressに貼り付けるための初心者向けガイドを参照してください。

この方法は初心者向けではありませんので、ご自身が何をしているか正確に理解している場合のみ実行してください。ほとんどのビジネスオーナーには、方法1の使用をお勧めします。

それでは、WordPressにコードを追加して「ブラウザキャッシュの活用」という警告を修正する方法を見ていきましょう。

注意: WordPressのコードをカスタマイズする前に、WordPressサイトのバックアップを作成することをお勧めします。詳細については、WordPressサイトのバックアップと復元方法に関するガイドをご覧ください。

ウェブサイトがApacheまたはNginxのどちらで実行されているかを確認する

まず、ウェブサイトがApacheまたはNginxサーバーを使用しているかどうかを確認する必要があります。

これを行うには、新しいタブまたはウィンドウでウェブサイトを開きます。次に、右クリックして「検証」オプションを選択します。

右クリックして検証

次に、ページ上部の「ネットワーク」タブをクリックします。

結果を読み込むには、ページを更新する必要がある場合があります。

ネットワークをクリック

その後、「名前」列のドメイン名をクリックします。

ページの上部にあるはずです。

ウェブサイトのURLをクリック

次に、「レスポンスヘッダー」セクションで、「server」という項目が表示され、サーバーの種類が表示されます。

この場合、サイトはApacheサーバーで実行されています。

サーバーの種類を見つける

ApacheでCache-ControlおよびExpiresヘッダーを追加する

Apacheサーバーで「ブラウザキャッシュの活用」という警告を修正するには、.htaccessファイルにコードを追加します。

このファイルを編集するには、FTPクライアントまたはホストのファイルマネージャーツールを使用して、WordPressホスティングアカウントに接続する必要があります。

接続後、ウェブサイトのルートフォルダにある.htaccessファイルを確認できます。

htaccess FTP

見つからない場合は、心配しないでください。このファイルは非表示になっている場合があります。詳細については、WordPressサイトで.htaccessファイルが見つからない理由に関するガイドをご覧ください。

次に、ブラウザキャッシュをオンにするコードを追加する必要があります。これにより、ウェブブラウザは、ウェブサイトのリソースが削除される前に、どのくらいの期間保存するかを知ることができます。

  • cache-controlヘッダーは、キャッシュをどのように行うべきかについて、ウェブブラウザに具体的な詳細を提供します。
  • expiresヘッダーはキャッシュを有効にし、ウェブブラウザに特定のファイルが削除される前にどのくらいの期間保存すべきかを指示します。

次のコードを.htaccessファイルに追加するだけです。

## EXPIRES HEADER CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/svg "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 3 days"
</IfModule>
## EXPIRES HEADER CACHING ##

このコードは、ファイルの種類に基づいて異なるキャッシュ有効期限を設定します。

ファイルを編集したら、必ず保存してください。その後、ウェブブラウザは新しいバージョンのファイルを要求します。

NginxでCache-ControlおよびExpiresヘッダーを追加する

WordPressサイトをホストするためにNginxウェブサーバーを使用している場合は、サーバー設定ファイルを編集してブラウザキャッシュエラーを修正できます。

ただし、WP EngineSiteGroundのようなマネージドWordPressホスティングプロバイダーを使用している場合、通常はこのファイルを編集する権限はありません。その場合は、ホスティングサポートチームに連絡して、ブラウザキャッシュを有効にするように依頼してください。

独自のVPSまたは専用サーバーを管理している場合は、設定ファイルに次のコードを追加できます。

location ~* \.(jpg|jpeg|gif|png|svg)$ {
  expires 365d;
  add_header Cache-Control "public, no-transform";
}

location ~* \.(pdf|css|html|js|swf)$ {
  expires 30d;
  add_header Cache-Control "public, no-transform";
}

このコードは、さまざまなファイルタイプの有効期限を設定します。画像は通常変更されないため1年間(365日)キャッシュされますが、CSSおよびJSファイルは30日間キャッシュされることに注意してください。

WordPressの速度をさらに向上させたい場合は、WordPressの速度とパフォーマンスを向上させる方法に関するガイドをご覧ください。

ブラウザキャッシュの活用に関するFAQ

WordPressでブラウザキャッシュの活用に関する警告を修正するための、最も一般的な質問をいくつかご紹介します。これらの回答は、ブラウザキャッシュをよりよく理解し、発生する可能性のある問題をトラブルシューティングするのに役立ちます。

1. 「ブラウザキャッシュの活用」という警告の意味は何ですか?

「ブラウザキャッシュの活用」という警告が表示されるのは、ウェブサイトが将来の使用のためにユーザーのブラウザにファイルを保存していないためです。ユーザーがサイトの別のページにアクセスすると、ブラウザはすべての画像とスクリプトを再度ダウンロードする必要があり、ページの読み込み速度が低下します。

この警告は、ブラウザキャッシュを有効にすることでサイトの読み込み速度を向上させることができる場合に、Google PageSpeed InsightsやGTmetrixなどの速度テストツールに表示されます。基本的に、サイトのパフォーマンスを向上させる簡単な方法を逃していることを意味します。

2. ブラウザキャッシュの有効期限はどのくらいに設定すべきですか?

ほとんどのWordPressサイトでは、画像を1年後、CSSおよびJavaScriptファイルを1か月後、その他の静的ファイルを3〜7日後に期限切れに設定することをお勧めします。画像はめったに変更されないため、より長くキャッシュでき、CSSおよびJSファイルはより頻繁に更新される可能性があります。サイトのコンテンツとデザインを更新する頻度に応じて、これらの時間をいつでも調整できます。

ブラウザキャッシュを有効にするとウェブサイトが壊れますか?

いいえ、ブラウザキャッシュを有効にしてもウェブサイトが壊れることはありません。ブラウザキャッシュは、訪問者のブラウザにファイルがどのように保存されるかにのみ影響し、実際のウェブサイトファイルは変更されません。ただし、特にコードや.htaccessファイルを直接編集する場合は、サイトに変更を加える前に必ずバックアップを作成することをお勧めします。

4. ホスティングプロバイダーがキャッシュを提供している場合、キャッシュプラグインは必要ですか?

多くのホスティングプロバイダーは基本的なキャッシュ機能を提供していますが、WP Rocketのような専用のキャッシュプラグインは、通常、より包括的な最適化オプションを提供します。ホストレベルのキャッシュはサーバーサイドのキャッシュに焦点を当てることが多いですが、WP Rocketのようなプラグインはブラウザキャッシュ、ファイル圧縮、その他のパフォーマンス機能を処理します。両方を組み合わせて使用することで、最大の速度メリットを得ることができます。

5. ブラウザキャッシュを有効にした後も警告が表示されるのはなぜですか?

有効にした後もブラウザキャッシュの活用に関する警告が表示される場合は、いくつかの理由が考えられます。キャッシュ設定が正しく構成されていない、CDNが設定を上書きしている、またはテストツールがキャッシュされた結果をチェックしている可能性があります。サイトのキャッシュをクリアし、変更が反映されるまで24〜48時間待ってから、再度速度テストを実行してみてください。

6. ブラウザキャッシュはウェブサイトの更新に問題を引き起こす可能性がありますか?

ブラウザのキャッシュは、サイトを更新した後に訪問者が古いバージョンのサイトを見てしまう原因となることがあります。これは、ブラウザが新しいファイルではなくキャッシュされたバージョンを読み込んでいるために発生します。ほとんどのキャッシュプラグインは、サイトを更新したときにキャッシュをクリアすることでこれを自動的に処理します。必要に応じて、訪問者にブラウザキャッシュをクリアするように伝えたり、ハードリフレッシュ(Ctrl+F5)を使用して最新バージョンを表示するように促すこともできます。

追加リソース

この記事が、WordPressで「ブラウザキャッシュの活用」警告を簡単に修正する方法を学ぶのに役立ったことを願っています。ウェブサイトのパフォーマンスを向上させる方法に関する他のガイドも参照することをお勧めします。

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

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

コメント

  1. おめでとうございます。この記事の最初のコメント者になる機会を得ました。
    質問や提案はありますか?コメントを残して、議論を開始してください。

返信する

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。