以前CSSが聞かない方法について記事にしました。
でもスマホだとディベロッパーツールが開かないのでスーパーリロードできないのかなと…
スマホでもキャッシュを消すことができるんです!!
最初の部分はキャッシュの話なので、知っている人はスマホのところまでここからジャンプしてください。
キャッシュとは?
キャッシュについてはこちらで解説しています
簡単にいうと、ブラウザが次回同じページを開く時に、前回取得したページ情報を使うことで読み込みを早くする仕組みのことです。
キャッシュがないと…
キャッシュがある場合
スーパーリロードとは?
ふつうの再読み込みではキャッシュが残っているので、キャッシュ自体を消して最新の状態を反映させましょうというのがスーパーリロードです。
Chromeを例に話すと、ディベロッパーツールを開いた状態でリロードボタンを右クリックすると以下のように出るので「キャッシュの消去とハードの再読み込み」を押せば最新の状態に更新されます。
ちなみにショートカットはChrome、IE、Firefoxなら『ctrl + F5』、Safariなら『ctrl + shift + r』でスーパーリロードできるので覚えておきましょう。
スマホの場合
スマホの場合だとディベロッパーツールも開けなければ、キーボードもないのでショートカットもできません。どうすればいいのでしょう?
iPhoneでSafariスーパーリロード
iPhone使って実際にやってみましょう。
設定からSafariを選んでください。
下のほうの『履歴とWebサイトデータを消去』を押してください。
一応最後に注意点を書いてあるので、そこまでご確認ください。
iPhoneでChromeスーパーリロード
一番最初に言いたいのが、Chromeアプリでならできます。アイコンをよく確認してください。
Chromeアプリでページを開いたら、右下のアイコンから『設定』を選びます。
次の画面で『プライバシー』を選びます。
次に『閲覧履歴の消去』を選びます。
最後に『閲覧履歴』と『キャッシュされた画像とファイル』を選んで『閲覧履歴の消去』を押します。
スマホでやる場合の注意点
特にSafariですが、キャッシュだけでなくCookieまで消去されます。Cookieについてはまた別の機会にお話しします。
Cookieだけでなく開いているタブなどもすべて消えるので消去する前にブクマするなどしておきましょう。
キャッシュに関してはWeb制作で躓く原因になるので、PC版・スマホ版ともに知識として覚えておきましょう。
CSSが反映されない場合は他にもあるので、併せて確認しておきましょう。
コメント
クッキーはサーバー側では保存されてません
ご連絡ありがとございます。
この記事を書いた当時、学習しながら書いていた中で私自身が誤解しておりました。
修正させて頂きます。
重ね重ね、ご連絡頂きありがとうございました。