ドロップダウン

Select

あらかじめ用意された選択肢の一覧から1つを選ばせる、クリックで開閉する入力UI。

未選択です

○ 使う場面

  • 選択肢の数が多く(目安6〜十数個)、画面上に全部並べると場所を取りすぎるとき
  • 選択肢が既知かつ固定で、自由入力を許したくないとき

× 避ける場面

  • 選択肢が2〜4個程度で、常に一覧を見せた方が比較しやすいとき(→ラジオボタン)
  • 候補が多すぎる、または入力しながら絞り込みたいとき(→オートコンプリート)

別名

セレクトボックス、セレクトメニュー、ドロップダウンリスト、プルダウン、プルダウンメニュー

近縁種との比較

英語のSelect / Dropdown listに対し、日本語では「セレクトボックス」のほか「ドロップダウン リスト」「プルダウン(プルダウンメニュー)」という呼称も広く流通している。「プルダウン」は 和製寄りの表現で英語圏にはほぼ通じないが、日本語圏の実務では最頻出の呼び名の一つであり、 本図鑑では当初NN/gの用語法に沿うセレクトボックスを見出し名としていたが、より日常語に 近いドロップダウンへ改称し(R36)、セレクトボックスを含めこれらすべてをaliasesに収録した。

近縁種違い・使い分け
ラジオボタン選択肢が2〜4個程度と少なく常に一覧を見せて比較しやすくしたいならラジオボタンへ、選択肢が多く(目安6〜十数個)省スペースに収めたいならドロップダウンを使う。
オートコンプリート候補が固定的で数十以下ならドロップダウン、候補が多すぎる・入力しながら絞り込みたいならオートコンプリートを使う。

分類

機能・役割
  • ナビゲーション
  • 入力・操作
  • 表示・整理
  • フィードバック・状態
表示レイヤー
  • インライン
  • 固定・追従
  • オーバーレイ
  • 全画面・遷移
複雑さ
  • 単体パーツ
  • 複合パーツ
  • セクション