Testing an app or website with VoiceOver on iPhone and iPad

VoiceOver is the screen reader built into iPhone and iPad. It reads the screen aloud, helping people who have little or no sight.

You can also use it to discover whether an app or website makes sense without sight. You hear the names of buttons, links, headings, fields, errors, images and other elements.

This does not replace a full accessibility assessment, but it helps you find many practical problems yourself. If you have little experience using or building for screen readers, it can reveal a lot.

You do not need to master VoiceOver to test with it. The aim is not to pretend to be blind. We want to check whether important elements are understandable and usable with a screen reader.

Before you begin

VoiceOver completely changes how your iPhone or iPad works. Normal tapping no longer works in the same way. Once enabled, you use special gestures.

With VoiceOver on:

• Tap once to select an element and hear it.
• Double-tap to activate the selected element.
• Swipe right to move to the next element.
• Swipe left to move to the previous element.

Keep these instructions handy before turning it on.

Tip: start in Apple’s VoiceOver tutorial, where you can practise gestures without opening or changing anything. Find it in Settings > Accessibility > VoiceOver > VoiceOver Tutorial.

What can you test with VoiceOver?

You can check whether:

• Buttons have clear names.
• Links make sense without extra context.
• Forms have suitable labels, instructions and errors.
• Images have useful text alternatives.
• Elements follow a logical order.
• Website headings have a suitable structure.
• Sliders, menus, tabs and pop-ups work.
• Status messages are announced.
• Important information is available beyond its visual presentation.

The goal is to reach and operate everything with VoiceOver.

Useful terms

VoiceOver cursor

The VoiceOver cursor shows the element VoiceOver is currently reading.

You usually move it by swiping left or right.

Rotor

The rotor is a VoiceOver menu for quickly switching between settings or types of elements.

On websites, options include:

• Headings
• Links
• Form fields
• Images
• Words or characters
• Speaking rate

Turn two fingers on the screen as though turning a dial.

When you reach the desired option, swipe up or down with one finger to use it. With Headings selected, this moves to the previous or next heading.

Split-tap

You normally activate an element with a double-tap. Split-tap is a useful alternative.

Keep one finger on an element and tap elsewhere with another finger. This activates the element under your first finger.

It can be easier with small buttons or if double-tapping is difficult.

Screen Curtain

Screen Curtain turns the screen black while the device remains active. It helps you check whether you are really working by sound.

Only enable it if you know how to turn it off:

Triple-tap with three fingers

Apple uses a different gesture when Zoom is also enabled. Leave Zoom off for this test.

VoiceOver across Apple devices

Apple introduced VoiceOver on iPhone in 2009. It was available on iPad from its launch.

VoiceOver works differently on Mac, where you mainly use a keyboard. On iPhone and iPad, you mainly use touchscreen gestures.

For websites, test with VoiceOver in Safari. For apps, test in the app itself.

Turning VoiceOver on and off

There are several ways to turn VoiceOver on and off.

Through Settings

Go to Settings > Accessibility > VoiceOver.

Turn VoiceOver on or off there.

Through Siri

Ask Siri to Turn on VoiceOver or Turn off VoiceOver.

Through Accessibility Shortcut

Add VoiceOver to Accessibility Shortcut in Settings > Accessibility > Accessibility Shortcut.

Depending on your device, you can then:

• Triple-click the side button.
• Triple-click the Home button.
• Triple-click the top button.
• Use a shortcut in Control Centre, if added.

The physical button depends on your iPhone or iPad model.

Practise safely first

Apple provides a practice environment.

Go to Settings > Accessibility > VoiceOver, enable VoiceOver and open VoiceOver Practice.

Practise tapping, double-tapping and swiping. VoiceOver explains each gesture without accidentally opening apps or changing settings.

Basic gestures

You need these gestures for almost every test.

Two-, three- and four-finger gestures

Use this as a reference. You do not need to memorise every gesture.

Using the rotor

The rotor is useful for moving quickly between particular website elements.

1. Turn two fingers on the screen until you hear the option you want.
2. Stop at Headings, Links, Form Controls or Images.
3. Swipe up or down with one finger to move to the previous or next element of that type.

Choose which options appear in Settings > Accessibility > VoiceOver > Rotor.

For web testing, I find these useful:

• Headings
• Links
• Form fields
• Images
• Landmarks, if available
• Words
• Characters

You can also add a voice for another language or the speaking-rate control. Automatic language switching does not always work well, so manually selecting a voice can help when testing in another language.

Testing with VoiceOver

Here is how to put those gestures into practice. Start by reading a screen, then test specific elements.

Test 1: explore the screen

