VoiceOver and Safari: Screen reading on the Mac
One of the most interesting features of Mac OS X v10.4 Tiger, the newest version of Apple’s operating system, is VoiceOver, a built-in screen reader. Up until now, people needing a screen reader have been more or less forced to use Windows because of the lack of decent screen reader software for the Mac, but now it’s built right into the Mac OS.
This is very exciting for me as a Mac using accessibility advocate, and VoiceOver was the main reason for me to buy Tiger since I don’t care much about Spotlight, Dashboard and the other new gadgets. VoiceOver has made checking my work in a screen reader a lot easier. It doesn’t have all the features of a more advanced screen reader like JAWS, but from the testing I have done so far it seems to do a decent job. Especially when you take the price into account.
VoiceOver is yet another reason for all you Windows using web professionals to get yourselves a Mac for testing. Buy a Mac Mini and you get a cute little Mac and a decent screen reader for less than the price of a single JAWS license ;-). Heck, you could even buy two Mac Minis for that money.
When I was getting started with VoiceOver I did get a little confused at first. I can’t find any good tutorials on using VoiceOver to browse websites with Safari, and that’s what I want to do. After reading the online help and the documentation I could find in the VoiceOver support area of Apple’s website, and spending some time browsing the web with VoiceOver, I’m beginning to get the hang of it.
For those of you who have Mac OS X Tiger installed, here’s a very basic guide to listening to a web site with VoiceOver:
- Activate VoiceOver by pressing Command-F5.
- Bring up Safari and load the site you want to listen to.
- VoiceOver will read the first item of the page and stop. This is where things get a little confusing. To me the most logical thing to do when a new site is loaded would be to start reading the whole page. I haven’t been able to make VoiceOver do that automatically.
- To get VoiceOver to read the entire page, first press Control-Option-Up Arrow. VoiceOver will say
Stop interacting with HTML content. If you look carefully you’ll see that the VoiceOver cursor (defined by a black two pixel outline) is covering Safari’s viewport area.
- Now press Control-Option-A. VoiceOver will read the contents of its cursor, in this case the whole web page, from start to end unless you interrupt it.
That should get you started.
Of course, just listening to a web page being read out loud is not enough. For starters, you need to be able to move around on the page and follow links. That’s when you need a few basic navigation commands:
- Interact with an item
- Control-Option-Shift-Down Arrow
- Stop interacting with an item
- Control-Option-Shift-Up Arrow
- Read all text
- Move up
- Control-Option-Up Arrow
- Move down
- Control-Option-Down Arrow
- Move to previous
- Control-Option-Left Arrow
- Move to next
- Control-Option-Right Arrow
- List the items in a window
- List all links in a document
- Perform the default action for a selected item (e.g. follow a link)
- Control-Option-Space bar
- Pause/Continue reading
There are many more commands, but those are the ones I find myself using the most. For the rest, check out the online help and the keyboard layouts in the Keyboard Commands (pdf) document Apple provides.
When you first listen to a page in VoiceOver you may be surprised by how much of the punctuation it leaves out. The default setting is to read no punctuation, which can be nice in some cases, but other times you actually want to hear everything. There’s an easy way to adjust how much it reads: press Control-Option-V to bring up the Verbosity menu, then use the arrow keys to choose a setting and change its level. I increased the verbosity slightly since I want to hear some punctuation.
You can also change a lot of other stuff, like which voice it uses, the pitch and speed of the voice, and the size and position of the visual feedback.
There are some things that I haven’t yet figured out how to do (if they are even possible):
- Skip links. Skip links hidden with CSS are announced, and you can follow them. The problem is making VoiceOver continue reading from the link’s target. No matter what I do it always continues reading right after the skip link itself. This is obviously not what I want, since it makes skip links pretty useless. Unless I’m doing something wrong, VoiceOver doesn’t handle internal links very well.
- Title attributes. It would be nice if you could configure VoiceOver to read title attributes if they exist.
- Tables. VoiceOver seems to ignore HTML tables. Not their contents, but any accessibility enhancements such as summaries and headers. It basically treats all tables as if they were layout tables. I find this a little odd considering VoiceOver has specific commands for interacting with tables. Either I’m missing something or those commands are not meant for HTML tables.
- Continue reading. If you interact with a form control or manually skip past something, VoiceOver will stop reading. I haven’t been able to find a way of making it continue reading the rest of the page once it’s been stopped. Stepping through the page manually works, but it would be nice to have it just keep reading until you tell it to stop.
I think VoiceOver works well, and having a screen reader built into the operating system is great. Hopefully having easier access to a screen reader will make more people aware of how horrible it can be to try to navigate an inaccessible website when you can’t see it. Oh, the insane
alt attributes I’ve been listening to…
I’m by no means as experienced with screen readers as someone using one on a daily basis, so if there are any expert screen reader users reading this, I’d love to hear your impressions of VoiceOver (assuming you’ve had a chance to try it out). Knowing how VoiceOver compares to other screen readers like JAWS would also be very interesting.
There’s obviously room for improvement (there always is), but I think it’s a very good thing to have a screen reader built into the OS. Let’s hope the developers at Apple listen to feedback and work to make VoiceOver even better.
Subscribe / follow
- Senior Product Designer at One Medical Group (San Francisco, CA, Ca, US)
- Front-End WordPress Dev: PSDs to Responsive WordPress Themes at 1123Interactive
- Web QA Automation Engineer at SnapApp (Watertown, MA, Ma, US)
- Front-End Developer at Happy Cog (Austin, TX or Philadelphia, PA, Pe, US)
DreamHost web hosting
Use the promo code 456BEREASTREET3 to save USD 20 when you sign up for DreamHost