モバイルメニューに切り替えるブレークポイントの幅は？
それは明白で明確な答えを持っているように聞こえますが、私はそれについて多くの言及を見つけることができませんでした：ウェブサイトを構築するとき、どのブレークポイント/幅が水平タブスタイルのナビゲーションメニューから垂直トグルに切り替えるのに最も理想的ですか「ハンバーガー」アイコンの後ろに隠されたモバイルメニュー？
私は主に1200pxのコンテナー幅でWebサイトをデザインしているように見え、それ以下のデスクトップ/ラップトップコンピューターの画面サイズは多くないので、モバイルメニューをその1200px幅以下で起動しています。ワークフローを多少簡略化します。
しかし、それは良い習慣ですか？より低いブレークポイントを好むデバイスユーザーのオーディエンスはいますか？たぶん横向きのiPadユーザーは「通常の」メニューを好むでしょうか？
デスクトップを含め、すべての幅で折りたたみ可能なモバイルスタイルのメニューがあるウェブサイトを見たので、ケースバイケースで目的のUXになると思いますが、予期しない考慮事項を知っておくと役立ちます。
モバイルブレークポイントを忘れて、マーケティングの外部にphoneとtablet sizeはありません。ブレークポイントは、画面サイズではなく、コンテンツに続く必要があります。
簡単な例として、メニューを考えてみましょう：
Home | Products | Contacts
mobileメニューを提供する必要があると思いますか？ハンバーガーメニューに3つの要素を入れたいですか？おそらく>=320pxの画面にぴったり収まります。
一方、次のメニューがあります。
Home | TVs | Tablets | Notebooks | Printers | Air Conditioners | Routers | Help
より早く調整する必要があります。しかし、同時に、ハンバーガーを<1000pxに表示して、1行に収まらないようにしますか？
Priority + pattern のような他のナビゲーションオプションを探ります。
補足として、これはすべてのサイトパーツに適用されます。 モバイルレイアウトに切り替えるだけではありません。コンテンツが<700pxの状態に完全に適合している場合でも、400pxに到達したからです。 Google Web Fundamentalsには、これに関するページがあります。
特定のデバイス、製品、またはブランドではなく、コンテンツに基づいてブレークポイントを作成します。
From： ブレークポイントの選択方法