What browsers are implementing the input attribute "accesskey
"?
Is the behavior consistent cross browser?
Is it safe to use accesskey
as just an extra data attribute (like the "rel
" and "rev
" are sometimes used on the a
tag)?
Also, is there a way to capture the "onaccesskeypress" in JavaScript? Does it just fire an onclick event?
What browsers are implementing the input attribute "accesskey
"?
Is the behavior consistent cross browser?
Is it safe to use accesskey
as just an extra data attribute (like the "rel
" and "rev
" are sometimes used on the a
tag)?
Also, is there a way to capture the "onaccesskeypress" in JavaScript? Does it just fire an onclick event?
Share Improve this question edited Jul 9, 2019 at 9:59 Peter Mortensen 31.6k22 gold badges110 silver badges133 bronze badges asked Mar 8, 2011 at 17:17 Kenneth JKenneth J 4,89612 gold badges41 silver badges56 bronze badges3 Answers
Reset to default 3Browser support:
All major browsers support the accesskey
attribute. Although there has been some discussion whether this is a good thing for accessibility, it remains part of HTML (as of HTML5).
Consistent behaviour:
Behaviour is only consistent across browsers & platforms in that pressing a particular set of control keys and the defined accesskey
key will activate the link.
By definition, every web developer is free to define access keys as they wish, and there isn't an agreed standard for mon links, such as 'Jump down to the main content', 'home', 'sitemap' etc., so there's no consistency from website to website. See my suggestions below.
Also the control keys for accessing these keyboard shortcuts differ from browser to browser and platform to platform, and occasionally there have been changes between browser versions too.
The Wikipedia page about access keys provides a list for a wide number of browsers and should provide you with an up-to-date list.
Safe to use accesskey
as just an extra data attribute:
I'm not sure what you mean by 'safe'. Here is an example of how to use it:
<a accesskey="9" href="/sitemap.html">Sitemap</a>
Personal suggested access keys:
0 - Home
9 - Sitemap
8 - Accessibility page (listing the keys)
1,2,3... - Main navigation items, top-level only
accesskey
has pretty spotty implementation. Firefox allows you to use any character as an accesskey
value, while Safari seem to only allow numeric characters (for example, on this page).
The next button is mapped to the >
accesskey. It works in Firefox (Ctrl>, on a Mac), but not in Safari.
In my opinion, if keyboard navigation is essential to your webpage, using JavaScript is a much better option.
Some resources I used to e to my conclusions: [1], [2]
EDIT: After a bit more experimentation, it appears that Safari honors accesskeys that are alphanumeric characters. The keystroke to execute them is CtrlAlt{ACCESSKEY}. I still think JavaScript is the best way to implement keyboard navigation, but I thought I'd add this information for clarity.
Every major browser supports accesskey
(parses it and assigns keyboard shortcuts accordingly).
The problem with this is that the control key is different for every browser. On Internet Explorer, it's Alt + key, Firefox uses Shift + Alt + key, Mac uses Ctrl + key.