Your customers will have varying degrees of motor skills and will benefit from keyboard accessibility. Customers with motor impairment, including many elderly customers, need your help to navigate your website. Many of these customers will use their keyboard to move around your website.
This article explains what you need to do to meet Guideline 2.1.1 – Keyboard from the Web Content Accessibility Guidelines 2.0.
All parts of your website must pass keyboard accessibility. That means your forms, menus, shopping cart and everything between. On top of that, you cannot require specific timings for keystrokes to access any feature on your website.
What to do
- A clean HTML and CSS website will often have keyboard accessibility without further work – a great example of why you need to invest in web design and development from the outset
Auditing keyboard accessibility
- Unplug your mouse and make sure you can fully use your website with your keyboard
- Make sure no function on your website requires timed keystrokes – such as double tap enter/return within two seconds to submit
A few more things
At the lowest level of accessibility (which 2.1.1 – Keyboard is), you can get away with functions that require a mouse pointer for input. These are things like free drawing tools and some types of game. Just think carefully about who you are excluding when you use these features.
One thing that gets thrown out a lot by keyboard accessibility advocates is ‘Access keys’. You’re already familiar with access keys, which is why people are quick to accept them as useful. Access keys are keyboard shortcuts like ctrl + p to print pr ctrl + s to save.
Access keys work great in programs like Microsoft Word and Adobe Reader because they’re in a controlled environment. Out on the wild wild web, things aren’t so simple. Your customers access your website on a number of web browsers; some use Internet Explorer, some Firefox, some Google Chrome and so on… These web browsers have different levels of support for Access keys.
Frustratingly, Access keys are a good idea for keyboard accessibility with bad implementation. If you’re a regular computer user, you probably use ctrl + p much more often than selecting the menu with your mouse pointer. WebAIM has an article about Access keys if you want to know more. My advice: avoid them.
- Guideline 2.1.2 – No keyboard trap
- Guideline 2.4.3 – Focus order
- Guideline 2.4.7 – Focus visible
- Understanding Success Criterion 2.1.1 (W3C)
That’s all there is to Guideline 2.1.1 – Keyboard! Is there anything you’d like to add or any questions you have about keyboard accessibility? Leave a comment below and I’ll be sure to respond.
Free Developer Resources
Join over 3,500 subscribers on my weekly web accessibility email and get free developer resources like WCAG 2.1 Checklists and special offers.
Over 600 developers like you have learned more about the Web Content Accessibility Guidelines with my guidebook.