チェックボックス・トグル・ラジオ
選ぶ入力を、チェックボックス・トグルスイッチ・ラジオのどれにする?
判断表
| 判断軸 | チェック描画 有無を選ぶ、複数可 | トグルスイッチ ON/OFF が即座に効く | ラジオボタン 複数から1つだけ選ぶ |
|---|---|---|---|
| 選べる数 | いくつでも。0個も可 | 1項目の ON/OFF | 必ず1つ。0個は不可(初期値を持つ) |
| 反映のタイミング | 送信ボタンを押したとき | 切り替えた瞬間(保存ボタンを付けない) | 送信ボタンを押したとき |
| 文言の形 | 「〜に同意する」「〜を含める」など動詞 | 「通知」「ダークモード」など状態の名前 | 「クレジットカード」「銀行振込」など選択肢の名前 |
| 支援技術 | ネイティブ input で読み上げ・Space が効く | role=switch・aria-checked を見本が付けている | fieldset/legend + input で矢印キー移動が効く |
| モバイルの標的 | 箱は小さいので label 全体をタップ領域にする | つまみが大きく指で扱いやすい | 見本はカード全体が標的で押しやすい |
迷ったらこれ
迷ったら、送信するフォームの中ならチェックボックス(複数可)かラジオ(1つ)、設定画面で押した瞬間に効かせるならトグル。ただし送信が要る画面にトグルを置くと「もう効いた」と誤解されるので混ぜない。
選択肢が5個を超えるラジオはセレクトかリストへ。選択肢に説明文が要るなら、見本のようなカード型ラジオにすると比較しやすい。