Google chromeデベロッパーツールでスマホ表示(レスポンシブデザイン)が確認出来ない!

先日、業務でDebug(各ブラウザの表示確認等)やクライアント提出資料を作成していた際にPCとSPで見比べるのに便利な、Google chromeデベロッパーツールというものやらを使用してみようと思いました。


Winの場合、「F12」キーを押したらデベロッパーツール開きます。

そこにある「スマホアイコン」を押すと簡単に各デバイスごとの見え方が確認できる!と、思いきや。。

何かしらのエラーが出て、通常のPCサイトをスマホで閲覧した。のような見え方にしかならない。

「SPサイト対応してないんですかね。」と、隣で作業していた先輩につぶやいてみると、「いや。普通にSPサイトあるよ。」と言われ、どうやら私のPCがおかしいらしい。ということに気が付きました。


セキュリティの問題では?Cookieが残っているのでは?と、いろいろやってみましたがダメでした。

その時は、諦めてバカらしいがSPからキャプチャ撮ってPCに転送し、資料を作成しました。

(めっちゃ面倒くさかった。)


本日、改めてトライしてみてググったところ、ついにこの問題を解決する記事を見つけました。

結論から言うと、「Ctrl + F5」でスーパーリロード、フルリロードを行ったら問題なくレスポンシブ表示確認ができるようになりました。


詳細に関しては、下記記事をご覧ください^^

筆者さん、どうもありがとう!

0コメント

  • 1000 / 1000