A menu is a list of actions and/or options which is revealed by pressing a heading or button. In the case of context menus, the menu is opened through a secondary action (such as secondary click with a mouse, or long press with a touch screen) on an item of content.
Menus can appear as a part of a, as context menus (see ), or as part of a . Refer to the relevant pages for advice on when to use these elements.
Menus should contain between three and 12 top-level items. If a menu contains more than 12 items, evaluate whether all the items are necessary and belong in the menu. If you are unable to reduce the size, submenus can be used. However, they should be avoided if at all possible, as they are physically difficult to use.
Submenus should contain between three and six items, and should never contain other submenus.
Organize similar menu items into groups using dividers — this will make them easier to understand and quicker to use. When creating groups:
Order groups and group items logically, either by importance, task order, or expected frequency of use. Items at the top and bottom of the menu are more noticeable and easily targeted, so reserve these locations for particularly important or interesting functionality.
Place single-item groups at the top or bottom of the menu, or group them together with other single items.
Do not mix different types of menu item within each group — actions, check box and radio button items should be kept separate.
Provide anfor every menu item. You may use the same access key on different menus in your application, but avoid duplicating access keys on the same menu. Note that unlike other controls, once a menu is displayed, its access keys may be used by just typing the letter; it is not necessary to press the Alt key at the same time.
Label menu items with verbs for commands and adjectives for settings, using.
Usewhen a menu item requires further input from the user to complete an action.
Two linked actions can be combined into a single menu item, by changing the label when the item is selected. For example, a Play item may change to Pause. However, only use this type of item when actions are logical opposites which are obvious to users. Likewise, do not use this technique for settings — use check boxes or radio buttons instead.
This work is licensed under a.
Got a comment? Spotted an error? Found the instructions unclear? Send feedback about this page.