Testing and debugging iOS accessibility for VoiceOver

Posted on Thursday, 9 May 2013 by Léonie Watson

When you build an iOS app it’s easy to make it VoiceOver accessible. Native UI controls have accessibility built-in as standard, and custom controls can be accessibility-enabled without difficulty.

When it comes to testing, there is no substitute for using your app on an iOS device with VoiceOver turned on. When your app (or prototype) is in a fit state to be deployed on a device, testing it with VoiceOver, or better still asking VoiceOver users to test it, will give you realistic feedback.

Accessibility Inspector (available in the iOS Simulator) can then be used to debug any problems you discover. Accessibility Inspector lets you simulate VoiceOver interactions, and examine the accessibility information that’s available for the controls in your app. Accessibility Inspector doesn’t have speech output, so it’s a debugging tool rather than a testing tool. Testing with VoiceOver and debugging with the Accessibility Inspector is a good approach though.

Testing with VoiceOver

You can turn VoiceOver on/off at any time by triple clicking the home button, but the first time it’s a good idea to go to Settings > General > Accessibility > VoiceOver and tap the switch to turn it on. At the same time check that Speak Hints is enabled (it’s on by default). Hints will help you use VoiceOver, and you’ll also want to test any hints included in your app.

When VoiceOver is turned on you’ll need a different set of gestures. The following basic gestures will help you test your app:

Move finger on screen
Causes VoiceOver to announce whatever is under your finger.
Single tap
Causes VoiceOver to announce the selected control.
Double tap
Activates the selected control.
Flick left/right
Moves to the previous/next control.
Three finger swipe left/right
Moves to the previous/next screen.

When you test your app it’s a good idea to simulate the experience of a VoiceOver user as closely as possible. Triple tap to turn the screen curtain on/off. This disables the visual display on the device, letting you explore your app using VoiceOver alone.

Debugging with Accessibility Inspector

To turn on Accessibility Inspector, run your app in iOS Simulator, go to Home > Settings > General > Accessibility and slide the Accessibility Inspector switch to on. This opens the Accessibility Inspector panel.

Accessibility Inspector will remain available until you use the switch to turn it off. However, you can temporarily turn it on/off using the toggle in the corner of the panel (a circle with an X).

When you use iOS Simulator you can mimic touch gestures with a mouse. A single click simulates a tap, and scrolling simulates flicking or dragging. With Accessibility Inspector turned on, a different set of gesture replacements is used:

Single click
Selects a control.
Double click
Activates the selected control.

Dragging or flicking can’t be simulated with Accessibility Inspector running. You need to temporarily disable it (toggle the close control in the upper left of the panel), then scroll the mouse to the desired location before enabling Accessibility Inspector again.

In the Accessibility Inspector panel you’ll find two types of information: properties and notifications.

Accessibility properties

You can examine the accessible label, value, hint (if available), accessibility traits and frame co-ordinates for each control. As you update your code the changes are reflected in real time, helping you experiment with different solutions.

Accessibility notifications

Notifications are messages that keep VoiceOver up-to-date with what’s happening in your app. For example, you might use UIAccessibilityAnnouncementNotification to notify VoiceOver users when some information appears briefly on screen.

Used in combination, testing with VoiceOver and debugging with Accessibility Inspector is an effective approach. For example, you might discover an unidentified control during testing. Using the Accessibility Inspector you can examine the control to make sure it has an accessible label and that the relevant traits have been enabled. If you need to make changes to your app you can check them in Accessibility Inspector, before verifying them with VoiceOver in the next release.

Use the Accessibility Inspector in XCode and iOS simulator

A short video tutorial by Ted Drake


About Léonie Watson

Léonie is Senior Accessibility Engineer at The Paciello Group. She joined the team in 2013, after more than a decade at Nomensa. Léonie is a member of the W3C HTML Working Group and HTML Accessibility Task Force. She is Chair of the British Computer Association of the Blind, and co-author of BS 8878 Web Accessibility Code of Practice. Léonie also writes for Net magazine, and talks at conferences about accessible technology.

Comments

  1. I’d like to see more on this in depth–e.g. problems that arise between code and VoiceOver outputs, techniques for using voiceOver to test more than simply listing gestures, control types that tend to be problematic and some standard fixes, etc.

Comments for this post are closed.

In retrospect, I wish we’d brought The Paciello Group into this one earlier than we did. We received the following from one of our clients after they spoke to Leonie: “I thank you. If I weren’t already a client, I certainly am now, and I’m glad for having referred a number of friends and family members to Schwab over the years.

Stephanie Reilley, Product Manager Investor Online Services, Charles Schwab & Co.