私の会社のWebサイトの非常に大きなフォームでは、Yes / No
ラジオボタンの組み合わせを使用する傾向があります。
私はそれを使用しないという1つの引数を考えることができますが、それはUX関連ではありません:null
、true
およびfalse
の2つではなく3つの状態を維持する必要がありますそれらのフィールド。
代わりに、UXに関して、チェックボックスを使用するための引数はありますか?
編集:3つのケースすべてをカバーする必要はありません。null
ケースは単なる初期状態であり、「はい」または「いいえ」のいずれかを選択せずにフォームをさらに進むことは不可能であるため、メンテナンスが困難です言及。
質問が必須かどうかによって異なります。ユーザーが質問に確実に回答したい場合は、ラジオボタンが必要です。空のチェックボックスを使用すると、ユーザーがこの質問を忘れたかどうかはわかりません。
チェックボックスは混乱を最小限に抑えるのに適していますが、その使用は、説明された選択が明らかに反対の意味を持っている場合に限定されます(言及する必要はありません)。
[X] include subdirectories
ラジオボタンは、何かをより明確にする場合や、選択肢に個別の説明が必要な場合に適しています。
Overwrite files when copying (cannot be undone):
(•) Yes, overwrite ( ) No
ラジオボタンは、選択を行わずに開始するのに最適なコントロールでもあります。
ドロップダウンメニュー(まだ2つの選択肢がある)は、ユーザーが通常変更すべきでない選択肢などに適しています。他の選択肢は表示されず、変更には2回のクリックが必要です。
Format drive for the following file system: exFAT32 ▼
(開いた後、もう1つの選択肢はNTFS
です)。
もちろん、これらだけが基準ではありません。同様のコントロールの一般的なクラスターが既にある場合は、それらを一致させるために別のクラスターを追加します。または、使用する主要なコントロールタイプを規定するのはレイアウトです。たとえば、一部のオプションは、テーブルに配置されているとより取得しやすくなります。また、選択肢に複数行のラベルまたはアイコンを追加する必要がある場合があります。これは、使用するコントロールを意味します。
したがって、選択はあなた次第であり、目標はUIを合理化することですが、重要な選択を明示的にすることや他のいくつかはユーザーの邪魔になります。
チェックボックスを使用する理由は次のとおりです。
ラジオボックスは、州が2つ以上ある場合に適しています。たとえば、調査では{yes, no, I don't know, prefer not to say}
yes
以外のオプションのニュアンスを区別するため。
このインターフェースを作った前の世代の人々に、ラジオボックスの使用の根拠について尋ねると役立つでしょう。多分それには正当な理由があるかもしれませんが、それは文書化されていません。
すべてのユースケースを本当にカバーする必要がある場合:
さらに洞察が必要な場合は、Norman Groupの この興味深い記事 のラジオボタンを読んでください。
チェックボックスは、選択を選択または確認するために使用されます。 「あなたは...を持っていますか?」という質問は選択肢を提供していないため、チェックボックスは質問には適用されません。質問だけを選択するようにも見えます。
したがって、選択肢を提示する必要があります-はいまたはいいえ。次に、チェックボックスを使用して選択肢を選択します。
@hsanの質問へのコメントは重要です。ユーザーが本当に「いいえ」を回答することを意図していることを確認する必要がある場合は、ユーザーが積極的に選択する必要があるため、フォームが送信されるまでフォームは送信できません。 。
このため、「選択してください」という最初のオプションが無効になっている選択コントロールが適切に機能します。 https://codepen.io/anon/pen/LaZzzP
<label for="mandatory-yes-no">Do you need the thing?</label>
<select id="mandatory-yes-no">
<option disabled selected> Please select</option>
<option> Yes </option>
<option> No </option>
</select>
デフォルトの状態を有効な「選択」にすることで、ユーザーが見落としている、または考慮していないというリスクがあります。そのリスクが許容可能か望ましいかは状況によって異なります。
ただし、質問の内容だけでなく、ユーザーが質問とその回答についてどの程度考えてほしいかにもよります。ラジオボックスは次に進むためにいくつかのアクションを必要としますが、チェックボックスを上から見ることができます。
DenR89が言うように、チェックボックスが否定的に回答されたか、無視されたかは決してわかりません。時々これは大丈夫です。ユーザーが質問を理解し、正直な回答を提供したことを確認する必要がある場合があります。たとえば、自動車保険アプリケーションでは、ラジオボックスを次の用途に使用できます。
Do you own the car?
( ) Yes ( ) No
これを誤って想定することには法的な意味があるかもしれないので。ただし、次の場合は同じフォームのチェックボックスを使用できます。
[ ] Include breakdown cover
デフォルト(内訳カバーなし)はほとんどの人にとって適切であり、これを逃しても保険証券の有効性には影響しません。
人々は非常に大きなフォームに飽き飽きしています。これらの場合は、ラジオボタンを使用することをお勧めします。ラジオボタンを使用すると、質問を読んで選択を迫られ、怠惰なユーザーがチェックボックスをスキップするのを防ぐことができます。
これは、yes/no/nullラジオボックスと単一のチェックボックスについて話しているときにのみ当てはまります。ラジオボックスが最初は「いいえ」の状態にある場合、それは本質的にチェックボックスと同じです。いくつかの質問を次のように置き換えることができる場合:
Do you have:
[ ] Thing 1
[ ] Thing 2
[ ] Thing 3
...
次に、これは完全に異なる質問です。
私見では
ユーザーは単一のオプションのみを選択できる必要があります
(o)アヒル()グース()復讐のコンドル
いいえ答えは答えではありません。前の例の3つのオプションのいずれかを選択(ラジオボタンをクリック)すると、選択のみを変更でき、選択を解除できません。
トッピング:[]スイスチーズ[x]ストレンジチーズ[]ミステリーミート[x]ソイレントグリーン
どちらも正しくありません。
ラジオとチェックボックスはどちらもlists用に設計されています。したがって、複数の形容詞(数/量)または名詞(オブジェクト1、2、3)のオプション(少なくとも2つの項目)が要求されるこのような場合に使用されます。
Which of the following do you have?
- Whatever 1
- Whatever 2
- Whatever 3
違いは、ラジオでは選択が1つのオプションのみに制限されるのに対し、チェックリストでは複数のオプションを選択できるということです(つまり、好きな色は何ですか(ラジオ)とどの色が好きですか(チェックリスト))。
リストではなくthisまたはthatステートメントであるため、ラジオやチェックボックスは必要ありません。代わりにボタンが必要です。これは、「これを削除してもよろしいですか?」などの質問に続くソフトウェアでよく見られます。または「このソフトウェアをインストールしますか?」
これはWebフォームであるため、HTMLラジオボタンを使用している可能性があります。オプションを「はい」または「いいえ」でのみ表示しているので、ラジオサークルを非表示にするために、コードを編集します これのように 。