WordPressサイトをスピードテストツールで実行したことがあるなら、「ブラウザキャッシュを活用する」という警告が表示されたことがあるかもしれません。私たちは、最適化プロセスにおける重要な部分として、WordPressのパフォーマンスを最適化するために、すべてのサイトでブラウザキャッシュを有効にしています。
ブラウザキャッシュは技術的に聞こえるかもしれませんが、その概念はシンプルです。訪問者のブラウザに特定のファイルをローカルに保存するように指示し、将来の訪問時に再度ダウンロードする必要がないようにします。これにより、ページの読み込み時間が半分になり、訪問者の満足度向上と検索エンジンのランキング向上につながります。
この警告を修正するために開発者である必要はありません。簡単なプラグインソリューションから手動でのコード調整まで、WordPressサイトでブラウザキャッシュを有効にするためのいくつかの簡単な方法を紹介します。このガイドの終わりまでには、サイトが高速化され、心配する警告が1つ減っているはずです。
WordPressにおけるブラウザキャッシュとは？
ブラウザキャッシュは、WordPressウェブサイトの読み込み速度を向上させる方法です。
通常、ウェブページが読み込まれるとき、すべてのファイルは個別に読み込まれます。これにより、ブラウザとWordPressホスティングサーバー間で複数のリクエストが発生し、ウェブページの読み込み時間が長くなります。
ブラウザキャッシュが有効になっている場合、ウェブブラウザはウェブページのコピーをローカルに保存します。これにより、ユーザーがサイトの2ページ目にアクセスした際に、スタイルシート、ロゴ、画像などの一般的なファイルをブラウザがより速く読み込めるようになります。
これにより、実際のサーバーへのリクエスト数が少なくなり、サーバー全体の負荷が軽減され、結果としてパフォーマンスの最適化とユーザーエクスペリエンスが向上します。
「ブラウザキャッシュを活用する」という警告はどこに表示されますか？
「ブラウザキャッシュの活用」という警告は、ブラウザキャッシュが有効になっていないか、キャッシュの設定が間違っていることを意味します。
GTmetrixやGoogle PageSpeed Insightsのようなツールを使用してウェブサイトの速度テストを実行すると、WordPressを高速化するために修正できることを示すレポートが表示されます。
ウェブサイトで現在ブラウザキャッシュを使用していない場合、ブラウザキャッシュを有効にするように警告が表示されます。
これは、ページスピードインサイトツールから結果を見ているときの表示例です。
「効率的なキャッシュポリシー」が機能していないという警告が表示されることがあります。
これらの警告は両方とも、ブラウザキャッシュの設定に関するエラーを指しています。
「ブラウザキャッシュを活用する」という警告が表示された場合、サイトを高速化するためにキャッシュルールを有効にしてカスタマイズする必要があることを意味します。
それを踏まえて、WordPressで「ブラウザキャッシュの活用」警告を簡単に修正する方法を2つの異なる方法で見ていきましょう。使用したい方法を選択するには、以下のクイックリンクを使用してください。
方法1：WP Rocketで「ブラウザキャッシュを活用する」警告を修正する
WP Rocketは、市場で最高のWordPressキャッシュプラグインです。初心者にも使いやすく、複雑なキャッシュやスピードの用語を知らなくても、サイトをスピードのために最適化するのに役立ちます。
そのままの状態でも、推奨されるすべてのキャッシュ設定により、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サーバーを使用しているかどうかを確認する必要があります。
これを行うには、新しいタブまたはウィンドウでウェブサイトを開きます。次に、右クリックして「検証」オプションを選択します。
次に、ページ上部の「ネットワーク」タブをクリックします。
結果を読み込むには、ページを更新する必要がある場合があります。
その後、「名前」列のドメイン名をクリックします。
ページの上部にあるはずです。
次に、「レスポンスヘッダー」セクションで、「server」という項目が表示され、サーバーの種類が表示されます。
この場合、サイトはApacheサーバーで実行されています。
ApacheでCache-ControlおよびExpiresヘッダーを追加する
Apacheサーバーで「ブラウザキャッシュの活用」という警告を修正するには、.htaccessファイルにコードを追加します。
このファイルを編集するには、FTPクライアントまたはホストのファイルマネージャーツールを使用して、WordPressホスティングアカウントに接続する必要があります。
接続後、ウェブサイトのルートフォルダにある.htaccessファイルを確認できます。
見つからない場合は、心配しないでください。このファイルは非表示になっている場合があります。詳細については、WordPressサイトで.htaccessファイルが見つからない理由に関するガイドをご覧ください。
次に、ブラウザキャッシュをオンにするために、cache controlおよび/またはexpiresヘッダーを追加する必要があります。これにより、ウェブブラウザはウェブサイトのリソースを削除する前にどのくらいの期間保存すべきかがわかります。
- cache-controlヘッダーは、キャッシュをどのように行うべきかについて、ウェブブラウザに具体的な詳細を提供します。
- expiresヘッダーはキャッシュを有効にし、ウェブブラウザに特定のファイルが削除される前にどのくらいの期間保存すべきかを指示します。
次のコードを.htaccessファイルに追加すると、expiresヘッダーを追加できます：
## 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 ##
このコードは、ファイルの種類に基づいて異なるキャッシュ有効期限を設定します。
その後、以下のコードを追加してキャッシュ制御を有効にできます。
<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$">
Header set Cache-Control "max-age=96000, public"
</filesMatch>
このコードは、キャッシュの更新が必要になる有効期限を設定します。上記の例では、キャッシュは90,000秒で期限切れになります。
ファイルを編集したら、必ず保存してください。その後、ウェブブラウザは新しいバージョンのファイルを要求します。
NginxでCache-ControlおよびExpiresヘッダーを追加する
WordPressサイトをホストするためにNginx Webサーバーを使用している場合、サーバー設定ファイルを編集することでブラウザキャッシュエラーを修正できます。
このファイルを編集およびアクセスする方法はホストによって異なるため、ファイルへのアクセスにヘルプが必要な場合は、ホスティングプロバイダーに問い合わせることができます。
次に、以下のコードを追加して有効期限ヘッダーを追加する必要があります。
location ~* \.(jpg|jpeg|gif|png|svg)$ {
expires 365d;
}
location ~* \.(pdf|css|html|js|swf)$ {
expires 3d;
}
このコードは、さまざまなファイルタイプの有効期限を設定します。画像は通常そのままなので、HTML、CSS、JSなどの他のファイルタイプよりも長くキャッシュされることに注意してください。
その後、以下のコードを追加してキャッシュ制御ヘッダーを追加できます。
location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico)$ {
expires 14d;
add_header Cache-Control "public, no-transform";
}
このコードは、キャッシュが期限切れになる時間を設定します。上記のファイルタイプは14日間変更されないことをサーバーに伝えます。
WordPressの速度をさらに向上させたい場合は、WordPressの速度とパフォーマンスを向上させる方法に関するガイドをご覧ください。
ブラウザキャッシュの活用に関するFAQ
WordPressでブラウザキャッシュの活用に関する警告を修正するための、最も一般的な質問をいくつかご紹介します。これらの回答は、ブラウザキャッシュをよりよく理解し、発生する可能性のある問題をトラブルシューティングするのに役立ちます。
1. 「ブラウザキャッシュの活用」という警告の意味は何ですか？
「ブラウザキャッシュの活用」という警告は、WordPressサイトが訪問者のブラウザに、将来の訪問のためにファイルをローカルに保存するように指示していない場合に表示されます。この警告は、ブラウザキャッシュを有効にすることでサイトの読み込み速度が向上する可能性がある場合に、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ホスティングに関する専門家のおすすめもご覧ください。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
質問や提案はありますか？コメントを残して、議論を開始してください。