今回はブラウザに保存されるクッキー情報によって一時的に保存されている情報(キャッシュ)を消して正当な最新情報を読み込む(スーパーリロード)に関して紹介します。
WEBサイトを更新した時、更新をかけて最新情報を見ようとした時に編集前の情報が表示されてしまうといった場面は経験した事があると思います。ブログ運営では、CSSを変更した時などに多く起きるかと思います。
これは「キャッシュ」と言われるブラウザの仕組みが原因です。
キャッシュ (英: cache) は、CPUのバスやネットワークなど様々な情報伝達経路において、ある領域から他の領域へ情報を転送する際、その転送遅延を極力隠蔽し転送効率を向上するために考案された記憶階層の実現手段である。実装するシステムに応じてハードウェア・ソフトウェア双方の形態がある(今後コンピュータのプログラムなども含め全ての転送すべき情報をデータと表す)。
https://ja.wikipedia.org/wiki/キャッシュ_(コンピュータシステム)
要するに、ブラウザにはキャッシュと言われるデータの保存場所が存在し、同じアドレスにアクセスした際にサーバーを介さずにそのデータを読み込み、表示速度を速くする事が出来るのです。
この様な仕組みがSafari、ChromeなどのWEBブラウザには標準で付いてきています。ただ、サイトの改修作業や、CSSの追加などでキャッシュデータが読み込まれると邪魔で仕方ありません。
そこでキャッシュを消して正当な最新情報を読み込む必要が出てきます。
キャッシュの消し方
今回は、有名どころのSafariとChromeのキャッシュの消し方を紹介します。
Safariのキャッシュ
Safariのキャッシュを消す場合は画面上のタブメニューの開発から行います。そこにある「キャッシュを空にする」を押せば完了です。

もしくは、ショートカットキーの「Command + R」で可能です。(Windowsの場合「Ctrl + Shift + R」)
タブメニュー左の「Safari」にある「履歴を削除…」はキャッシュはクリアされないので注意が必要です。

Chromeのキャッシュ
Chromeのキャッシュを消したい場合は画面上のタブメニューの「Chrome」の「閲覧履歴を削除…」から行います。

「閲覧履歴を削除…」を押すと設定画面に移るので下記の「プライバシーとセキュリティー」の「閲覧履歴データの削除」を開きます。

「閲覧履歴データの削除」 の中の「キャッシュされた画像とファイル」にチェックを押して「データを削除」のボタンを押したら完了です。

もしくは、ショートカットキーの「Command + Option + R」で可能です。(Windowsの場合「Ctrl + Shift + R」)
この様なキャッシュをクリアして更新(リロード)を行うことを「スーパーリロード」と言います。
スマホの場合
スマホの場合は設定→Safari→履歴とWEBサイトのデータを消去からキャッシュの削除を行えます。(下記写真部分)

キャッシュを消したのに最新情報が反映されない場合
たまに以下の理由で根強いキャッシュが残ってしまっているため、最新情報が正常に読み込まれない場合もあります。
- サーバー側でキャッシュを読み込んでいる
- CSSを個別でキャッシュしている
このような理由で最新情報が正当に読み込まれていないと感じた場合は、ブラウザのプライベートモード(シークレットモード)を使用しましょう。
プライベートモード(シークレットモード)に関しては以下の記事で詳しく書いています。
最後に、純粋に修正出来ていなかったってパターンもあり得るので、修正をしっかり保存しているかも確認しましょう。
以上が「ブラウザのキャッシュを消す方法(SafariとChrome)」でした。
キャッシュに関してはブログ運営、WEB制作では必須な知識です。またショートカットキーも頻繁に使うので必ず覚えておきましょう。