Problem

Provide single click access to an arbitrary set of key functions for each page or view.

Typical use of Accesskeys to provide quick access to list items. Also note the title, serving as a breadcrumb, has a key to quickly go back up a level. The search button cannot have one, as the only time it would be helpful is while the text field is in focus, when typing the character would just enter into the field. The user may press OK/Enter to get the same result.

Solution

Accesskeys provide one-click access to functions and features of the handset, application or site for any device with a hardware keyboard or keypad. A number or letter is assigned to a particular link or other function, and when selected activates this function as a shortcut.

The key value is in the arbitrary assignment, and larger number of keys available than softkeys or other built-in quick access keys. Not only each application or website, but each page, view or state. Accesskeys allow glancing at the page, and selecting a function with a single key without scrolling to the function, for any user who understands the intent of the system.

A secondary value is in learnability. Users may become accustomed to certain features of the device, or a specific application, always having a particular 'Accesskey. For example, if 0 (zero) is assigned to the "home" function for a site, this may be learned and used even if the link to home is in the footer, and not visible. This adds speed and efficiency to the expert and other highly-accustomed or trained users.

Variations

By far the most common type of Accesskey uses the number and symbol characters # and * from from the telephone number pad. This is applied to the basic 10-key device, which also very often have simple scroll-and-select interfaces, and can use the additional speed provided by the shortcut to avoid excessive scrolling.

Full keypads may use letters as Accesskeys though this more rare, and not as well understood. They may also use numeric characters, allowing a single set of keys to be assigned for all devices, though the Mode Switch to access the numbers may reduce the value of the Accesskeys for these devices.

This pattern cannot really be used on devices without a hardware keyboard or keypad. It is even often impossible to launch the virtual keyboard or keypad, so cannot be used at all, aside from the lack of obvious value. Gestural shortcuts fulfill a different need, and not implemented in a consistent enough manner to qualify as a distinct pattern yet.

Accesskeys can be used to perform one-click functions on scroll-and select devices, any time they might be needed. Here, pressing OK/Enter on the in-focus item will load a details page. The # accesskey provides a shortcut to see the same item on the map, immediately. This sort of labeling can also be used to make users accustomed to Accesskeys, and can encourage their use in the rest of the site or application.

Interaction Details

Pressing the assigned key will immediately perform the function, as long as no entry field is in focus. Text or numeric entry will always take over the keyboard or keypad, and Accesskeys will not function while an entry field is in focus. The key labels will not change their state to indicate this.

Accesskeys should be assigned in a logical method. For keyboards, shortcuts are the best guidance, and following principles of desktop shortcuts work well. Abide by desktop heuristics whenever possible (e.g Cut, Copy, Paste as X, C, V).

When direction keys are needed, such as moving a map within a page, assign the up/down/left/right keys as though the keypad is a virtual direction pad, with 5 at the center. Use the same logic even if only one axis of movement is required.

Use mnemonics if available, such as * for favorite; the asterisk is commonly called, and perceived as a star, an already common icon for favorite marking.

When possible, exercise bilateral symmetry. Zoom should be 1 and 3, never 1 and 2. This may be more difficult on keyboards, due to more variable layouts, staggered keys and so on.

The following is a set of the most common assignments for numeric keypads:

Key

Suggested Functions

1

Zoom out

2

Scroll up

3

Zoom in

4

Scroll left

5

Home, re-center, or switch view

6

Scroll right

7

8

Scroll down

9

*

Favorites, bookmarks, etc.

0

Help

#

Unassigned items above have no discernible pattern to their use, so are open.

When many of these are not needed, such as for simple lists of functions, a typical method is to simply assign in order from the first available function down.

Key assignment consistency is key for learnability. Try to follow OS standards when available and possible. Design Accesskey assignments at the same time as the overall application or site design. When determining what components are visible in the header and footer of each page, for example, assign keys to those so they are fixed and repeatable across the service.

Accesskeys can be a way to provide easier navigation for multi-column and other complex layouts. Scroll and select users who are accustomed to scrolling only vertically, or whose devices make column switching cumbersome, can still access all parts of the page instantly. The downside is users who do not understand Accesskeys.

Presentation Details

Each Accesskey enabled function should be labeled, generally in the left margin, where no other elements are located. If numbered labels for line items are required, whether adjacent to the Accesskey label or not, should be further to the right, in the primary content area.

When items to be labeled are not all in a single list, the label should be in the same relative position, generally to the left. Avoid switching label locations, even if symmetry or other needs seem to make design sense.

The Accesskey label may be any style that is different from other items on the page, such as gray and italicized. The best labels are displayed on a graphic representation of a key, to emphasize the intent of the label, and reduce confusion with a number.

Labels may be much less prominent than other items, so they do not interfere with those unfamiliar with the concept of the Accesskey.

Antipatterns

Do not attempt to over-use the Accesskey label, by also making it serve as a list identifier. Even if it functions in one instance, this may imply additional importance to the labels in other instances, or may be interpreted as only position labels and not be understood to be Accesskey labels.

Do not rely on Accesskey use. Even when 10-key devices were ubiquitous, it was not well-understood so only a subset of the population used it regularly. Include it, but provide as a secondary or shortcut method.

Avoid using Accesskeys for subtle interactions, such as granting focus to a search field. The user may not note the change and will become confused, or may even make entry errors due to misunderstanding a state change.

Examples