質問: 大変初歩的な質問で恐縮です。 現在15.6-インチのPCでコーディングをしています。 横幅が1500px以上あるのですが、一般的なPCは13インチ(1000pxほど)だと認識しています。 この場合は、画面幅を考えると一般的なPCである「横幅1000px」ほどに画面を縮めて、 横幅1000pxの画面をベースにコーディングするものなのでしょうか? というのも、1500pxベースで作成したとすると、 1000pxだと多少のずれが生じてしまい綺麗なサイトにならないからです。 とはいえ、画面を縮めながらコーディングしたり、 「@media (max-width: 992px)」などを入れるのも時間がかかるなと思っております。。。 一般的にはどのようにコーディングしているのか疑問に思いました。 一応以下のレスポンシブには対応しているので、 タブレットとスマホは問題ないです。 ``` @media screen and (max-width: 896px) } @media screen and (max-width: 575px) } ``` 宜しくお願い致します。
回答: > > 横幅1000pxの画面をベースにコーディングするものなのでしょうか? > > > 多少ズレが有るのを許容するか、幅によらないデザインにできるのであれば、ブレークポイントは省略しますし、 ズレを許せないのであれば、もちろん想定通りになるようにブレークポイント別にしっかり実装します。 ので、あなたやサイトの要件次第になるかと思います > > とはいえ、画面を縮めながらコーディングしたり、 > > > !イメージ説明 Chrome であれば Devtools を利用して、画像上部で画面幅を変更できます `| | | | | | | |` のようなところで一般的な画面幅に設定できます。 ちなみにその設定だと `320px` /.../ `768px` / `1024px` / `1440px` / `2560px` で分割されています。(ので、そのあたりをブレークポイントとするのが一般的なのかと > > 横幅が1500px以上あるのですが、一般的なPCは13インチ(1000pxほど)だと認識しています。 > > > ちなみにこれはそうでもない気がします