Mobile Apps

The Navigation category contains criteria that determine how well a user can navigate around the content and different screens of your app. Although mobile phones and tablets are primarily touch devices, a user may still choose to connect a physical or virtual keyboard to their device to navigate. Accessibility criteria relating to keyboard navigation and focus are still critically important here.

Navigation accessibility criteria include:

• 2.1.1 Keyboard
• 2.1.2 No Keyboard Trap
• 2.4.3 Focus Order
• 2.4.7 Focus Visible

The goal of this testing category is to ensure that a user can navigate through your app effectively without getting stuck anywhere. The focus indicator (outline that shows up around interactive elements) should always be visible to the user, and it should move through the screen in an order that’s logical. All interactive elements such as buttons, links, and input fields should also be accessible using only a keyboard.

The Interaction category contains criteria that determine how well a user can interact with certain content and elements of your app. Interactive elements within the app should be clearly labeled, easy to access, and not require any complex gestures or motions to activate.

Interaction accessibility criteria include:

• 2.4.4 Link Purpose (In Context)
• 2.5.4 Motion Actuation
• 2.5.5 Target Size

The goal of this testing category is to ensure that a user can operate your app effectively without requiring complex inputs or trial-and-error. It should always be clear what a button or link will do when a user selects it, and the size of the button or link should afford enough space for the user so that they can easily select it without accidentally selecting something else. A user also shouldn’t have to move their device in a certain way to use your app as they may have their device mounted or they may not be capable of performing certain motions.

The User Input category contains criteria that determine how easily a user can complete and modify form fields and other inputs within your app. Form fields and other inputs should be clearly labeled, and error messages should make it easy to understand where an error has occurred and how to correct it.

• 3.3.1 Error Identification
• 3.3.2 Labels or Instructions
• 3.3.3 Error Suggestion
• 4.1.3 Status Messages

The goal of this testing criteria is to ensure that a user can easily understand and complete any forms or workflows within your app that require user input. Clearly labeled form fields make user input more predictable and benefit users with limited vision or cognitive disabilities. Descriptive error messages help users to quickly identify and correct issues with their inputs and can alert assistive technology users such as screen reader users when a form is unable to be submitted successfully.

The Color Contrast category contains criteria that determine how easily a user can read and understand the content of your app with respect to color. Color blindness is one of the most common disabilities, so ensuring that color contrast is accessible is a top priority.

Color Contrast accessibility criteria include:

• 1.4.1 Use of Color
• 1.4.3 Contrast (Minimum)
• 1.4.11 Non-text Contrast

The goal of this testing category is to ensure that a user can read and interact with the contents of your app regardless of how well they can perceive differences in color, if at all. Color (such as green for good and red for bad) shouldn’t be the only means of recognizing the status of something and should be accompanied by text and/or icons to provide extra context. The colors of foreground text against the background as well as the color of interactive elements (or non-text elements) such as buttons, links, and icons should all meet the minimum WCAG requirements for contrast ratios (4.5:1 ratio for foreground text against the background and 3:1 ratio for non-text elements).

The Readability category contains criteria that determine how easily a user can read and modify the text within your app. Users with limited vision and users with specific viewing needs will need to be able to clearly read and understand all the text content within the app, without the app interfering with user preferences.

Readability accessibility criteria include:

• 1.1.1 Non-text Content
• 1.3.4 Orientation
• 1.4.4 Resize Text
• 2.4.6 Headings and Labels

The goal of this testing category is to ensure that a user navigating and interacting with your app can clearly read and understand the content of the app based on their preferences. Providing images with alternative (alt) text and using headings (H1, H2, etc.) to break up lengthy screens of content will help assistive technology users such as screen reader users more effectively navigate and understand your app. The app should also be usable in both portrait and landscape orientations, and text should be able to be resized based on user preferences. At the very least, the app should not prevent the user from changing their device orientation or zooming.