標準的なディスプレイに最適な Web サイトの幅は、ここ数年で 800 から 1024+ ピクセルに増加した (Web サイトの幅は通常 960 ピクセル) ことは一般的に認められていますが、モバイル デバイスの台頭により、どの解像度が「重要」であると考えられています。対応する？
たとえば、この Web サイトには、ブラウザーの幅に応じて 5 つ (!) の異なるレイアウトがありますが、ほとんどは 2 つしかないように見えます。
サイトの応答性を高めたい場合に、少なくとも対応する必要がある、一般的に合意されている一連の幅はありますか? もしそうなら、それらは何ですか?
私はBootstrapがそれを行う方法に概ね同意します- 1 つは大型デバイス用、1 つは中型デバイス用、もう 1 つは大型モバイル デバイス (タブレットなど) 用、最後にもう 1 つは携帯電話デバイス用 (電話の画面解像度と画面サイズは国によって異なるため)。場所）。
これらは：
超小型デバイス
電話 (<768px)
小型デバイス
タブレット (≥768px)
中型デバイス
デスクトップ (≥992px)
大型デバイス
デスクトップ (≥1200px)
ところで、Bootstrap IMO は、基本的にどんなものでも動作するレスポンシブ Web サイトを作成するための最高の CSS フレームワークです (CSS をカスタマイズして、サイトをより独創的に見せることを忘れないでください)。
コンテンツによって異なります。コンテンツがブレークポイントを駆動する必要があります。あらかじめ定義されたセット ブレークポイントを使用すると、コンテンツについて、さらにはコンテンツが表示されるデバイスについて想定を行うことができます。既存のレスポンシブ グリッドがある場合は、それが提供する既存のブレークポイントを使用する必要があるかもしれませんが、理想的にはその逆を行います。サポートされている最も狭い幅から始めて、次のようにレイアウトを変更する意味がある場所を見つけます。ビューポートの幅が大きくなります。事前にいくつのブレークポイントを使用または定義する必要があるかについて、もはやルールや「業界のベスト プラクティス」さえありません。