Access key

Specifying access keys

Access keys are specified in HTML using the accesskey attribute. The value of an element’s accesskey attribute is the key the user will press (typically in combination with one or more other keys, as defined by the browser) in order to activate or focus that element. Though the accesskey attribute sets the key that can be pressed, it does not automatically notify the user of the bound access key. One convention is for the page author to show the access key value by using the <u> tag to underline the letter in the link's text corresponding to the accesskey assigned. For the link below, a user would press Alt+H on Internet Explorer, Ctrl+H on a Mac (the command key can give undesired results) and ⇧ Shift+Esc+H on Opera to be directed to index.html.

<span id="mwhQ"></span><span class="p" id="mwhg"><</span><span class="nt" id="mwhw">a</span> <span class="na" id="mwiA">href</span><span class="o" id="mwiQ">=</span><span class="s" id="mwig">"index.html"</span> <span class="na" id="mwiw">accesskey</span><span class="o" id="mwjA">=</span><span class="s" id="mwjQ">"h"</span><span class="p" id="mwjg">></span>Home<span class="p" id="mwjw"></</span><span class="nt" id="mwkA">a</span><span class="p" id="mwkQ">></span>

or to emphasize ‹H›:

<span id="mwlQ"></span><span class="p" id="mwlg"><</span><span class="nt" id="mwlw">a</span> <span class="na" id="mwmA">href</span><span class="o" id="mwmQ">=</span><span class="s" id="mwmg">"index.html"</span> <span class="na" id="mwmw">accesskey</span><span class="o" id="mwnA">=</span><span class="s" id="mwnQ">"h"</span><span class="p" id="mwng">><</span><span class="nt" id="mwnw">em</span><span class="p" id="mwoA">></span>H<span class="p" id="mwoQ"></</span><span class="nt" id="mwog">em</span><span class="p" id="mwow">></span>ome<span class="p" id="mwpA"></</span><span class="nt" id="mwpQ">a</span><span class="p" id="mwpg">></span>

alternatively, the following CSS can be used to indicate the character:

<span id="mwqg"></span><span class="w" id="mwqw"> </span><span class="o" id="mwrA">*[</span><span class="nt" id="mwrQ">accesskey</span><span class="o" id="mwrg">]</span><span class="p" id="mwrw">:</span><span class="nd" id="mwsA">after</span><span class="w" id="mwsQ"> </span><span class="p" id="mwsg">{</span><span class="k" id="mwsw">content</span><span class="p" id="mwtA">:</span><span class="s1" id="mwtQ">' ['</span><span class="w" id="mwtg"> </span><span class="nb" id="mwtw">attr</span><span class="p" id="mwuA">(</span><span class="n" id="mwuQ">accesskey</span><span class="p" id="mwug">)</span><span class="w" id="mwuw"> </span><span class="s1" id="mwvA">']'</span><span class="p" id="mwvQ">}</span>

Emphasize (<em>) isn’t necessary, but can be useful to the user. It helps them identify which key to press to navigate to where they want to. Another possible way of displaying which accesskeys do what is to create a page with all the accesskeys displayed. Or the webmaster could do both. Another option for the end user is to install a user script such as FireFox Access Bar for GreaseMonkey.

History

Access keys were introduced to HTML in 1999 and quickly achieved near-universal browser support.

Conflict with browser and screen reader controls

Many browsers define their own keyboard shortcuts, which are used to control the browser itself: for instance, several browsers on Windows use Alt+D to focus the URL bar. Some initial implementations used the same modifier keys for access keys: for instance, accesskey="D" would also assign Alt+D, resulting in one or the other of the meanings being unavailable.

In the summer of 2002, a Canadian Web Accessibility consultancy did an informal survey to see if implementing accesskeys caused issues for users of adaptive technology, especially screen reading technology used by blind and low vision users. These users require numerous keyboard shortcuts to access web pages, as “pointing and clicking” a mouse is not an option for them. Their research showed that most key stroke combinations did in fact present a conflict for one or more of these technologies, and their final recommendation was to avoid using accesskeys altogether.

Subsequently, browsers changed their modifier keys to avoid the conflict, as can be seen in the table above: typically, Alt+⇧ Shift on Windows, and Ctrl + ⌥ Opt on Mac.

<access> element

In XHTML 2, a revised web authoring language, the HTML Working Group of the World Wide Web Consortium deprecated the accesskey attribute in favor of the <access> element defined in the XHTML Role Access Module. However, XHTML 2 has been retired in favor of HTML5, which (as of August 2009) continues to permit accesskey attributes, and does not define the <access> element type.

Use of standard access key mappings

In 2004, a standard emerged using numbers, which promotes consistency for users, and enables the increased predictability of keyboard shortcuts on different sites. These include, for example, 1 to go to the homepage, 0 for search, / for contact, and others..

Ten years later, in 2014, an updated and more comprehensive standard using both letters and numbers was released in order to breathe new life into browser access key standardization efforts.