現代の脱ホバー・脱セーフトライアングル UI 3型
タッチ端末とPCの両立を狙い、マウスの「斜め移動の綱渡り」を根本から排除した構成例です。
パターンA: クリック開閉のドロワー（アコーディオン式）
ホバーを一切使わず、ボタンのクリック/タップで展開。階層は横ではなく縦（ネイティブdetails/summary）に掘るためスマホでも一切破綻しません。
サイトロゴ
パターンB: クリック開閉のフラット・メガパネル
PCで一度に大量のリンクを見せたい場合の最適解。ホバーではなくクリックで全幅パネルを出し、内部をグリッドで平面的に並べることで斜め移動を不要にします。
パターンC: 親ページのハブ化（UIからメニュー階層を消滅させる）
ヘッダーには単一のリンク（ハブページ行き）のみを置き、下位リンクはページ本体のカードグリッド（Subgrid）で選ばせる最も堅牢でメンテが楽な設計。