Open the app or website, enable VoiceOver and swipe right with one finger through the screen.

Check:

• Do you hear where you are?
• Is the order logical?
• Is all important content announced?
• Are there duplicate or unnecessary announcements?
• Are buttons, links and fields identified correctly?
• Do you get stuck?

Then drag your finger around the screen. VoiceOver reads what is under it. This helps reveal elements that VoiceOver does or does not find.

Test 2: activate buttons and links

Select a button or link by swiping left or right.

Activate it by double-tapping with one finger, or use split-tap: hold one finger on the element and tap with another finger.

Check:

• Does the button have a clear name?
• Is it identified as a button or link?
• Is the result of activating it clear?
• Does focus move logically after opening or closing something?
• Can you go back with the two-finger Z gesture?

Test 3: test a website in Safari

Open the website in Safari.

First swipe right to check the ordinary order. Then use the rotor to explore particular element types.

Headings

Set the rotor to Headings and swipe up or down.

Check:

• Is there a clear main heading?
• Do headings follow a logical order?
• Do they explain what the page is about?
• Are any visible headings missing from the rotor?
• Does the rotor include text that is not really a heading?

Links

Set the rotor to Links.

Check:

• Do link texts make sense without extra context?
• Do you hear more than just read more, here or click here?
• Is it clear whether a link leads to a download, another page or an external website?

Forms

Set the rotor to Form Controls or swipe through the form.

Check:

• Does every field have a clear label?
• Are required fields identified?
• Are instructions announced?
• Are errors announced?
• Is it clear how to correct an error?
• Can you submit the form?

Images

Set the rotor to Images, if available.

Check:

• Do informative images have useful alternatives?
• Are decorative images kept out of unnecessary announcements?
• Do you hear filenames such as image-1234.png?
• Is visible text inside images also provided as ordinary text?

VoiceOver Recognition can sometimes describe images or screen elements using Apple’s AI. This helps users, but does not replace suitable text alternatives and accessible code.

Test 4: test an app

Open the app and begin on its first screen. Swipe right through the whole screen.

Check:

• Is the screen title clear?
• Do you hear what you need to do?
• Do buttons, tabs and icons have clear names?
• Are switch states, tabs and selected options announced?
• Is the element order correct?
• Can you activate everything with a double-tap?
• Can you go back or close things without getting stuck?

Where present, test at least:

• Menus
• Tab bars
• Forms
• Error messages
• Search
• Filtering or sorting
• Sliders
• Date pickers
• Pop-ups or dialogs
• Payment or confirmation steps

Test 5: notifications and changes

Many problems occur when the screen changes, for example:

• An error after submission
• A success message
• A loading state
• New search results
• A dialog opening
• A menu expanding
• A step in a process

Check:

• Does the user hear that something changed?
• Does the VoiceOver cursor move to a logical place?
• Is an error announced promptly enough?
• Can you continue without seeing the screen?

For example, you press Submit and an error appears visually, but VoiceOver stays on the button and announces nothing new.

Test 6: scrolling and hidden content

Use three fingers to scroll:

• Swipe up with three fingers to scroll down.
• Swipe down with three fingers to scroll up.

Check:

• Can you reach all content?
• Are new elements announced after scrolling?
• Does the order remain logical?
• Do fixed bars or overlays get in the way?
• Can you reach the bottom of the page or list?

Extra check: Screen Curtain

Once you know the basic gestures, enable Screen Curtain with a three-finger triple-tap.

The screen turns black but the device keeps working.

Try a short task again:

• Open the menu.
• Find a link.
• Fill in a field.
• Close an alert.
• Go back to the previous screen.

Screen Curtain helps suppress your often unconscious reliance on the visual display. This makes it easier to notice whether the information is clear.

Only try this if you are sure you can turn VoiceOver off again.

Common problems

Things that often go wrong:

• VoiceOver only says button or image.
• An icon has no name.
• Link text is unclear.
• A form has unlabelled fields.
• An error is not announced.
• A state or selected tab is not announced.
• Focus jumps somewhere unexpected.
• A dialog opens but VoiceOver stays on the page behind it.
• A slider or swipe control cannot be operated properly.
• Important text exists only inside an image.
• The app or site supports ordinary swipes but not VoiceOver gestures.

Gesture reference

Learn more

Apple provides detailed guides for VoiceOver on iPhone and iPad. Use them to learn more gestures or understand why your device behaves differently.

• Turn on and practice VoiceOver on iPhone
• Use VoiceOver gestures on iPhone
• Control VoiceOver using the rotor on iPhone
• Use VoiceOver in apps on iPhone
• Use VoiceOver gestures on iPad
• Use VoiceOver in apps on iPad