Projects/Usability/HIG/Combo Box

< Projects‎ | Usability‎ | HIG
Revision as of 16:30, 17 June 2008 by Seele (Talk | contribs)

Jump to: navigation, search


Combo boxes offer the user a choice of two or more mutually exclusive options. Their disadvantage compared to related controls like radio buttons or lists is that the options are not visible without further interaction.

  • Use combo boxes instead of radio buttons for more than four mutually exclusive options.
  • Don't use them for less than three options or more than 10 choices. In the latter case, use lists instead.
  • In general, controls that show the options without further user interaction are preferable, except for the following cases:
    • the list of options may change over time,
    • the contents are obvious from the label and the one selected item, for example Month and January
    • the combo box is part of a related sequence of controls. For example, to set a reminder to ring 5 hours or minutes before or after an event.
  • Provide a descriptive label to the left (in left-to-right scripts), in some cases above the combo box. Don't forget to create a buddy relation so access keys are assigned.
  • Don't initiate an action when the user selects an item from a drop-down list.
  • Make sure the items are easily accessible via keyboard by moving distinctive letters to the beginning of each option. For example, in a list of countries on continents, write Germany (Europe) instead of Europe/Germany.
  • Use sentence style capitalization for the label and the options.
  • If activating a choice affects the appearance or the enabled state of other controls, place them next to the radio button or in the next row (indented).

Content is available under Creative Commons License SA 4.0 unless otherwise noted.