w3docs logo

HTML accesskey Attribute

The HTML accesskey attribute is a global attribute and specifies a shortcut key for activating/focusing a specific element. The attribute value should consist of one printable character.

In HTML4.1, the accesskey attribute can be only used with the following elements: <a>, <area>, <button>, <input>, <label>, <legend>, and <textarea>.

In HTML5, this attribute can be used with any element.

The way of accessing the shortcut key varies from browser to browser.

When there is more than one element having the same accesskey, the behavior of the browser differs:

  • Google Chrome and Safari: The last element having the accesskey will be activated.
  • Opera: The first element having the accesskey will be activated.
  • Mozilla Firefox: The next element having the accesskey will be activated.

Besides poor browser support, there are other concerns with the accesskey attribute:

  • An accesskey value may cause some problems connected with assistive technology functionality, or a system and browser keyboard shortcut.
  • Some accesskey value may be missing on some keyboards, in particular when there is a matter of internationalization.
  • An accesskey value consisting of numbers may be unclear to those with cognitive concerns.

For these reasons, it’s recommended not to use accesskey for multi-purpose websites and web apps.

Syntax

<tag accessKey="single_character"></tag>

Example of the HTML accesskey attribute:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <a href="https://www.w3docs.com/learn-html.html" accesskey="h">HTMLonline tutorial</a>
    <br/>
    <a href="https://www.w3docs.com/learn-css.html" accesskey="c">CSS online tutorial</a>
    <br/>
    <a href="https://www.w3docs.com/learn-git.html" accesskey="g">GIT online tutorial</a>
    <br/>
    <p>Chrome, Safari, Opera 15+: [ALT] + <strong>accesskey</strong></p>
    <p>Firefox: [ALT] [SHIFT] + <strong>accesskey</strong></p>
    <p>Opera prior version 15: [SHIFT] [ESC] + <strong>accesskey</strong></p>
  </body>
</html>

Practice Your Knowledge

What is true about the HTML accesskey attribute?

Quiz Time: Test Your Skills!

Ready to challenge what you've learned? Dive into our interactive quizzes for a deeper understanding and a fun way to reinforce your knowledge.

Do you find this helpful?