Does WCAG Apply to Mobile Apps?
WCAG accessibility guidelines are applicable to mobile apps, including hybrid and native mobile apps. This article explores how to enhance mobile app accessibility and provides a mobile app accessibility checklist to help you get started.
When you think about digital accessibility, the first thing that comes to mind might be your website. However, digital accessibility also applies to your omnichannel experience — which includes mobile apps. Though originally created for web content, the Web Content Accessibility Guidelines (WCAG) have expanded in scope to include mobile applications, including hybrid and native apps. The guidelines include recommendations on how app developers can make mobile applications accessible to users with varying disabilities.
Accessibility guidelines for mobile apps were originally introduced in WCAG 2.1 in June 2018. Seventeen new success criteria were introduced for mobile accessibility and increasing accessibility for individuals using various mobile devices to browse the web. These include:
- Smartphones (including Android and iOS devices)
- Tablets
- Wearable devices (i.e. smart watches)
- Digital TVs
- Devices in household appliances, car dashboards, or airplane seatbacks
- “Internet of Things” (IOT) devices like smart speakers (Google Home) or cameras (Ring Doorbells or August Doorbell Cam)
The guidelines outlined in WCAG 2.1 address mobile accessibility issues, such as:
- Small screen sizes
- Screen orientation
- Color contrast
- Text spacing
- Keyboard navigation
WCAG 2.2 introduced nine new success criteria for mobile app accessibility, including recommendations for touch targets, responsive design, and gestures. Each of these helps to improve mobile accessibility for users with cognitive, visual, physical, and learning disabilities and builds on the foundation created by WCAG 2.1.
Understanding Mobile App Accessibility
According to the World Wide Web Consortium (W3C), mobile app accessibility “refers to making websites and applications more accessible to people with disabilities when they are using mobile phones and other devices.” More simply, the approach ensures users with a range of disabilities can access and navigate the web on mobile devices. Considering more consumers rely on mobile devices to conduct business, organizations need to prioritize accessibility on these devices.
Increasing accessibility on mobile apps isn’t just the right thing to do — it’s also a legal requirement. According to Title III of the Americans with Disabilities Act (ADA), places of public accommodation must be accessible to everyone, particularly people with disabilities. Websites and mobile applications are considered places of public accommodation, meaning they are legally required to be accessible.
However, the ADA does not have technical specifications on digital accessibility. Because of this, the Department of Justice (DOJ) has adopted WCAG as a compliance standard. Organizations that meet the guidelines outlined in WCAG 2.2 Level A and Level AA are considered to be compliant with ADA accessibility requirements. This helps reduce the likelihood of legal challenges — including lawsuits and demand letters — due to lack of accessibility.
Four Principles to Achieve WCAG Conformance on Mobile Apps
To ensure your mobile apps are accessible, four key principles should be followed:
- Perceivable: Content on mobile apps should be perceivable to users, meaning the app has the appropriate ratio for screen size to content, good color contrast, zoom functionalities, etc.
- Operable: This principle looks at the overall usability of a mobile app and how easily users with disabilities can interact with the application. Apps that are operable include features of a touchscreen-compatible keyboard or alternative touchscreen gestures.
- Understandable: Mobile users should understand how to navigate the app and customize it, including a clean layout, customization tools, clear calls-to-action (CTAs), and grouping similar elements together.
- Robust: The robust principle looks at how effectively a mobile app performs across various operating systems or devices. For example, a mobile app should work just as well on a mobile device as it does on a desktop.
Mobile App Accessibility Checklist
To help you meet WCAG accessibility standards, consider using the checklist below as a starting point. It’s important to note that incorporating these features won’t make your mobile app or mobile site 100% compliant — additional accessibility testing is needed to ensure complete compliance.
Screen Sizes
When designing your mobile app, keep in mind users will be interacting on various screen sizes. It should be optimized for both large and small screens with content kept to a minimum, using reasonable text sizes and adjusting the position of form fields if needed.
Color Contrast
WCAG 2.2 Level AA guidelines require text to have a color contrast ratio of at least 4.5:1 and larger text to have a 3:1 ratio. Using the appropriate color contrast ensures disabled users (including those with visual impairments or disabilities) can distinguish between web elements and understand the app’s content. A color contrast checker can help you strike the right balance.
App Gestures
Keep app gestures as simple as possible. Users with physical or motor disabilities may have difficulty performing more complex gestures. It’s recommended to implement ‘tap’ or ‘swipe’ gestures to keep the user experience simple.
Layout Consistency
Information that’s repeated across your app (i.e. contact information, headers, footers, chatbots, etc.) should be kept in the same order. This ensures users with cognitive disabilities can easily find information and decreases the chance of them getting lost in the app.
Keyboard Navigation
Users should be able to navigate your mobile app using just a keyboard. The tab order for the page should also be logical and intuitive to ensure a good experience.
Text and Font Size
Ensure users can change the text and font size based on their specific disabilities. They should be able to do this without text becoming obscured or the layout breaking.
Alternative Text
All images — including decorative images — should include alternative text (alt text). This ensures users with visual disabilities (i.e. blindness, low vision, color blindness, etc.) have context around the image and why it’s included on the page.
Headings
Headings should be used appropriately to create a logical content hierarchy. More simply, headings should provide information about the structure of a page and the user journey.
Target Size
Touch targets such as buttons and links should be appropriately sized and spaced on mobile apps. They should also be easily distinguishable, with users able to tell the difference between the surrounding text and the element.
Test Screen Reader Compatibility
Nearly 80% of individuals with disabilities rely on screen readers to use both mobile and web applications. Ensure your mobile app is compatible with screen readers and other assistive technologies by testing apps with these devices. This will help you identify where additional development is needed to improve accessibility.
As you’re creating new mobile apps or updating existing ones, consider conducting a manual audit of your apps or having them tested by people with disabilities. For example, AudioEye performs an in-depth expert audit of your mobile applications to identify WCAG violations. All violations are shared in a detailed report so you can prioritize which accessibility errors should be resolved first. We also rely on our A11iance Community which is made up of a group of individuals with varying disabilities to test mobile apps and report accessibility roadblocks.
Create WCAG-Friendly Mobile Apps with AudioEye
As mobile app usage continues to rise, it’s critical they be as accessible and inclusive as possible — and this starts with conforming to WCAG guidelines. Following these recommendations not only helps you provide a positive mobile experience for users but also increases the overall success of your mobile applications. Regular accessibility scanning of your website or receiving an expert audit of your mobile app is the best way to catch issues before they affect your customers. Additionally, building accessible mobile apps helps you avoid potential legal action, which can be expensive, time-consuming, and damaging to your brand reputation.
Rather than waiting for accessibility errors to find you, take proactive steps to find and fix them yourself. At AudioEye, we help you get started on the path toward mobile accessibility compliance. Our team of human testers carefully audits your mobile apps and flags WCAG violations, providing recommendations on how to fix them.
Together, we’ll create a mobile user interface that is accessible, inclusive, and conformant with WCAG.
Ready to build WCAG-friendly mobile apps? Book a demo today.
Frequently asked questions
Ready to test your website for accessibility?
Share post
Topics:
Keep Reading
ADA Audit 101: Is Your Website ADA Compliant?
The ADA audit is a meaningful contribution to a more accessible internet. Learn what an audit is, how to run one, and use our free tool to take the first step.
compliance
April 26, 2024
Is My Website ADA Compliant? How to Check Your Digital Content
Is your website compliant with ADA standards? Learn how to check your website for ADA compliance with accessibility tools and accessibility best practices.
compliance
March 21, 2024
Breaking Down the Latest Web Accessibility Compliance Updates
Learn about the latest accessibility laws and guidelines
compliance
March 11, 2024
