回答:
レスポンシブデザインは、画面解像度と画面サイズのどちらにも基づいていません。代わりに、レスポンシブデザインはコンテンツとその作成方法に基づいており、すべてのサイズと解像度に対応できます。
レスポンシブデザインについての考え方が間違っています。私はあなたがより一般的な印刷デザインの背景から来ていると思います、そうですか？ウェブ向けのデザインは、はるかに自由です。レスポンシブWebサイトでは、通常のブレークポイントや特定のサイズ/解像度が用意されていないことがよくあります。これは、Webがそれ以上のことを可能にするためです。つまり、すべての画面サイズに到達できます。したがって、妥当な範囲内であれば、設計しているものに適したサイズを使用して設計できます。
ことでは言って、ベストプラクティスは、中に設計することで、モバイル・最初は本当に命名されるべき方法、モバイル-最も重要。これにより、最も重要かつ可能であるコンテンツに集中することが強制され、大きい画面から始めて、小さい画面用に設計するときに削除するのではなく、大きい画面にさらに追加することができます。これについて詳しくは、私のレスポンシブデザインプライマーをご覧ください。
しかし、責任感を考慮した方法で設計する必要もあります。そのベストプラクティスは、PSDのような静的ドキュメントではなく、プロトタイプ形式であれ、ワイヤーフレーミングプログラムであれ、実際の例です。開発者側では、レスポンシブユニットを使用して、意味のある方法でコードを構造化する必要があります。
そうは言っても、あなたは物事を画面のサイズではなく、ピクセル、つまり解像度を意味するものとして置くべきです。
確かに素晴らしい質問です！
ここで私たちが今日直面している矛盾に少しコメントしているいくつかの考え。
テクノロジーは古くからあるべきものではありません。
私たちは皆、実際の単位（または予想されるサイズ）に基づいて設計する必要があります。ある程度の柔軟性と、ユーザーが追加の調整を行えるように自由度があります。
しかし、実際の測定値を知るには、両方の情報が必要です。物理的寸法とデバイスの解像度=ピクセル密度。
しかし、ちょうど数年前に、画面デバイスがピクセル密度を宣言し始めていることが変わります。そしてそれをサーバーに宣言しない人もいますが、それについて多くの宣伝をするだけです。（別名Ipad、Iphone）
それに応じて信号を送信することが不可欠であるため、ディスプレイの解像度はオペレーティングシステムによって検出できますが、画面の実際のサイズでは、各モデルの巨大なデータベースが必要です。良くない。
それは私たちが知ることができるいくつかの情報であるこの画面解像度だけを私たちに残します。
しかし、大型のFullHDモニター向けに設計することは、モバイルデバイスの同じ解像度よりもまったく異なります。1920x1080。痛い。
特殊なケースは、プロジェクタでは、投影距離と視聴者の距離の手掛かりがないためです。
部分的な解決策は、メディアクエリ、ベクトル要素などです。
ウェブデザインの場合：少なくともより良いものが見つかるまで。
流体設計（パーセンテージ）と自然流、明確に定義されたセクション。
1920ワイド
おそらく1280のメディアクエリ
および/または1024
おそらく720で
と480。
追加のサポートのためのデバイス検出付き。
モバイルネイティブアプリの場合
非常に具体的であるため、UIとアイコンに関しては、ブランドのガイドラインに従ってください。
編集。
FullHDモバイルデバイスで小さい画面解像度を選択する理由
スマートフォンの実際の解像度はFullHDですが、通常はサーバーとブラウザーに対して小さな解像度を宣言しています。メディアクエリが機能するように、このグーグルhttps://www.google.com/search?q=what+is+my+screen+resolutionをテストできます。
まず、回答と貴重なガイドラインをありがとうございました。
私の結論を追加させてください：
実際には、モバイル画面の解像度をターゲットにするのは適切なUXではありません。解像度が小さすぎて画面が高すぎる、フォントが小さすぎて読めない、アイコンが小さすぎてクリックできないなどです。
したがって、実際のビューポートサイズに基づいてデザインを作成することをお勧めします。このように、ユーザーが何を見て感じることができるかに基づいています。
実際にこれを実現するには<head>、HTMLドキュメントの内部にビューポート幅メタタグを追加する必要があります。
<meta name="viewport" content="width=device-width, initial-scale=1.0">これは、ブラウザに画面の幅と同じ幅でページをレンダリングするように指示するため、HTMLページの幅がピクセル単位で画面の幅と確実に等しくなります。次に、さまざまなモバイルビューポートサイズ（互いに近い）をターゲットとするメディアクエリを使用して開発を簡単に計画でき、より視覚的に明確な要素を作成できます。
私が間違っていたら訂正してください。
私の謙虚な経験に基づいて、私はより良いレスポンシブなウェブサイト開発のために以下のステップを提案します：
1-ビューポートメタ（上部を参照）を使用すると、グーグルによるモバイル検索結果でのWebページのランキングも向上します。 http://googlewebmastercentral.blogspot.com/2015/04/faqs-april-21st-mobile-friendly.html
テスト後、ビューポートメタのみを追加すると、モバイルテストツールでWebサイトのグレードが得られるようです https://developers.google.com/speed/pagespeed/insights/
2-モバイルファーストアプローチの適用を検討する必要がある場合があります。小さいよりも大きいほうが常に簡単です（Webサイトの複雑さによって異なります）。
3-これを達成するために、適応型（流体）と応答型（cssメディアクエリ）の混合であるハイブリッド応答型システムを適用します。
幅と水平マージン/パディングにはパーセンテージを使用します。（必要に応じて、垂直マージンは固定ピクセルサイズにすることができます。スクロールはもはや問題ではありません）
フォントにemを使用します。メディアクエリで本文（またはhtml）のフォントサイズを変更すると、すべてのCSS要素がそのサイズに適応します。pxを使用すると、CSSクラスごとに移動する必要があるため、悪夢になります。フォントサイズを変更します。
divを左にフロートして、使用可能なスペースに正しく位置合わせします（デザインに必要な場合は右）。
4- ブレークポイントを定義し、応答性の高いテストツールを使用します。私はFirefoxのレスポンシブデザインビューを使用しています。ウェブサイトに障害が発生するポイント（例：500px）に達するまで幅を狭めるだけです。
そのブレークポイント（500px）のメディアクエリ内に新しいCSSルールを適用します。
5- ウェブサイトの品質と明確さを保つことを忘れないでください！要素が不明瞭になり、相互に近づきすぎた場合は、要素の幅を拡張してコンテナの幅を占め、垂直に積み重ねます。
そして、すべてのサブ要素がより大きなフォントを継承して読みやすくなるように、ボディに新しいフォントサイズを与えることを忘れないでください。
6-レスポンシブテストを繰り返して、2番目のブレークポイントを定義します。ここでは、流体設計を使用しているため、多くのブレークポイントを取得できません。
私は以前に重いデザイン要素のある大きなウェブサイトで働いていました、そしてそれは2つのメディアクエリだけを必要としました:)
それが役に立てば幸い
レスポンシブページのリフローは、仮想ピクセル（実際のピクセルではない）でのビューポート（画面ではない）のサイズに基づいています。
1仮想ピクセル= 1実ピクセルである従来のデスクトップでは、ブラウザーの幅が1000pxに設定されている場合、ページはそれに合わせてリフローされます。
iPhone 6では、1つの仮想ピクセル（Appleはこれらのポイントを呼び出します）= 3つの実ピクセルです。ブラウザの幅は画面の幅であり、コンテンツは417pxの幅に合わせてリフローします（実際には1242の実ピクセルです）。
それは上記の例と、その中に、ビットは奇妙であるので、少ないとデバイス実画素が実際と見なすことがより広い応答レイアウトのビューポート。