Screen Reader Ropes Course

Ropes Course Objectives

The goal of the ropes course is to give you practice navigating this simple web page with your screen reader of choice. We anticipate that the course will get its most use from people who are beginners with screen readers, and that by tackling the following tasks a number of times, you will achieve a level of proficiency and comfort at screen reader use, even if you don't achieve mastery here. Still, it should increase your skills to go through these various tasks forward, backward, with and without the help text, and even potentially with your screen turned off.

Course Setup

The tasks

1. Turn on your screen reader and check this box (stopwatch will automatically start, but no pressure!).
   To start VoiceOver, go to System Preferences > Accessibility > VoiceOver > Enable VoiceOver. You can also type Command + F5, or if your Mac has a touch bar, Command + triple click the Power button to the right of the touch bar. Once it starts, use the right arrow key to get to the checkbox and then the Space to check the box.

   To start NVDA, launch the program by clicking on it in the Windows start menu, then activate it on this webpage by clicking Control+Alt + N. Once it starts, use the down arrow key to get to the checkbox and then the Enter to check the box.

   Turn Narrator on by pressing the Windows logo key + Ctrl + Enter simultaneously. Once it starts, use the down arrow key to get to the checkbox and then the Space key to check the box.

   To start JAWS, Click the Start menu in the lower left-hand corner of the screen. Click “All Programs.” Click “Accessible Technology.” Click “JAWS.” You can also activate it on this webpage by clicking Control+Option + J. Once it starts, use the right arrow key to get to the checkbox and then the Space to check the box.

   In VoiceOver for iOS, enable quick launch by going to Settings > Accessibility > VoiceOver > enable quick launch, then launch it by triple clicking the home button or the side button. Swipe towards the right a number of times until you get to the check box associated with this task and double tap to select it.

   In TalkBack for Android, press and hold both the up and down volume buttons for three seconds. Navigate to this task by swiping to the right a number of times until you get to the check box associated with this task and double tap to select it.
2. Adjust the reading speed of your screen reader.
   In VoiceOver, hold the VO key (Control + Option) + Command + Shift + left or right arrow several times until you find Rate. Keep holding the VO key + Command + Shift and press the up or down arrow repeatedly until you find the right rate for you.

   In NVDA, hold NVDA (usually insert or caps lock) + Control + up or down arrow to adjust the rate. Hold NVDA + Control + right or left arrow to choose other settings you can adjust.

   In Narrator, type insert + + to increase the speed or insert + - to decrease the speed.

   In JAWS, hold Ctrl + Alt + Windows + PageUp or PageDown to adjust the rate.

   In VoiceOver for iOS, Go to Settings and tap Accessibility. Tap Spoken Content. Use the slider for Speaking Rate to adjust the speed.

   In TalkBack for Android, swipe up, then down in one motion repeatedly to select the option you want, in this case, “Speech rate”. Swipe up repeatedly to increase the reading speed, and down repeatedly to decrease it.
3. Turn the screen off and then back on.
   In VoiceOver, type VO + fn + Shift + _. Type that again to turn the screen back on. Alternately, you can enable trackpad commander by typing VO and spinning two fingers in a clockwise mostion on the trackpad, and then triple-tapping the trackpad with three fingers to turn it off or on. Disable the trackpad commander by typing VO and spinning two fingers in a counter-clockwise direction.

   In NVDA, type NVDA to open the menu. From the menu, choose Preferences, then Settings, then Screen curtain. Press space on the "use screen curtain" checkbox to enable the screen curtain and uncheck it to disable.

   In Narrator, there is no way to do this. To simulate blindness, you'll have to close your eyes and only open them again when you've decided to end your simulation.

   In JAWS, type insert + space, then afterward press F11. Turn the screen back on again with the same sequence of keystrokes.

   In VoiceOver for iOS, triple-tap the screen with three fingers. Triple-tap with three fingers again to turn it back on.

   In TalkBack for Android, swipe up, then right (or tap with three fingers) to open the Talkback settings menu. Swipe right repeatedly until you’ve selected “Hide Screen.” Double tap to activate it. Swipe right to go through the warning and then double tap again on “okay”. Follow the same steps again to turn the screen back on.
