レスポンシブデザインの確認で、デベロッパーツールのデバイスモードを使わない理由
2024-05-14
パソコンのブラウザで、デザインの確認をする際に
デベロッパーツールのデバイスモードを勧められることが多いと思うけれど
私は、基本、デベロッパーツールのデバイスモードは使わない。
↓デベロッパーツールのデバイスモード【赤枠】
スマホの確認では、100歩ゆずって
レスポンシブのデザインの確認では、
ブラウザの幅を拡大＆縮小させて、980px～1920pxの間で確認した方がいいと考えている。
なぜなら、ブラウザ幅100％(ブレイクポントぴったり)で閲覧していない人も多いから。
例えばMACでは、ブラウザ100％ではなく、
適当な幅のブラウザをいくつも重ねて、閲覧していることが多いかと。
なので、レスポンシブデザインの確認は
デベロッパーツールの左上に表示されている幅を確認しながら、
ブラウザ幅を拡大＆縮小させて、どんな幅でも崩れることのないようにチェックしている。
そしてそのまま、スマホの幅まで縮小させ
レイアウトに問題なければOKかな、と。
というのも、デベロッパーツールのデバイスモードではちゃんと表示されているのに
ブラウザ幅の縮小だと崩れる作りのものもあって
自分的には、そこが、なんだかモヤっとするのであります(´･ω･`; )
←「WordPressのアップデートについて」前の記事へ 次の記事へ「FigmaやChat GPT-4o・・・便利すぎ。」→