キャッシュが残っているなど、何かと耳にする言葉だと思いますが、具体的にはキャッシュはどのような仕組みなのでしょうか。
ここでは、キャッシュのメリットや設定するポイントまで、キャッシュについてわかりやすく解説します。
マーケティングでお悩みの方へ
目次
キャッシュとは
キャッシュとは、ブラウザが一度表示したページのデータを保存する機能です。
ブラウザ側でCSSやjavascript等を保存するため、再度ページにアクセスした際にデータを再利用し、初回アクセス時より高速にページを表示することが可能になります。キャッシュの有効期限を指定した場合、指定した期間内はキャッシュされている情報が強制的に反映されます。
なお、キャッシュと似た仕組みとして、Cookie（クッキー）があります。
CookieはWebサイトに訪問したユーザー側の情報を一時的に保存するものです。閲覧にログインが必要なWebサイトで、IDやPASSの入力を省略したり、ECサイトで購入したい商品をカートに残したまま買い物を続けたりといった機能のために使用されます。
キャッシュを設定するメリット
キャッシュを使用することで、再度同じページにアクセスした際により速くページを表示させることが可能になるため、ユーザー体験の向上につながります。
トラフィックが多いサイトほど効果的といえます。また、再アクセスした際の受信データを軽くできるので、パケット通信時の通信費を抑えることも期待できます。
キャッシュの設定のポイント
キャッシュ設定のポイントを確認しておきましょう。
キャッシュの有効期限を設定する
キャッシュ時のデータを再利用してページを表示するため、キャッシュ後にページ内容が変更されると、最新の内容が正しく表示されない場合があります。
それを避けるため、サイトの更新頻度に合わせた適切なキャッシュの有効期限を設定することが望ましいです。具体的には、ニュースサイトのような日々更新するサービスでは有効期限を短く設定し、比較的更新頻度の低いコーポレートサイトのようなサイトは有効期限を長めに設定する、などが考えられます。
また.htaccessを利用して、ファイルタイプごとにキャッシュの有効期限を変えることができます。これを活用することで、同じサービス内でも、たとえばユーザー情報や商品マスタといった比較的スタティックな情報には長い有効期限を設ける、などの工夫が可能です。
キャッシュを最新状態にする
キャッシュの有効期限が設定されていないページの場合、ユーザー側でキャッシュした後にページ内容が変更されると、ユーザーはキャッシュを最新状態に更新しなければなりません。Webサイトの管理側としては、ページ内容を更新した後、ブラウザで該当ページを表示してキャッシュの影響を確認しましょう。
ページが正しく更新されていなかったら、リロードを実行します。リロードボタン（丸い矢印のボタン）は、多くのブラウザで左上部に位置しています。
リロードをしても正しく更新されない場合は、スーパーリロードを試してください。スーパーリロードは、キャッシュを無視してサーバーから強制的にファイルを呼び出す方法です。
スーパーリロードは、Windowsであれば、ctrlキーとF5キーの同時押し、もしくはShiftキーを押しながらブラウザのリロードボタンを押します。Macであれば、CommandキーとRキーの同時押し、もしくはCommandキーとShiftキーとRキーの同時押しです。
キャッシュの設定方法
サーバー側で.htaccessが設定可能な場合、ExpiresヘッダーやCache-Control ヘッダーを使って、キャッシュの有効期限を設定することができます。
Expiresヘッダーでは有効期限を年月日時で指定します。一方Cache-Controlヘッダーの場合は、日時指定ではなく、サーバーがレスポンスを受け取ってからキャッシュを削除するまでの期間を秒数で指定します。
また、.htaccessを設定せずとも、HTMLソースのhead内にmetaタグとしてcache-controlやexpireを設定することで、有効期限を設定することができます。
＼最新Webマーケ情報を配信！無料メルマガ登録はこちらから／
ブラウザキャッシュの削除方法
ユーザー側からすると、キャッシュが溜まりすぎてブラウザの動作が重くなってしまうことがあります。キャッシュの蓄積によってブラウザの挙動に不具合を感じるようであれば、キャッシュをブラウザから削除してみましょう。ブラウザキャッシュをクリア（削除）する方法は、ブラウザごとに異なります。
ここでは、主なブラウザごとのキャッシュの削除方法を紹介していきましょう。
Chromeのキャッシュ削除方法
- ブラウザ右上部の「︙」をクリック
- 「その他のツール」から「閲覧履歴の消去」 を選択して、「閲覧履歴データの削除」を表示させる
- 「期間」のプルダウンから任意の削除期間を選択
- 「キャッシュされた画像とファイル」 にチェックを入れ、「データ削除」 ボタンをクリック
なお、iOSやAndroid上でのChromeでは、
- メニューバーにある「︙」をタップ
- 「履歴」から「閲覧履歴データを削除…」を選択
- 期間（1時間以内～全期間）を選択して、「キャッシュされた画像とファイル」のチェックボックスにチェックを入れる
- 「閲覧履歴データの削除」をタップ
という手順でキャッシュを削除できます。
Edgeのキャッシュ削除方法
- ブラウザ右上部の「…」マークをクリック
- 「設定」をクリックし、設定画面を表示させる
- 左メニュー内の「プライバシー、検索、サービス」を選択
- 「閲覧データをクリア」の項目内にある「ブラウザーを閉じるたびにクリアするデータの選択する」をクリック
- 次ページの「キャッシュされた画像とファイル」にチェックを入れ、「今すぐクリア」をクリック
Safari（mac版）のキャッシュ削除方法
- 「Safari」メニューから「環境設定…」を選択する
- 「詳細」をクリックし、「メニューバーに”開発”メニューを表示」にチェックを入れる
- メニューバーに表示された「開発」を選択し、 「キャッシュを空にする」をクリック
また、iOS上のSafariでは、
- iPhoneやiPad上の「設定」をタップ
- Safariを選択し、「履歴とWebサイトデータを消去」をタップ
- 「履歴とデータを消去」をタップ
という手順でキャッシュを削除できます。
Firefoxのキャッシュ削除方法
- ブラウザ右上部のメニューボタンをクリック
- メニュー一覧から「オプション」を選択し、「プライバシーとセキュリティ」をクリック
- 手動で任意のキャッシュを削除する場合は、 「Cookieとサイトデータ」項目内の「データを消去」をクリック。自動でキャッシュを削除する場合は、「履歴」の項目内、「Firefoxの終了時に履歴を削除する」にチェックを入れる
なお、Firefoxでは、Ctrlキー、Shiftキー、Deleteキーの同時押しで、「最近の履歴を消去」パネルが表示させて、キャッシュを削除することも可能です。
補足
キャッシュの他にサイトの高速化について、さらに詳しく知りたい方はこちらもご参照ください。
参考：Webサイト高速化・表示速度改善のために知っておきたい基礎知識
集客・コンバージョン数を増やしたい方へ
