オートコンプリート
Autocomplete文字入力の途中で候補一覧を動的に絞り込み提示する、検索・入力補助UI。
○ 使う場面
- 選択肢の母数が多い（都市名・商品名など）、入力しながら絞り込みたいとき
- 自由入力と候補選択の両方を許し、表記ゆれを吸収したいとき
× 避ける場面
- 選択肢が少数で固定されているとき（→ドロップダウン）
- 候補データを都度取得するコストに見合わない、ごく単純な入力のとき（→テキストフィールド）
別名
サジェスト、オートサジェスト、入力候補、コンボボックス
近縁種との比較
「コンボボックス（Combo box）」はテキスト入力と選択リストを組み合わせた総称で、実装上はオートコンプリートと同じWAI-ARIA Comboboxパターンを使うことが多いが、自由入力をどこまで許すかという設計思想の違いで呼び分けられることがあるため、本図鑑ではオートコンプリートをそのaliasesに含めつつ、両者は同一UIとして1つのカードで扱う。
| 近縁種 | 違い・使い分け |
|---|---|
| ドロップダウン | 候補を確定リストから選ぶ点は共通するが、オートコンプリートは入力しながら動的に候補が絞り込まれる点で異なり、候補の母数が多い（都市名や商品名など）場面に向く。 |
| テキストフィールド | 候補データの取得コストに見合わないごく単純な入力であれば、素直にテキストフィールドに留めるべきである。 |
分類
機能・役割
- ナビゲーション
- 入力・操作
- 表示・整理
- フィードバック・状態
表示レイヤー
- インライン
- 固定・追従
- オーバーレイ
- 全画面・遷移
複雑さ
- 単体パーツ
- 複合パーツ
- セクション