[雑記]レスポンシブのブレイクポイントはどこで区切ると良いのだろうか

レスポンシブデザインはメディアクエリで何段階かに区切るのが一般的だと思います。

問題はその区切りの位置をどこにすればよいのか？最低限PCとスマホで区切れば良いのだろうけど、何を基準して設定すればよいのやら・・・・。

色々調べてみると多種多様なパターンがあるようで、これという正解はないけど２～４パターンに抑えるのが主流っぽいですね。

その中でもよく見かけたのが、
1. 「480px、768px、980px」
2. 「600px、960px」

前者はiPhoneやiPadなど代表的なデバイスに合わせた考え方で、いまだとiPhone7とiPad縦が基準になってるのかな？そして後者がデバイスに依存しない考え方で、海外サイトの影響を受けているらしく600pxが多かった。

前者は昔からの考え方で多くの場所で見かけました。でも最近はデバイスも多様化していて、下手に依存するのは難しくなってきているようですね。後者の流れが広がってきているようですし、うちも特定の後者の考え方で行こうと思います。
関連記事

コメントの投稿

非公開コメント

« 前の記事  ホーム  次の記事 »
ページトップへ