本日は、CSSが反映されない時の解決策であるスーパーリロードを、スマートフォンで行うための手順を解説します。
簡単な解説
ブラウザには、キャッシュという機能があります。
一度読み込まれたサイトは、ブラウザがキャッシュを残しているため、2回目以降はいちいちサーバまで情報をとりにいかなくても表示ができます。
これにより、読み込み速度の高速化が図られているのです。
詳しい解説と、PC版スーパーリロードのショートカットキーはこちらの記事にまとめてあります。
以降では、スマートフォンではスーパーリロードをどのように行うのかを解説していきます。
スマートフォンでスーパーリロードをする手順
本記事はiPhoneでの解説をしていきます。
Safariでスーパーリロード
①「設定」->「Safari」を選択する
②「履歴とWebサイトデータを消去」を選択する
これを実行すると、キャッシュだけでなくCookieまで消去されます。Cookieは簡単に言うとサーバ側で保存している、ログインした状態を保持などユーザデータのことです。Cookieだけでなく、開いているタブなどもすべて消えてしまうため、重要なタブは別ブラウザで開いておいたり、ブックマークに登録するなどしてください。
Google Chrome でスーパーリロード
① 画面右下の「設定」を選択する
②「プライバシー」を選択する
③「閲覧履歴データの削除」を選択する
④「閲覧履歴」と「キャッシュされた画像とファイル」を選択して「閲覧履歴データの削除」を選択する
これを実行すると、キャッシュだけでなくCookieまで消去されます。Cookieは簡単に言うとサーバ側で保存している、ログインした状態を保持などユーザデータのことです。Cookieだけでなく、開いているタブなどもすべて消えてしまうため、重要なタブは別ブラウザで開いておいたり、ブックマークに登録するなどしてください。
まとめ
CSSが反映されない時は、スーパーリロードをしてみましょう。
もし、スーパーリロードでも反映されない場合は、クラス名の誤字や、CSSセレクタが正しく指定できていない可能性があるので、コードを読み返してみてください。
最後までお読みいただき、ありがとうございました。
