Testing your website or application with the NVDA screen reader


What is a screen reader?

A "screen reader" is the generic term for a program that helps blind people use a computer. Simply put, a screen reader will "read" (speak) the content of a page to the blind user.

Where do you go to download the free NVDA screen reader?

You will need to go to the following website www.nvaccess.org

Note to developers

NVDA is a fully functional screen reader. It does not time out. NVDA will only work on Window based computers (starting from Windows 7 - up to Windows 10). For more information on which Windows operating systems NVDA works with, please see the section called system requirements in the user manual.
You will not have to pay a subscription to be able to test your website or application. However, NVACCESS will ask for a donation (to keep this project going and free for everyone). Please donate (if you can) no matter how small the amount might be, as it all counts.

Note from Quentin Christensen (NVACCESS developer) regarding making software accessible

There are two parts to making software accessible to screen reader users. One is being able to get around with the keyboard, and the other is having the right information reported.

For keyboard navigation, it is important to have controls in a logical order. At its simplest, this might be when a user moves around with TAB or the ARROWS. Where useful, controls should have keyboard shortcuts or accelerator keys. For instance, consider video call software. It is much more efficient having a shortcut key to answer a call than needing to tab 20 times to get to the answer button.

Most screen reader users don’t use the mouse. Anything which ONLY works with mouse is going to be problematic. A lot of standard controls already work fine with both keyboard and mouse. You can press TAB to move a standard button and press ENTER to activate it. If a shortcut key has been defined, you can press that to activate the button from anywhere on that screen. Many controls have a letter underlined to show that you can press alt and that letter. In a save dialog, for instance, the “Save” button has the “S” underlined. With such a dialog open, you can press alt+s to activate that save button.
With controls such as buttons and edit boxes, it is best to use an existing standard control than create a new one. Pre-defined controls have things like labels, tab control and screen reader accessibility built-in. If you make a new thing you want to act like a button, you can make it accessible, it just tends to be more work. The same is true for combo boxes, edit boxes, checkboxes and so on.

A control with an attached text label, such as a standard checkbox, tells a screen reader all about itself. When creating a custom check box, a lot of this information may need to be setup by hand. This includes what it is (a checkbox), what it is for (the text in the label) and its state (checked or unchecked). Most environments offer properties for controls, such as a “label”, “name” or “description”. Ensure this field is descriptive will make it usable for screen reader users.
NVDA is free for anyone to use. We are quite happy for developers to download it and test it with their programs. Try to navigate your app and use the features of it with the keyboard. NVDA should read enough to tell you where you are at any point. NVDA’s tools menu has a “Speech Viewer” which displays in text what NVDA reads aloud. This can be very useful for anyone unfamiliar with Text-To-Speech (TTS) voices.

NVDA will work on desktop applications as well as supported browsers.

You will need to go to the following website at http://www.nvaccess.org then locate the downloads page. Here, you will find the latest version of the NVDA screen reader.
After it has been downloaded to your computer, locate the file and click on it, and the welcome dialogue will come up. It will give you the option to set the keyboard layout, use the caps lock key as a modifier key or have NVDA start when the computer does. A musical sound will be heard. You will see in front of you documentation that can be read and agreed to. You will then be given 3 options: one to install NVDA to your computer, the second to make a portable copy and the third to run a temporary copy of NVDA without installing it to your computer. Choose the first option and follow the directions to install it to your computer. If a UAC screen comes up, just use the Alt key + Y to say yes to it so it can be installed to the computer.

Keys to start, exit and also go into the settings of NVDA

To start your copy of NVDA (if it is not running) use the Alt key + Ctrl key + the letter N.
To go into the settings of NVDA, use the NVDA key + the letter N. When the preferences menu comes up, arrow or click on the settings menu to open it. Here you can make changes like speeding up or slowing down how fast NVDA speaks etcetera.
Under the HELP section is where you will find the user guide.
To turn off NVDA, use the NVDA key + the letter Q. Either tab or click on the ok button to close it. You might have noticed (depending upon which option is shown) that the default is set to exit NVDA.

NVDA modifier keys

Where I refer to the NVDA key, this is a modifier key which can either be the Caps Lock key, the Insert key or the extended Insert key. You would use one of these (whichever one you choose) to close NVDA (for example the Insert key + the letter Q).
The modifier keys can be found under the keyboard section of NVDA. You can have more than one.

Some keys you will use

Depending if you are testing NVDA (either on a desktop program or on the web) the keys used will be keyboard based.

In most cases on the desktop, you will use the Enter key to go into a program, the Tab key sometimes to jump into a section and the Shift/Tab key to jump back out of it (including forms on the internet);  the left, right, up and down arrow keys (not on the numeric keypad) to navigate the desktop and menus; the Alt key to bring up a file menu; and the Alt key + F4 to close a program or page. The NVDA key + Tab key is used to speak what it is focused on at that time.

The following sections in the user guide might help you. Namely: Objects, Navigating with the system focus and Navigating with the system caret along with the focus highlighter feature in NVDA (to know where you are on the desktop or web page).

