Drop-Down Menus and Combo Boxes
Drop-down menus and combo boxes allows users to select one option from a list of values.
| Within a drop-down menu, the selected option is always visible--users display additional options by clicking a drop-down button.
| |||
| A combo box combines a text input box with a menu. Users can either select a menu option or enter a value.
| A rich combo box combines a text input box with a two-column menu.
| ||
Guidelines
- Use a drop-down menu or combo box for presenting options when screen real estate is limited.
- Use a combo box for items that have a specific format, such as dates and times.
- Use a rich combo box to add images or labels to the menu.
- Strive for 10 or fewer menu items. You can use more if users are familiar with the set of choices.
- List the items in a logical order. For example, order a list of available memory by size (2 MB, 8 MB, and 4 GB). Default to alphabetic or numeric order for items that are not specifically ordered.
- If "None" is a valid value, include it as a menu item. Otherwise, users won't be able to reset the menu to "None" after another value is chosen.
- Use sentence-style capitalization for the menu items. Exception: If the item is a product name, use the capitalization as defined in the trademark.
- Provide a default value whenever possible. Typically the default is the most-common, safe choice. The default value need not be the first item in the list.
Visual Specification
Drop-down Menu
