Reading a Web Page using Apple Voice Over

Saptarshi Katwala
accessibility-a11y
Published in
4 min readFeb 23, 2019

--

Apple Voice Over is a very powerful screen reader. It is available out-of-box in Macs and in iOS devices including iPads and iPhones. This article shows how to quickly get started using Apple Voice Over and how can it enable reading or more specifically the narration of web pages. This goes over the following 3 use cases:

  • Using Voice Over to scan and find a specific section
  • Going through headings one at a time
  • Reading using Voice Over

Intended audience

  • Users who would like to read web pages being read out
  • Digital Product Owners wanting to test their web pages for accessibility
  • Mac access required

Starting Voice Over

There are at least 2 ways to start Voice Over.

  1. Keyboard Short Cut — Command + F5 .
  2. Going to System Preferences; clicking Accessibility and clicking the Enable Voice Over Check box

Reading Wikipedia page using Voice Over

Let us consider a fairly common use case of screen reader — in fact the most canonical use case. A user is looking for specific information on a web page that contains lot of content. E.g. the user opens Wikipedia page of Planet Earth to look for physical characteristics of earth. The user will scan through the headings, the sub headings, the tables, images, captions under the images, etc. till she (or he) finds the specific section of interest.

Voice over allows such a narrated scan of content. This feature in Voice Over is called Rotor and is activated using keyboard short cut of “Control+Option+U”. The “Control + Option” key is also known as VO key (within Voice Over documentation). So in Voice Over documentation, this command may be expressed as VO-U.

  1. Scan (via narration of Voice Over) . the main items of the page

The rotor appears as shown in screen shot below. Is shows an empty modal windows titled “Web Spots”. Now let us use this rotor modal window to scan this page to identify specific section of interest.

To do the, keep pressing the Right Arrow Key or the Left Arrow Key.

For each press, views and corresponding narrations for the following items will appear that exist on the page

  • Tables
  • Landmarks
  • Articles
  • Headings and Sub Headings
  • Forms

Clicking the Up or Down Arrow and Enter key will allow user to go the specific section. This closely resembles the behavior of normal users who would be looking for specific items, they would scan for such items and go to that section to read more.

2. Go to each Heading without using the Rotor

The rotor is great feature but Voice Over has other powerful features that allow users to read the page strategically. If the user wanted to read each heading on the page, they would use the command, “Control+Option+Command+T”. Now for each such click the screen reader will travel to the next heading (or a sub heading within heading). The screen shot below shows the heading of Physical Characteristics having been selected (and also narrated) by Voice Over using this command. The “Control + Option” key is also known as VO key (within Voice Over documentation). So in Voice Over documentation, this command may be expressed as VO-Command-T.

3. Start Reading the Page

The Voice Over Command for this is “Control + Option + A” or VO-A, pressing the “Control” key stops the reading.

Conclusion : While there are many Voice Over commands, the Rotor (VO-U) is very effective in consuming informational content on a page as normal user would. Its companion command “VO-Command-T” allows users to scan and hear headings. Once a specific section is identified, Voice Over will narrate that section using VO-A.

--

--

Saptarshi Katwala
accessibility-a11y

I am a software developer/applications architect. I have a special interest in Web Accessibility.