HTML accesskey Attribute
The HTML accesskey attribute provides one or more characters that a browser can use when assigning a keyboard shortcut to an HTML element. The exact key combination used to activate or focus the element is determined by the browser and operating system.
Syntax
The accesskey attribute is placed in the opening tag of an HTML element. Each shortcut value consists of a single character.
<element accesskey="character">Content</element>
For example, the following link provides h as a possible access key:
<a href="/index.html" accesskey="h">Home</a>
Attribute Values
| Value | Description |
|---|---|
character |
Provides a single character that the browser can use when assigning a keyboard shortcut. |
character character |
Provides multiple alternative characters as unique space-separated values. The browser can select an appropriate shortcut from the available choices. |
Each value must contain exactly one Unicode code point. When more than one value is provided, the values must be unique and separated by spaces.
Elements That Use the accesskey Attribute
The accesskey attribute is a global attribute and can be specified on all HTML elements.
| Element | Description |
|---|---|
| All HTML elements | Provides information the browser can use to assign a keyboard shortcut that activates or focuses the element. |
Using the accesskey Attribute
The accesskey attribute is commonly useful on interactive elements such as links and buttons. The following example provides shortcut characters for two links:
<nav>
<a href="/index.html" accesskey="h">Home</a>
<a href="/article/contact.html" accesskey="c">Contact</a>
</nav>
The attribute does not normally create a visible indication of the shortcut. If a website uses access keys, users should be given a way to discover which shortcuts are available.
Providing Multiple Keys
More than one possible access key can be supplied by separating the characters with spaces. The browser can use the values as alternatives when determining an available shortcut.
<button type="button" accesskey="s 1">Save</button>
In this example, s and 1 are alternative access-key values. They do not create two shortcuts automatically; the browser determines which available value and modifier-key combination to assign.
Browser Key Combinations
The character supplied by accesskey is not necessarily the complete keyboard shortcut. Browsers determine the actual key combination based on factors such as the operating system, keyboard, existing browser shortcuts, and other access keys on the page.
For this reason, authors should not tell users that an access key will always use one specific modifier-key combination. The shortcut used on one browser or operating system may be different on another.
Accessibility Considerations
Access keys should be used carefully. A shortcut assigned by a web page can conflict with keyboard commands used by the browser, operating system, or assistive technology. Different keyboard layouts can also affect which shortcuts are convenient or available.
If access keys are provided, keep them consistent and make the available shortcuts discoverable to users. Do not rely on access keys as the only method for reaching or activating important content or controls.
Common Mistakes
Do not include modifier keys such as Alt, Control, or Shift in the accesskey value. The browser determines the modifier keys used for the actual shortcut.
<!-- Correct -->
<a href="/contact.html" accesskey="c">Contact</a>
When providing multiple alternatives, do not use multi-character words or duplicate values. Each space-separated value must consist of exactly one code point and must be unique within the attribute.
Do not assume that the same access-key combination will work in every browser, operating system, or keyboard configuration.
Browser Support
Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.
The accesskey global attribute is widely supported in current core browsers. The actual keyboard shortcut assigned to an access key can vary between browsers, operating systems, keyboard layouts, and devices.
Checking Browser Support
For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.
Try the accesskey Attribute
Edit the accesskey values in the example and test the links and button using the access-key combination supported by your browser and operating system.
Summary
The HTML accesskey attribute is a global attribute that provides one or more characters a browser can use when assigning a keyboard shortcut to an element. Each value must contain one code point, and multiple alternatives are separated by spaces. Because browsers and operating systems determine the actual shortcut and conflicts can occur, access keys should be used carefully and should not be the only way to access important content.
