accesskey (HTML attribute)

Spec
Depr. Version
No HTML 4
Browser support (more…)
IE5.5+ FF1+ SA1.3+ OP9.2+
Full Full Full Full

Syntax

accesskey="key"

Description

The accesskey attribute allows the user to activate a control on a page using a keyboard shortcut. This may save time for users who would otherwise need to tab through a series of form controls or move the mouse to get to the desired link. The key combination that activates the link to which the accesskey is applied varies depending on the platform and browser combination. For IE/Windows, users press Alt + accesskey, while Firefox/Windows users press Alt + Shift + accesskey; users of most Mac browsers press Ctrl + accesskey; in Opera, pressing Shift + Esc displays a list of links for which accesskey attributes are defined, allowing users to choose the key they want to use.

Generally speaking, browsers don’t indicate that an accesskey attribute is defined for a form control, and this lack of discoverability is a problem. The most common method for indicating the accesskey value is to place it in a title attribute of the element to which it’s applied. However, for this approach to work, the user must mouse over the element in question. You may want to state the accesskey value in some other way—for example:

<p>Press <kbd>b</kbd> to go to Australia's Big Things
    (on Wikipedia).</p>

Example

Here, the first area has an accesskey of "b" defined:

<map name="bigthings" id="bigthings">
  <area shape="rect" coords="35,4,205,108"
      href="http://en.wikipedia.org/wiki/Australia's_Big_Things"
      alt="Australia's Big Things (on Wikipedia)" accesskey="b"/>
    ⋮
</map>
<p><img src="giant-prawn.jpg" alt="The Giant Prawn at Ballina"
    border="0" usemap="#bigthings"/></p>

Value

This attribute takes as its value a single character, which can be numerical, alphabetical, or even a symbol.

Compatibility

Internet Explorer Firefox Safari Opera
5.5 6.0 7.0 1.0 1.5 2.0 1.3 2.0 3.0 9.2 9.5
Full Full Full Full Full Full Full Full Full Full Full

There’s some variety in the way that the accesskey is activated, but generally speaking, it can work well. The downside of using this attribute is that keystrokes defined may clash with those of other technologies. For example, an assistive device such as a screen reader or magnifier may have designated for certain purposes the keystrokes that you’ve defined in the accesskey attribute. In addition, different language browsers use different “accelerator keys” for their own menu options, which may also clash with those you’ve defined. As a result of these clashes, the accesskey may not work as expected for all users. However, it may be very useful for controlled environments such as intranets, where you know exactly what browsers and languages are in use.

User-contributed notes

There are no comments yet.

Related Products