If you use the accesskey attribute, specify unique values

The HTML accesskey attribute can be used to assign a keyboard shortcut to a link or form control. The intention is to let keyboard users quickly navigate to different parts of a web page or trigger links to other pages.

Whether or not the accesskey attribute should be used at all is a debate that has been going on for years. I’m not going to go there in this article (see Providing Keyboard Shortcuts Using accesskey for a good explanation), but will instead focus on something you need to be aware of if you do use accesskeyvalues must be unique.

When an accesskey is triggered, the browser follows a link, moves focus to a form control, or submits a form. When only a single element on the page has a particular accesskey value, the expected element is activated or receives focus. But what happens when two or more elements share the same accesskey value?

It depends.

As you can see, browser behaviour is inconsistent and likely to lead to unexpected results.

It is worth noting that the HTML5 specification of the accesskey attribute does not mention how browsers should handle duplicate values. I think that would be worth specifying to ensure similar cross-browser behaviour, regardless of whether actually using the accesskey attribute is a good idea or not.

This post is a Quick Tip. Background info is available in Quick Tips for web developers and web designers.

Posted on May 26, 2010 in Accessibility, Browsers, (X)HTML