mh2 
Webページを制作する中で、お客様から最も頻繁にいただくコメントは、「Webページを見ましたが、変更が反映されていません」というものです。比較的大きなデザインの変更を行った場合でも、以前のテキストや画像データが表示されてしまうことがあります。この問題の原因は、ブラウザのキャッシュ設定です。基本的なことから丁寧に解説をしていきます！
キャッシュとは？
キャッシュとは、ブラウザが一度ダウンロードしたものを再度必要になった場合に備えてハードディスク上に保持している場所です。通常、Webブラウザはページをデフォルトでキャッシュします。Webサイトを訪れると、ブラウザはページで参照されているコードと画像をキャッシュします。同じコードと画像を使用する他のページを訪れると、ブラウザはファイルをもう一度ダウンロードする必要がなくなります。ブラウザは単にハードディスクに保存されているキャッシュから読み込むことができるので、ページの読み込みが速くなります。
しかし、変更を加えた場合、キャッシュを更新して変更後のページを確認する必要があります。これによって、ブラウザに再度ページにアクセスし、変更や新しいコード、画像を検索させることができます。例えて言うと、降雨時の車の運転中にワイパーをかけないことと同じです。フロントガラスが水滴で埋まり視界がなくなってしまうので、ワイパーを使って視界を確保する必要があります。これと同じように、変更後のWebページを確認するためにはキャッシュを消去する必要があります。
お使いのブラウザは何ですか？
ブラウザには、Google Chrome、Firefox、Safari、Edge、Operaなどです。これらが主要なブラウザです。
主要ブラウザでのブラウザキャッシュのクリア方法
多くのユーザーがWebサイトを閲覧中に古いコンテンツが表示されたり、機能に問題が発生したりする問題を解決するために、ブラウザキャッシュをクリアすることができます。以下に主要なブラウザでのキャッシュクリアの手順を示します。
1. Google Chrome
- Chromeブラウザを開く。
- 右上隅の3つの垂直の点をクリック。
- 「その他のツール」をホバーし、「閲覧データの消去」を選択。
- 「全期間」を選択してすべてをクリア。
- 「Cookieおよびサイトデータ」と「キャッシュされた画像とファイル」のチェックボックスを選択。
- 「データを消去」をクリック。
2. Mozilla Firefox
- Firefoxブラウザを開く。
- 右上隅の3つの水平の線をクリック。
- 「オプション」を選択。
- 左サイドバーで「プライバシー＆セキュリティ」をクリック。
- 「Cookieおよびサイトデータ」が選択されていることを確認し、「データを消去」をクリック。
3. Safari
- Safariブラウザを開く。
- 画面左上の「Safari」をクリック。
- 「環境設定」を選択。
- 「詳細」タブを選択。
- 「開発メニューに”開発”メニューを表示」を有効にする。
- 「開発」メニューから「キャッシュを空にする」を選択。
4. Microsoft Edge
- Edgeブラウザを開く。
- 右上の3つの水平な点をクリック。
- 「設定」を選択。
- 「閲覧データを消去」の下で「消去する項目を選択」をクリック。
- 「キャッシュされた画像とファイル」が選択されていることを確認し、「消去」をクリック。
5. Opera
- Operaブラウザを開く。
- 画面右上の「簡単なセットアップ」ボタンをクリック。
- スクロールして「閲覧データの消去」をクリック。
- 消去する時期と削除するデータの種類を選択。
- 「データを消去」をクリック。
ブラウザキャッシュ以外の可能性
ブラウザ側（PC側）でなく、Webサイト側で問題が発生している場合もあります。その場合、原因がブラウザキャッシュではありません。別のデバイスで確認することで、ブラウザ側の問題か確認できます。
具体的には、タブレットやスマートフォンなどPC以外のデバイスでWebサイトを確認してみてください。キャッシュが残る問題が続くようでしたら、ブラウザキャッシュが問題ではない可能性があります。
WordPressでWebサイト構築をしていると、WordPress側のキャッシュが問題でキャッシュが残ることがあります。実は弊社でも、お客様側にキャッシュのクリアを依頼していたところ、弊社側（WordPress側）にキャッシュが残っていたため、古いデータが表示されることになったという痛い過去があります。
WordPressのキャッシュのクリア方法
WordPressサイトにアクセスする際、ユーザーのブラウザに転送されるWebコンテンツは、WordPress内に保存されたファイルを使用して組み立てられます。この組み立て作業と転送には時間と処理がかかるため、高速化のためにはキャッシュが活用されます。
WordPressのキャッシュは、特定の設定を行わない限り自動的に生成・保存され続けます。このため、CSSのカスタマイズが正しく反映されなかったり、Webコンテンツの表示速度が低下したりするトラブルがよく発生します。
以下に、WordPressのキャッシュを定期的に削除する方法を紹介します。
WordPressのキャッシュを削除するには、主に「コードを追加する方法」と「プラグインを使う方法」の2通りがあります。
1. コードを追加してキャッシュを削除する方法
WordPressサイトのHTML、CSS、PHPファイルにコードを追加して、キャッシュを自動的に削除する設定を行います。この方法はWordPress管理の作業効率を向上させますが、サイトの運営初心者にはお勧めできません。コードの修正には十分な知識と技術が必要であり、不慮のエラーやデータの消失の危険性があります。
2. プラグインを使ってキャッシュを削除する方法
プラグインはWordPressに追加できる拡張機能で、キャッシュを自動的に削除してくれるものもあります。プラグインを使用すれば、WordPressサイトの運営初心者でも簡単かつ安全にキャッシュを削除できます。
以下に、いくつかのWordPressのキャッシュを削除できるプラグインを紹介します。
- WP Super Cache
- WP Fastest Cache
- W3 Total Cache
プラグインを使用してWordPressのキャッシュを削除する手順は、プラグインの導入・有効化の似たような流れですので説明は割愛します。これら3つプラグインは機能的に大きな違いはなく、使いやすいものをお選びください。
まとめ
今回は、Webページを更新したのに古いページが表示された時の原因と解決方法について解説しました。
古いページが表示される原因のキャッシュと主要ブラウザでのキャッシュ削除の具体的手順をお示ししました。また、ブラウザのキャッシュで解決しない場合、Webページ（今回はWordPressに絞って）側のキャッシュの問題がある可能性もご紹介しました。
Webページの修正後、データが反映されていないと、せっかくの修正内容がお客様に伝わらず確認作業に余計な時間が取られてしまいます。今回ご紹介したように、ブラウザのキャッシュが原因である可能性が高いため、慌てずにまずはブラウザのキャッシュの削除を行ってみてください。