Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I can build all the functionallity of a checkbox and a radio button with a select/dropdown, which results in a more lined up interface and I get around with lesser different types of GUI-elements.

So why should these elements be used anyway.

share|improve this question
2  
related question: ux.stackexchange.com/questions/20175/… –  JOG Sep 6 '12 at 15:57

5 Answers 5

up vote 11 down vote accepted

Checkboxes vs. Select:

To replicate checkbox functionality (choose 0 or x out of n), you'd need to employ a multiselect element. There's a lot of research out there indicating that most users are unaware of how to select multiple items in a multiselect element.


Radio Buttons vs. Dropdown:

It really depends on your scenario.

Scenario 1: "Please select your country from this list of several hundred"

mockup

download bmml source – Wireframes created with Balsamiq Mockups

  • The label clearly indicates the kind of options available – no surprises here
  • A dropdown will make sense in terms of decluttering the interface/hiding unnecessary information from the user

Scenario 2: "Do you like ice cream?"

mockup

download bmml source

  • The dropdown hides important information (the availability of an option other than "Yes" or "No") from the user.
  • The amount of space saved (2 vertical units) by a dropdown is negligible.

tl;dr: Whether to use Radio Buttons or Dropdowns really depends on your use case. Every time you use a multiselect, a cute kitten dies.

share|improve this answer
    
Yeah, didn't now about any research, but I found multiselect stuff in one listbox strange, too. so I always use 2 select boxes, one with all the data an one where the selected items get moved to. The end product seems much faster to grasp than to look which of the boxes are checked. –  K.. Sep 6 '12 at 18:10
    
+1 for the warning of consequences to cute kittens. That's the only thing here I didn't know before. –  iconoclast Jul 8 '13 at 19:39

Radio buttons:

++ Options are visible (Dropdown: needs a click to reveal)
++ Selecting an option takes only 1 click (Dropdown: 2 clicks)

Checkboxes:

++ Options are visible (Dropdown: needs a click to reveal)
++ Everybody knows how to multiselect (Dropdown: need to press ctrl/cmd key)

share|improve this answer

For small numbers of options checkboxes and radios:

share|improve this answer
1  
Excellent, concise answer. I would just add that checkboxes, in particular, have the unfortunate property of forcing a default value (a property not shared by the drop-down menus used by the questioner). Given that, radio button sets should be preferred over checkboxes, and should be the go-to elements for choices with few options. –  A.M. Aug 7 '13 at 14:03

At first, checkboxes and radiobuttons make choices visible and don't require any additional actions to display the set of choices.

Second, their form displays without any text explanations the possibility to make one-from-many or many-from-many choice — and 'cause checkboxes and radiobuttons are recognisable, basic patterns, these elements have great affordance. In dropdowns and selects it will require additional cognitive efforts to understand the possibility of multiple choice, or any additional labels.

At third, dropdowns and choices can't display single checkbox choice correctly — usually it will require two choices ("yes"/"no") and a lot of actions instead of simple click.

And fourth, selects can be perceived as textareas, what makes additional confusion to users.

So, it is not so simple, and lined-up interface made in visual form made of selects and dropdowns will not show the difference in essence and will be much more harder to use.

share|improve this answer

Just to toss in my two cents, one thing that really irks me is when you have a radio button with only two options, such as "Do you want a cat?" -> "( ) Yes ( ) No". Checkboxes make a lot more sense here ("[ ] I want a cat").

share|improve this answer
    
Of course the difference between the two is primarily in setting defaults. Unselected radio buttons don't offer a default and can easily fail to validate (which you may want, if you want to force the user to evaluate the question more carefully), while an checkbox will validate fine when ignored. –  dhmholley Sep 20 '12 at 10:40
    
@dhmholley You are right that the difference is to do with defaults, but actually radio buttons can be made to offer defaults (whether or not defaults are a good idea ux.stackexchange.com/a/43366/33314). So essentially you have a flexible option (radio button set) versus an option that forces you to have a default (checkbox). –  A.M. Aug 7 '13 at 13:54

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.