Focus highlighter in NVDA

If you are a sighted developer or trainer and you want to see what NVDA is talking at that time you can turn on the focus highlighter in NVDA. To turn it on, you will need to have NVDA running, then press the NVDA key + the letter N. When the preferences menu comes up, locate the settings menu with either the arrow keys or a mouse. If using the arrow keys, press the Enter key on the settings menu. Here you will see different sections come up. Locate the vision section of NVDA in most cases you would use your arrow keys or a sighted person would click on it.

If using the arrow keys after you have found the vision section, just use the Tab key. You will be given different options such as Enable highlighting, Highlight system focus, Highlight navigator object and Highlight browse mode cursor. You will need to check the box on the option you wish to use.
To find out more about what they do when checked or unchecked, please read the user guide under the help section of NVDA. You will need to locate the vision and the Focus highlight section in the user guide where you can find out more about what they do.
This could be while on a website or on the desktop.

Turning off NVDA to stop it from speaking what it is focused on

If you are a sighted developer and do not want to hear NVDA speak what it is doing you can turn off the speech within NVDA. Press the NVDA key + the letter S and toggle it until you hear NVDA say speech mode off. The other alternative is just to mute the speaker in Windows or just turn them off.
If you want to hear NVDA speak again, just repeat the process until you hear NVDA say speech mode talk.

Speech Viewer

For sighted software developers or people demonstrating NVDA to sighted audiences, a floating window is available that allows you to view all the text that NVDA is currently speaking.
To enable the speech viewer, check the "Speech Viewer" menu item under Tools in the NVDA menu. Uncheck the menu item to disable it.
The speech viewer can be resized and moved around on your screen.
To find out more about the speech viewer please see the section called speech viewer in the user guide.

Testing your website with NVDA

Hearing the difference between browse mode and focus mode with NVDA

When you go to test your web page with NVDA, you can hear one of either 2 different sounds. One sound will be when it goes to browse mode and the other to focus mode. If you want to hear it spoken use the NVDA key +Ctrl key + the letter B. When the browse mode settings dialogue comes up, locate the section called Audio indication of focus and browse modes and uncheck that box, then apply and ok the changes. Now, you should hear NVDA say browse mode (where the quick navigation keys can be used to navigate a web page quickly in browse mode and focus mode, where you can type into an editable area).

You can force NVDA to change between these 2 modes. Use the NVDA key + Spacebar to do this.
There are different keys that are used on a web page to quickly navigate a web site in browse mode. These are known as single letter navigation keys, which can be found in the NVDA user guide. Some people will refer to these as quick navigation keys on a web page that NVDA can use.
.
Visually impaired and blind people do not use a mouse on a website, so in that case the only option is using a keyboard. NVDA has quick navigation keys that you can use to navigate a website. You should be able to use any supported browser that NVDA can use (for example Google Chrome, the new Microsoft Edge, Firefox and many other chromium based browsers). You must be in browse mode to do this using the quick navigation keys.

Depending how you are going to test your webpage, locate the page you want to test and make sure NVDA is focused inside of that page. You can use the Ctrl key + Home key to go to the top of the page.
You need to be in browse mode to use the quick navigation keys in NVDA. If the content is marked up correctly, you should hear or see what NVDA is speaking.
There are many quick navigation keys that NVDA can use on a website, but the most common ones used are H for headings, B for buttons, L for lists, I for list items, T for tables, F for form fields, E for editable fields, C for combo boxes, R for radio buttons, D for landmarks, G for graphics, and K for links.

Make sure your links, graphics etcetera have Alt text as well, so that the screen reader knows what it is (for example a graphic with no Alt text associated with it will only say graphic). Instead, putting the Alt text into the graphic, means that the screen reader could say what it is (for example logo of NVACCESS).

Pressing one of those letters while in browse mode on a web page, will take you down by say H for headings (down the page) while adding a Shift key with that same letter H will take you back up the page by headings.
 
For a complete list of quick navigation keys that can be used with NVDA while on a webpage, please see the section called Single Letter Navigation in the user guide.

Using the say all command to read a webpage

You might want to hear your webpage read out by NVDA. While in browse mode, you can use the following keys. The first option is for a desktop user and the second for a laptop user.
Say all commands can also be used on a document.

NVDA + down Arrow
Say all

NVDA + A
Starts reading from the current position of the system caret, moving it along as it goes.

Press the Ctrl key to stop NVDA from talking if you want to hear what it is saying. Repeat the say all command for NVDA to start speaking again.

If you wish to adjust the speech rate that NVDA is talking at, you can do the following. Press the Ctrl key + NVDA key + down or up arrow key. The default shortcut is set to the rate slider. Using the up arrow key will increase the speed at which it is talking, and the down arrow key will decrease the speed at which it is talking. They must all be done at the same time while tapping the arrow key.

The following webpage by Web Aim called WebAIM: Using NVDA to Evaluate Web Accessibility may help you to use NVDA on a webpage and go more into depth on other ways you can improve your web site for screen reader users. The link to this page is https://webaim.org/articles/nvda/


HOME