How to use a screen reader
Screen readers are tools that are used by users who are blind or have limited vision to navigate and describe webpages. It is important that we understand how to correctly use them when building our application.
Depending on the platform, there are two widely used screen readers. Although they provide different controls, they ultimately parse webpages in a similar manner. You should not feel that you need to test a page using both screen readers, one is sufficient.
VoiceOver (MacOS)
VoiceOver is already available on MacOS, no download is required.
Cheatsheet
Shortcut | Action |
---|---|
Command + F5 | Enable/Disable VoiceOver |
Control | Stop talking |
Control + Option + Space | Click |
Control + Option + → | Navigate to next line |
Control + Option + ← | Navigate to previous line |
Control + Option + Command + H | Navigate to next heading |
Control + Option + Command + Shift + H | Navigate to previous heading |
NVDA (Windows)
Download at https://www.nvaccess.org/download/
Cheatsheet
Shortcut | Action |
---|---|
Control + Alt + N | Enable/disable NVDA |
Caps Lock | Stop talking |
Enter | Click |
↓ | Navigate to next line |
↑ | Navigate to previous line |
H | Navigate to next heading |
Shift + H | Navigate to previous heading |