Creating a browser based single-page browser based RIA. Would like to make use of keyboard shortcuts extensively. At first my focus was professional users who like alternatives to clicking, and for it to work in a variety of browsers. Researching, I now see a whole literature on supporting physical accessibility in general, and am afraid this could become a Master’s thesis rather than a days’s work.
Is there a concise guide to which keys are
- Okay to use across browsers (e.g. don’t override Cmd+W on Mac or Ctrl+P on Windows)
- Conventionally used for certain purposes (e.g. Cmd+Z/Ctrl+Z = Undo is an obvious one)
- Identified in common accessibility standards
For instance, not being familiar with all browsers or alternative devices for different abilities, would be nice if I could look at a grid to make sure I wasn’t accidentally alienating a group of otherwise contented users.
I can find lots of links on the mechanics of key mapping (Mousetrap.js was easy and effective, btw), but not much on the conventions/guidelines/standards across browsers and human-usability segments, e.g. these links:
- Mousetrap.js
- KeyMap.js
- SO: Javascript keyboard shortcuts for web application
- SO: which is the best Javascript Keyboard event library.(Hotkeys,Shortcuts )
- SO: Robust keyboard shortcut handling using JavaScript
- SO: Is there an open source library JS for keyboard binding in the browser?
If it matters, jQuery (or any other useful library) is fine.
The DHTML Style Guide, developed with input from a variety of stakeholders, has recommended keyboard models for a wide variety of RIA widgets:
http://dev.aol.com/dhtml_style_guide/
These have been adopted into the W3C’s WAI-ARIA 1.0 Best Practices:
http://www.w3.org/WAI/PF/aria-practices
Moving forward I think it’s important for us all to follow these recommendations. If we’re all on the same page, that will decrease the likelihood of conflicts, and will minimize the number of unique keyboard models users have to memorize.