web-dev-qa-db-ja.com

円形のチェックボックスはUIデザインが悪いですか?

ラジオボタンは通常、円形のコントロールとして表示されますが、最近ではチェックボックスにも丸い境界線が表示され、ラジオボタンのように見えます。

http://flatlogic.github.io/awesome-bootstrap-checkbox/demo/

現在、UIデザイン会社がプロジェクトに取り組んでおり、彼らは同じことを行っています。

では、円形のチェックボックスはUIデザインが悪いのですか?

場合によります

円形の「ラジオ」ボタンを使用して、グループで使用できる選択肢が1つしかないことを示します。

正方形のチェックボックスは、より柔軟なエントリが許可されることを示すために使用されます(なし、1つ、またはいくつか)。個々の選択肢はチェックされているか、チェックされていません。

なし、1つ、または複数のオプションを許可する場合は、正方形のチェックボックスを使用します。
1つのオプションのみを許可する場合は、丸いオプション/ラジオボタンを使用します。

丸いチェックボックスに複数の選択肢を許可することは、混乱を招くだけです。

詳細については、 Microsoftのラジオボタンに関するガイドライン を参照してください。

ラジオボタンを使用すると、ユーザーは相互に排他的な関連オプションのセットから選択できます。ユーザーはオプションを1つだけ選択できます。ラジオボタンは、ラジオのチャンネルプリセットのように機能するため、このように呼ばれます。

チェックボックスを使用して、ユーザーは2つの明らかに反対の選択を決定します。チェックボックスのラベルは選択された状態を示しますが、クリアされた状態の意味は、選択された状態の明確な反対でなければなりません。したがって、チェックボックスは、オプションのオンとオフを切り替える場合、または項目を選択または選択解除する場合にのみ使用してください。

要するに、ラジオボタンは、一連のオプションの選択肢を提供します(1つのラジオ局を聴く必要があります。何も選択しないことも、多数選択することもできません)。 。 チェックボックスを使用すると、一連のオプションのそれぞれに対してはい/いいえを指定できます。

19
user93670

ピートは正しいですが、「なぜ」それを悪いデザインの選択にするかについて詳しく述べると、それは単に私たちが慣れ親しんでいる標準にすぎないということです。誰もが正方形のボックスのセットをすぐに選択肢として追加/チェックボックスとして再丸めし、丸いものをラジオボタン/選択肢として丸めます。

これらの図形を入れ替えると混乱を招き、ボックスが正常に機能しないことがわかっても、サイト/アプリが想定どおりに機能しているかどうかはわかりません。

2
paddotk