Use Screen Reader on iOS in Live

Test accessibility using the Screen Reader feature on real iOS devices in Live.

Manual accessibility testing of your website with a screen reader is critical to ensure that your website is accessible to all and is Web Content Accessibility Guidelines (WCAG) compliant. You can use the Screen Reader feature in Live to test accessibility of your website on supported real iOS devices and browsers.

The Screen Reader feature enables the VoiceOver screen reader on the iOS device. With Screen Reader, you can hear the audio descriptions of what’s on the screen. You can verify things like whether the order of elements on a page follow a logical progression, the navigability of the website with a keyboard, and more.

In this guide, you learn about:

• Supported iOS devices
• Enable and disable Screen Reader
• Navigation when using Screen Reader
• Test accessibility with Screen Reader using keyboard shortcuts

Supported iOS devices

The following iOS devices support the Screen Reader feature:

On the Live dashboard, devices that support the Screen Reader feature appear with the accessibility icon next to them, as shown here:

Enable and disable Screen Reader

To enable or disable Screen Reader:

1. Log in to the Live dashboard.
2. On the Live dashboard, select the device-browser combination to start your test session.
   Ensure that the device you select has the accessibility icon next to it.
3. On the Live toolbar, click the Screen Reader option.
4. On the Screen Reader prompt:
   • Switch on the Screen Reader toggle to enable Screen Reader.
   • Switch off the Screen Reader toggle to disable Screen Reader.

The following video demonstrates how the Screen Reader feature works:

Navigation when using Screen Reader

Your end-users navigate your website on a VoiceOver-enabled iOS device using one of the following ways:

• Keyboard shortcuts on a Bluetooth keyboard
• Touch gestures

The navigation behavior on iOS (such as moving to the next or previous element or auto-reading from the start of the page) that can be performed with these two methods will be referred to as VoiceOver actions from here on.

On an iOS device, you can perform VoiceOver actions using either keyboard shortcuts or touch gestures. To perform such actions on an iOS device in a Live test session, you have to use keyboard shortcuts.

Test accessibility with Screen Reader using keyboard shortcuts

Ensuring that your website is accessible with keyboard shortcuts ensures that your website is accessible with touch gestures. To know more, see Accessibility with keyboard shortcuts ensures accessibility with touch gestures.

For the Screen Reader feature on iOS devices in Live, use the following keyboard shortcuts to trigger VoiceOver actions:

The following video demonstrates how to trigger VoiceOver actions using keyboard shortcuts:

Accessibility with keyboard shortcuts ensures accessibility with touch gestures

When you use an iOS device in regular mode, that is, when VoiceOver is off, a swipe left or swipe right gesture might take you to the previous or next screen on the home page. When VoiceOver is on, the same swipe left or swipe right gesture triggers a VoiceOver action, that is, moving focus to the previous or the next UI element on the screen.

However, in Live, even when VoiceOver is enabled using the Screen Reader feature, touch gestures trigger the regular usage actions and not the VoiceOver actions.

WCAG compliance and accessibility ensure aspects such as:

• UI elements and controls on your website are reachable and in the correct order when traversed in linear order via touch gestures like swipe left/right, or corresponding keyboard shortcuts for moving to previous or next element.
• The description of UI elements and controls on your website is such that it makes sense to a user hearing them via the VoiceOver audio readout.

Hence, it makes no difference to your website’s accessibility rating whether the end user navigates the website using the keyboard or touch gestures when VoiceOver is enabled. The ordering of UI elements, their reachability, and their description remains the same regardless of the navigation method.

When testing with the Screen Reader feature, if your website is accessible with keyboard shortcuts, then your website is also accessible with touch gestures.