Keyboard Testing
Testing with a keyboard is an essential part of any accessibility evaluation.
To be keyboard accessible a web page must not only be keyboard operable it must also incorporate the following: a visible keyboard focus, appropriate tab order, and avoid keyboard traps.
Useful Shortcuts
Launching
- Control + Alt + N = Start NVDA
- Insert + Q = Exit NVDA
- Control + Esc + 'Chrome' = Launch Chrome
Browsing
- Control + N = New window
- Control + Shift + N = New incognito window
- Control + T = New tab
- Control + L = Go to Location bar
- Alt + ← = Previous page
- Alt + → = Next page
Navigating
- H = Next heading
- Shift + H = Previous heading
- L = Next list
- Shift + L = Previous list
- I = Next list item
- Shift + I = Previous list item
- G = Next graphic
- Shift + G = Previous graphic
Reading
- Control = Stops NVDA reading
- ↓ = Next line
- ↑ = Previous line
- → = Next character
- ← = Previous character
- Control + → = Next word
- Control + ← = Previous word
Forms
Form Shortcuts
- F = Next form
- Tab = Next form control
- Shift + Tab = Previous form control
- Space = Select and deselect checkboxes
- ↓ / ↑ = Select radio button or combo box options
- Insert + Spacebar = Enter focus mode (sometimes called forms mode)
- Insert + Spacebar = Exit focus mode and return to browse mode
Browse mode v. Focus mode
NVDA has two modes of operation: browse mode for navigating and reading the page and focus mode for interacting with controls, such as form input fields.
In browse mode, keyboard shortcuts help the user to navigate. For example, the H key will move focus to the next heading.
When a user inputs data into a form field, they want characters to appear when pressing keys. For example, the H key should enter the symbol 'h', rather than move to the next heading. To achieve this, screen readers have a focus mode (sometimes called forms mode). When a screen reader enters focus mode, keyboard shortcuts are disabled.
Testing Forms
- Open the web page containing the form in Chrome
- Open NVDA
- Make sure the Focus Highlight add-on is enabled. A red outline indicates browse mode; a blue outline indicates focus mode.
- Make sure the Speech Viewer is visible
- Tab down to the first form input field
- NVDA will make a clicking sound and the focus highlight outline will turn blue.
Note: NVDA automatically changes to focus mode when it enters a form. To move in and out of focus mode press Insert + Spacebar
- Use Tab and Shift + Tab to move through the form fields
- Check that everything that appears on screen is read out to the screen reader
Tables
Table Shortcuts
- T = Next table
- Control + Alt + → = Next cell
- Control + Alt + ← = Previous cell
- Control + Alt + ↓ = Next row
- Control + Alt + ↑ = Previous row
Testing Tables
- Open the web page containing the form in Chrome
- Open NVDA
- Make sure the Focus Highlight add-on is enabled. A red outline indicates browse mode; a blue outline indicates focus mode.
- Make sure the Speech Viewer is visible
- Press T to move to the next table. NVDA will read out the number of rows and columns in the table
- Use Control + Alt + → to move across the top row. Make sure each heading is read out
- Use Control + Alt + ↓ to move to the next row. Make sure that the cell contents is read out
- Verify that the navigation order of the table makes sense
- Make sure that interactive items within the table, such as links and buttons, are read out