NVDA Screen Reader - A Tutorial for sighted testers

It can be useful for sighted people to use a screen reader from time to time, for example to test programs or web applications. Of course it makes more sense to have such applications tested by blind people, but even they sometimes don't feel like it and a bad test is better than none.

This guide applies to the free desktop screen reader NVDA.

Article Content

First steps

NVDA can be installed or used without installation (portable). The portable version is sufficient for occasional use. Both versions can be found on the project page. The portable version is also recommended if you do not have admin rights, which is common for company computers.

The program can be found on the website nvaccess.org. It is installed like a normal Windows software, during the installation you can have a portable version created.

The screen reader should always be started before the browser or other application to be checked.

NVDA does not have a graphical user interface, only the configuration menu. This can be achieved with the key combination Insert + N. The menu itself can be operated with the mouse.

NVDA's voice output is called eSpeak. It sounds a little tinny. Starting with Windows 8, the simple screen reader Narrator is integrated, which also has German voice output. This voice output has a pretty good sound and it can be easily integrated into NVDA. To adopt this language we go to NVDA -> Settings -> Speech output, there we select “Microsoft Speech API 5”. This means that the standard Windows voice is integrated into NVDA. On Windows 10 you can also use the so-called one-core voices, which are also available via the NVDA dialog. They are usually selected by default during a new installation of Windows 10, so there is nothing further to do.

In order to hear what information is output about a specific element, the cursor announcement can be activated. To do this we go to Settings -> Mouse settings and activate announce object type under the mouse cursor. You can turn this on and off with NVDA + M.

The announcement under the mouse cursor is not reliable; the only relevant thing is what is announced with the screen reader when it comes into contact with the virtual cursor.

In HTML there is a function to automatically assign focus to input fields. NVDA activates the so-called form mode, which is used to fill out forms. In most cases this is just annoying, so we turn it off. To do this we go to Settings -> Reading mode and click away the two options for automatic focus switching.

Navigation keys

Blind people move through a website using the navigation keys. For example, if you press the "H" key once, the screen reader will jump to the next heading. With "n" you can ensure that all clickable elements such as links are skipped, so that you can find the text area of the page more quickly.

Important buttons are:

  • H = to the next heading
  • G = to the next graphic
  • i = next list item
  • INSERT + F7 = List of links and headings
  • CTRL + HOME = Move screen reader focus to top of page

Check tables

Press T to jump to the first recognized table. You can move systematically through a table by holding down the CTRL + Alt key and using the arrow keys. For example, use CTRL ALT + Right Arrow to move right, use CTRL ALT Down to move down, and so on.

The most important thing here is that the elements are announced in the same order as they are visually displayed.

An existing short description is read out when you jump to the table with T or when you reach the table via the running text.

Forms

If you want to check a form, activate form mode. First jump to the next form field with F. With Insert + Spacebar you activate the form mode and can write text with the keyboard as normal. Use Insert + Space to exit form mode. The form mode can be recognized acoustically by a clicking noise.

In form mode you can proceed as follows: All elements should be able to be tabbed in a logical order, i.e. oriented towards the visual structure.

  • The space bar activates/deactivates checkboxes
  • With ALT arrow-down you can expand selection fields or select fields, with Return an option is selected and the select box is closed

  • Radio buttons are selected using the up or down arrow

If form mode is not activated, you can use the following keys:

  • Use F to jump from form field to form field
  • Use E to jump to the next input field
  • X = next checkbox
  • r = next radio button
  • C = next select field

    • Useful tools

    For developers and the curious, there are some helpful tools like the language viewer. The voice viewer outputs the information as text, which is normally output as speech or Braille. We find it under Extras -> Language Viewer. The window lies over the screen, but as usual with Windows, it can be pushed into a corner where it doesn't bother you. The voice viewer also works when the voice output is switched off, to do this we go to Settings -> Speech output and select No speech in the drop-down box or press NVDA + S.

    Protocol

    The protocol could also be interesting. I'm not a developer myself, so I'll leave the assessment up to you. First, we can set the logging mode. To do this we go to Settings -> General settings and select the logging level there. There is also a debug mode there, but that could just be intended for debugging NVDA itself. After the work is done, you can view the log under Settings -> View Extras View Log.

    If you have already dealt with the accessibility interfaces, you can access useful information about the current application using Insert + F1. There is various information about the API used and a lot more.

    With Insert + F7 we can display all headings, links or jump anchors in the browser window.

    With Insert - down arrow everything that is behind the cursor is read out. So when you are at the beginning of the page, the page is read out in its entirety, including links, navigation elements, footer and what else there is. However, I don't know anyone who would listen to this voluntarily, especially since it can take a few minutes for the screen reader to reach the bottom of the page. This is not a way to get a good overview of the site because there are simply too many elements and no one can remember them. If you move the mouse cursor over an element such as a button, you can hear what information NVDA can read from this element. This is also displayed in the voice viewer.

    Make sure that the cursor is not be in the address bar or search field of the browser, but must be in the browser window. If you heard a clicking noise, the screen reader has switched to form mode, in which forms can be filled out. In this case, quickly press Insert + Space.

    Interaction with desktop programs

    There are several ways to interact with desktop programs. The old menus that you open with ALT and can go through using the arrow keys are classic. This also works with the ribbons of the Office programs or Windows Explorer.

    There are also the desktop apps introduced with Windows 10. They behave a little more like websites than desktop programs. Here you can go through the elements using Tab. There are special key combinations to switch between individual programs.

    Object navigation

    There are different types of cursors. On the one hand, there is the navigation shown above with the PC focus. There is also object navigation.

    Certain elements cannot be accessed with PC focus, for example in Windows apps. Here you can move around with a tab, but texts, for example, are skipped. These elements can only be reached using object navigation.

    Object navigation views elements as hierarchical. The Word window, for example, is the top level, the menu bar is a sub-level, the icons are a sub-level of the menu bars, and so on.

    The Num pad is required for object navigation; it should be switched off.

    • Press INSERT + 4 and 6 to move within a hierarchy.
    • Press Insert + 8 or 2 to move up and down within the hierarchy.
    • Press Insert + 5 to query the object focus position.

    Interaction with forms and applications

    To interact with forms and applications we need to switch between focus mode and form mode. In form mode we can write text or change elements using the keys. The form mode is activated/deactivated with NVDA + space bar, which is conveyed by a ratchet sound.

    Let's stay in focus mode for now: If we press F, we can reach all elements that NVDA recognizes as form elements. In principle, for NVDA there is no difference between form elements and control elements in an application such as a video player or a word processor on the web.

    Once we have reached a form with F or Tab, we activate the form mode with NVDA + spacebar. With Tab and Shift + Tab we move through the elements, with the arrow keys we move through radio buttons, with the space bar we activate checkboxes, with Alt-Down arrow we open select boxes, with the left-right arrow we use sliders, with return we use the form.

    It is important that the visual labels of the element or a functionality are read out, the status of which is activated or deactivated, any text entered can be read and changed, and the position of a slider is also read out when changed.

    Conclusion

    For people who don't regularly work with screen readers, the Speech Viewer may be the easiest way to test web applications. The biggest challenge may be that elements are not simply represented, but described.

    For further reading