4. Set a hotspot (VoiceOver) or a PlaceMarker (JAWS or NVDA) in this list to return here quickly after each task to go to the next.
   To set a hotspot in VoiceOver, hold the VO key (CONTROL + OPTION) + SHIFT + the number you'd like the hot spot to be. To return to a hot spot, hold VO and press that number. To pull up a list of hot spots, hold VO and x.

   To use a PlaceMarker in NVDA, you first need to install the PlaceMarker addon which you can get by reviewibg https://addons.nvda-project.org/addons/placeMarkers.en.html. To install, activate the NVDA menu by typing NVDA + N and from the Tools menu, going to the Add on store... Go to the Available add ons tab, and search for Place markers. Install it, and restart NVDA to activate it. After activating it, set a PlaceMarker by CTRL+SHIFT+NVDA+Y. Navigate back to it by shift+NVDA+Y if it's the only bookmark you've set on this page, or by alt+NVDA+k to get a list of all PlaceMarks for this page.

   In Narrator, there is no way to do this. Just plan on jumping back to the Tasks heading level three and travel down the list until you get to the next unchecked item.

   To set a PlaceMarker in JAWS, press CTRL+SHIFT+K and save it. Then to jump back here, press CTRL+SHIFT+K, then SPACE, then ENTER

   In VoiceOver for iOS, unfortunately, there is no way to create a hotspot. You’ll have to jump back to the tasks Ordered List by activating the rotor by rotating two fingers on the screen until you reach the List option and flicking up until you’re back here.

   In TalkBack for Android, there is no way to perform this action. The easiest way to get back here is to navigate by heading (swipe up then down repeatedly until you’re on the Headings option, then swipe up repeatedly until you get to the The tasks Heading level 3.
5. Jump to the Main landmark.
   In VoiceOver, type VO+u to open the rotor. If you're not in the landmarks menu right away, use the right or left arrow until you are. Use the down arrow to select the Main landmark and Enter to go to it.

   In NVDA, go to a landmark by typing the Shift + D key to take you to te previous landmark, in this case, the Main.

   In Narrator, type D to go to the next landmark, or Shift + D to go to the previous one. In this case, since you're already in the main element, you'll type Shift + D.

   In JAWS, type Q to go to the main landmark.

   In VoiceOver for iOS, Activate the Rotor by rotating two fingers on the screen until you reach the Landmarks option and select it by lifting your two fingers up. Flick down a few times until you get to the Main landmark.

   In TalkBack for Android, there is no way to perform this action.
6. Jump to the Footer (hint: this may be referred to as "contentinformation" in screen reader parlance).
   In VoiceOver, type VO+u to open the rotor. If you're not in the landmarks menu right away, use the right or left arrow until you are. Use the down arrow to move through the landmarks until you get to the one called "contentinformation". Go to it by pressing Enter.

   In NVDA, navigate by landmark by typing D to get to the next landmark, in this case the footer, or "contentinfo".

   In Narrator, type D several times until you get to the footer landmark.

   In JAWS, type R several times until you get to the footer.

   In VoiceOver for iOS, activate the Rotor by rotating two fingers on the screen until you reach the Landmarks option and select it by lifting your two fingers up. Flick down a number of times until you get to the Footer landmark.

   In TalkBack for Android, here is no way to perform this action.
7. Jump to the Nav.
   In VoiceOver, type VO+u to open the rotor. If you're not in the landmarks menu right away, use the right or left arrow until you are. Use the down arrow to move through the landmarks until you get to the one called "top menu navigation". Go to it by pressing Enter.

   In NVDA, navigate by landmark by typing shift + D a couple times until you get to the main navigation.

   In Narrator, type shift + D several times until you get up to the main nav.

   In JAWS, type shift + R a couple times until you get to the main navigation.

   In VoiceOver for iOS, select the Landmarks option from the rotor. Flick up a couple of times until you get to the Navigation landmark.

   In TalkBack for Android, there is no way to perform this action.
8. Go to the h2 about the Screen Reader Comparison, then jump to the next h2.
   In VoiceOver, type VO+u to open the rotor. If you're not in the headings menu right away, use the right or left arrow until you are. Use the down arrow to move through the headings until you get to the one you want. Go to it by pressing Enter. Jump to the next heading by using the down arrow key.

   In NVDA, type 2 several times until you get to the heading level 2 you want. Type it once more to go to the next heading level 2.

   In Narrator, type 2 several times until you find the heading level 2 you want. Type it once more to go to the next heading level 2.

   In JAWS, type 2 several times until you get to the heading level 2 you want. Type it once more to go to the next heading level 2.

   In VoiceOver for iOS, select the Headings option from the rotor. Flick down a number of times until you get to the h2 on Screen Reader Comparison. Select Same Item from the rotor and Flick down to get to the next h2.

   In TalkBack for Android, swipe up, then down repeatedly until you get to Headings, then swipe down repeatedly until you get to the h2 about Screen Reader Comparison, then down again until you get to the next heading level 2.
9. Go to the h3 about NVDA, then jump to the previous h3.
   In VoiceOver, type VO+u to open the rotor. If you're not in the headings menu right away, use the right or left arrow until you are. Use the down arrow to move through the headings until you get to the heading level 3 about "NVDA". Go to it by pressing Enter. Once on it, use the keyboard up arrow several times until you get to the previous heading of level 3.

   In NVDA, type 3 several times until you get to the heading level 3 about "NVDA". Type shift + 3 to get to the previous heading level 3.

   In Narrator, type 3 repeatedly until you get to the heading level 3 you want. Type shift + 3 to get to the previous heading level 3.

   In JAWS, type 3 repeatedly until you get to the heading level 3 you want. Type shift + 3 to get to the previous heading level 3.

   In VoiceOver for iOS, Select the Headers option from the rotor. Flick down a number of times until you get to the h3 on NVDA, then select Same Item from the rotor and flick up once.

   In TalkBack for Android, swipe up, then down repeatedly until you get to Headings, then swipe down repeatedly until you get to the heading level 3 about NVDA. Swipe up several times until you get to the previous heading level 3.
10. Find the link to learn how to get started with JAWS, then jump to next link.
    In VoiceOver, type VO+u to open the rotor. If you're not in the links menu right away, use the right or left arrow until you are. Use the down arrow to move through the links until you get to the link you're looking for. Go to it by pressing Enter. Once on it, use the keyboard down arrow to go to the next link.

    In NVDA, press k repeatedly until you get to the link you're looking for. Press k again to go to the next link.

    In Narrator, type K several times until you get to the link you want, and then one more time to go to the next.

    In JAWS, type insert + F7 to get a list of links in the page. Use the up and down arrow to move through it, and enter to jump to the one you want. type insert + F7 again and find the link before this one to jump to.

    In VoiceOver for iOS, Select Links from the Rotor. Flick down a number of times until you find the Get Started with JAWS link, and then once more to go to the next link.

    In TalkBack for Android, swipe up, then down repeatedly until you get to Links, then swipe down repeatedly until you get to the link called, “Getting Started with JAWS”.
11. Navigate the table and find the estimated users of NVDA in the United States.
    In VoiceOver, type VO+u to open the rotor. If you're not in the tables menu right away, use the right or left arrow until you are. Use the down arrow to move through the tables until you get to the one you want. Go to it by pressing Enter. Once in the table, use VO + the keyboard up, down, left and right arrows to find the information you're looking for. Only the new heading is announced with the cell content as you move into a new row or column. If you forget the heading for the row or column you're in, have it announced to you again by moving perpendicular to your last move, and then back.

    In NVDA, navigate to the Table by typing t repeatedly until you get to the table you're looking for. Once in the table, type Ctrl + Alt + the keyboard up, down, left and right arrows to find the information you're looking for. Only the new heading is announced with the cell content as you move into a new row or column. If you forget the heading for the row or column you're in, have it announced to you again by moving perpendicular to your last move, and then back.

    In Narrator, type T to jump to the table, and then type Control + Alt + the keyboard up, down, left and right arrows to find the information you're looking for. Only the new heading is announced with the cell content as you move into a new row or column. If you forget the heading for the row or column you're in, have it announced to you again by moving perpendicular to your last move, and then back.

    In JAWS, navigate to the Table by typing t repeatedly until you get to the table you're looking for. Once in the table, type Ctrl + Alt + the keyboard up, down, left and right arrows to find the information you're looking for. Only the new heading is announced with the cell content as you move into a new row or column. If you forget the heading for the row or column you're in, have it announced to you again by moving perpendicular to your last move, and then back.

    In VoiceOver for iOS, select the Tables option from the rotor, then flick down to go to the table. Swipe right to get into the table. Once in it, swipe left or right to move right or left in the table row. To go to the next or previous row, select Rows from the Rotor and flick down or up.

    In TalkBack for Android, navigate to the table by going to the Screen Reader Comparison heading level 2, then move forward into the table and from cell to cell by swiping towards the right.
12. Find an image with the alt of "The word Evaluation arranged in a circle with another word, 'Evaluation' overlaid on it", and then jump to the previous graphic.
    In VoiceOver, type vo + command + g (for graphics) repeatedly until you find the right image. Move backward through the images by typing vo + command + shift + g.

    In NVDA, go through the Graphics by typing g repeatedly until you find the right image. Move backward through the images by typing shift + g.

    In Narrator there’s really no way to do this except by having it read you the whole page and listening for “image” with the alternative text after that.

    In JAWS, go through the Graphics by typing g repeatedly until you find the right image. Move backward through the images by typing shift + g.

    In VoiceOver for iOS, select the Images option from the rotor and flick right several times until you hear the indicated alt text. Flick left to jump to the previous image.

    In TalkBack for Android, there is no systematic way to perform this task, so just walk through all the content by swiping right repeatedly.
13. Go to first list and find the third item, then jump to the next list and find the second item.
    In VoiceOver, type VO+command + x repeatedly until you get to the right list. Use the right and left arrow keys to move forward and backwards in the list. Type VO+command + x to go to the next list.

    In NVDA, navigate by List by typing l repeatedly until you get to the right list. Once to the list, type i and shift + i to go forward and backward through the items.

    In Narrator, type L to go to the next list. Type I three times to go to the third item. Type L two more times to go to the third list, and I twice to get to the second item.

    In JAWS, navigate by List by typing l repeatedly until you get to the right list. Once to the list, type i and shift + i to go forward and backward through the items.

    In VoiceOver for iOS, select the Lists option from the rotor, and flick down once to get to the first list. Flick right three times to listen to the third item in the list, then flick down to jump to the next list and right twice to get to the second item.

    In TalkBack for Android, there is no systematic way to perform this task, so just walk through all the content by swiping right repeatedly. When you do come to a list, it’ll say, “one of three” when you land on the first item.
14. Search webpage for "mid-nineties", and find out what happened then.
    In VoiceOver, type vo + f to search the page for text. Hit enter to activate. Type vo + g to find the first instance. Type vo + p to read the paragraph containing your search term. To find the next instance on the page, type VO + G.

    In NVDA, type nvda + control + f to Find a word or phrase.

    In Narrator, type Insert + Control + F to open the find dialogue. Enter your search term and then type Insert + F3 to move through your results.

    In JAWS, type control + f to Find a word or phrase.

    In VoiceOver for iOS, there is no way to perform this action.

    In TalkBack for Android, open the search feature by swiping up and right to open the TalkBack menu. Swipe to the right repeatedly until you get to the Find in page option. Double tap to activate. Swipe through the keyboard to find each letter and pull your finger up to type the letter you’re on.
15. Jump to the form at the end of the page and submit it with any comments or questions. We'd love to hear your experience, and if this helped you become more proficient in using a screen reader.
    In VoiceOver, type VO+u to open the rotor. If you're not in the orms menu right away, use the right or left arrow until you are. Use the down arrow to move through the forms. Go to it by pressing Enter. Once in it, use the Tab key to advance to the next field. Use the Enter key to submit the form.

    In NVDA, navigate to the Form by typing F to navigate to the next form field. After filling it out, type Tab to advance to the next field. Use the Enter key to submit the form.

    Type F to jump to the form at the bottom of the page. Use Tab to move through it, or Shift + Tab to move backwards. Once you tab into a field you should be able to type as usual. Tab to the submit button and use the Enter key to submit the form.

    In JAWS, navigate to the Form by typing F + f to navigate to the next form field. After filling it out, type Tab to advance to the next field. Use the Enter key to submit ithe form.

    In VoiceOver for iOS, select the Forms option from the rotor and swipe down to go to the form. Once in an input field, use your device’s text-to-speech capabilities to fill the field in. Swipe right to get to the next field. Double-tab when you get to the submit button.

    In TalkBack for Android, there is no systematic way to perform this task in TalkBack. Navigate by heading to the heading level two for “Screen Reader Ropes Course Exit Survey”. Move into the form by swiping right, That’s also how you navigate from field to field until you get to the Submit button. You’ll double tap to activate it.

What is a screen reader?

Blind people can't see computer screens where most web pages are intended to display. Luckily, since HTML (the language all web pages are based on) is text-based, this can be refactored into something that can be understood by blind users. This is done with a screen reader program in connection with a web browser.

The screen reader and browser work together to read a webpage out loud to its user. Since it would be very tedious for the user to hear every element of the webpage read to him or her just as it appears on screen, screen readers give their users methods of skipping around the page in various ways. Although in most cases these don't make it so that screen reader users can digest the page as shallowly and quickly as a sighted user, it does help to close the gap somewhat.

The major screen readers

There are dozens of different screen readers that each work in a slightly different manner, but there are basically three dominant screen readers.

VoiceOver

VoiceOver is the least used of the big three screen readers, but we mention it first for a couple reasons. First, it's the most easily available to the certain demographic that it serves: the Apple Computer users. VoiceOver comes preinstalled with every Apple computer and iphone OS, and has done since 2005 for the computers and 2009 for the phones. You don't need to download it, or pay for a license, or set it up, or anything. It's there already, and ready to work.

Second, if you're an Apple user, VoiceOver is the only option. While I mentioned there are dozens of screen readers out there, the only one available for Apple is VoiceOver. I'm not sure whether Apple created and maintains VoiceOver because the other screen reader creaters hadn't made one available for Mac, or whether the creators haven't offered a Mac product because VoiceOver is already an option, but for whatever reason, VoiceOver is all there is for Mac.

Top three reasons to use VoiceOver

1. You use a Mac for your laptop or desktop computer, so VoiceOver is your only option
2. You regularly use VoiceOver on your phone, and are used to the Rotor, and navigating the page in different ways through it.
3. You want to support the company that has made accessibility for the blind a built-in and well-supported part of its offering.

Getting Started with VoiceOver

Follow this link to learn how to get started with VoiceOver.

NVDA

In 2006 two blind computer scientists started developing the NonVisual Desktop Access (NVDA) program which they released for Windows and made it open-source. Initially NVDA was the least-used screen reader because it was the newest, but since its release its popularity has steadily grown until it surpassed the major commercial product in 2019, but then its usage declined and was again surpassed in 2020.

Top three reasons to use NVDA

1. You are a blind Windows user and can't or don't want to pay an expensive license for a screen reader.
2. You are a web developer who uses Windows or Linux and wants to test your work without JAWS's opinionated guesses. You want to know what problems there are with the site rather than have a smooth experience based on the screen reader's attempt to present everything in the site to you most intelligently.
3. You are a blind computer user who lives outside of the United States. JAWS is extremely difficult to obtain a license for outside of the United States, but NVDA is freely available everywhere.

Getting Started with NVDA

Follow this link to learn how to get started with NVDA.

JAWS

Freedom Scientific had created a freely available screen reader for MS DOS machines in the 80s, and called it Job Access With Speech (JAWS). In the mid-nineties when Windows began to be the dominant operating system, JAWS was rewritten for Windows and has served that platform since then. It is the most expensive of the screen reader options, costing about $100 for an annual personal license, or $250 per quarter for a professional license.

JAWS was very briefly surpassed in pupularity by NVDA, but is now back in the most-popular spot, particularly among blind users. JAWS is reportedly the most customizable screen reader, and it also does some guessing to try to provide to its users such things as missing labels for form fields. These features make for a better experience for users who depend on the software for their experience online, though this makes it a less useful tool for web developers trying to provide an accessible experience to their users, as JAWS's guesses may hide or obfuscate some problems in the code that ought to be remediated.

Top three reasons to use JAWS

1. You have a Windows computer and use JAWS as your daily driver because of how smoothly it works.
2. You like the extensive customization that is allowed by JAWS.
3. Your JAWS license is provided by your school or work.

Getting Started with JAWS

Follow this link to learn how to get started with JAWS.

Screen Reader Comparison

Why you should test your site with a screen reader

Many aspects of your site can be tested without a screen reader. There are lots of visual aspects of your site that can present problems to users with colorblindness or contrast sensitivity problems, as well as parts of it that can present cognitive challenges to users with ADHD or other cognitive disabilities. But the single largest group of internet users from the disabled community likely to visit your site are the blind.

While you can theoretically code things in such a way as it should be correctly read by all screen readers, the sad fact of the matter is that screen readers often interpret code slightly differently from what you'd expect. Because of this, you should really test your site on a screen reader, and ideally on several different ones. Just like you check your site out to make sure it works well at a variety of different screen sizes, you should really make sure that it works for screen readers as well.

Acknowledgements: This ropes course was designed and implemented by Deneb Pulsipher, Captain Accessible here at Seamonster Studios, with the help and guidance of Kosi Asabere, accessibility UX specialist.