Apple’s iOS offers a number of accessibility features that enable users to tailor their mobile experiences. One of those features, Increase Contrast, is intended to fix one of the most common accessibility issues: low-contrast text, which can be unreadable for many people.
Increase Contrast works differently than other high-contrast modes. Instead of inverting the color scheme, the feature makes text darker, leaving most of the visual presentation intact.
If you use an iOS device, it’s helpful to turn on Increase Contrast mode to see how it works. To do so:
- Open the iOS Settings app.
- Tap Accessibility.
- Tap Display & Text Size.
- Toggle the slider for Increase Contrast.
Apple doesn’t claim that Increase Contrast will meet the Web Content Accessibility Guidelines (WCAG) requirements for accessible color contrast. Even so, it’s a helpful tool for people with low vision, color vision deficiency (CVD), and other vision-related conditions.
For nongame apps, you can support Increase Contrast by using color thoughtfully
Apple’s Human Interface Guidelines recommend using default system colors unless you’ve got a good reason to do otherwise:
The system defines colors that look good on various backgrounds and appearance modes, and can automatically adapt to vibrancy and accessibility settings. People are familiar with the system colors, and using them is a convenient way to make your experience feel at home on the device.
Using default colors will also ensure that your app is readable in dark mode (not to be confused with Increase Contrast mode — iOS has separate settings for each high-contrast option).
Using Custom Colors in iOS
Of course, you may want to use specific colors for branding purposes. If that’s the case, you can create an Accent Color Set with custom colors.
Xcode allows designers to set different tints for Increase Contrast by selecting the “High Contrast" option under appearances. For more info, see Apple’s guide: Specifying Your App’s Color Scheme.
Remember, Increase Contrast affects both light mode and dark mode, so if you’re using custom colors, you’ll need to test your app in both of these environments.
Related: What Is Accessibility in Mobile Apps?
Quick Tips for Accessible Colors in iOS
Some users may not be aware of the Increase Contrast setting, so supporting this option doesn’t make your app conformant with WCAG 2.1. It’s still a good idea, of course — you want to give your users as many options as possible (and avoid as many trouble tickets as you can).
To truly design for accessibility, however, you’ll need to keep WCAG in mind from the first stages of development. Some tips to keep in mind:
Don’t use color alone to convey meaning.
For example, if your app instructs users to “tap the red button,” some users won’t know which button to select — and unless you’re building a game that requires that specific functionality, you should provide the instructions in another way.
Related: Easy Guide to Accessible Colors
Test all of your color-pairs.
WCAG 2.1 Success Criterion 1.4.3, “Contrast (Minimum),” requires the visual presentation of text to maintain a contrast ratio of at least 4.5:1 (large-scale text may have a contrast ratio of 3:1). Even if you’re an experienced designer, you probably can’t tell the difference between color-pairs with a 4.5:1 ratio and a 4:1 ratio — so test every pairing.
Fortunately, you can test your work easily. The Bureau of Internet Accessibility offers the Color Contrast Accessibility Validator, which can instantly determine whether color-pairs meet WCAG 2.1 requirements.
Related: The Basics and Importance of Color Contrast for Web Accessibility
Avoid pairing reds and greens.
Deuteranopia is the most common form of color vision deficiency. People with this condition have difficulty distinguishing between red and green, so the best practice is to avoid these pairings, regardless of whether they follow WCAG’s color contrast requirements.
Related: Myths and Facts About Color Blindness and Accessibility
Focus on mobile accessibility from the first phase of development
At the beginning of your project, changing a few colors or adding alt text isn’t difficult — but as your app gets more complex, those “quick fixes" can add up.
Following the best practices of inclusive design leads to cleaner code, fewer remediations, and a better experience for end-users. To that end, make sure every member of your team understands the importance of accessibility. Engaging in regular mobile accessibility audits can help you stay on track and improve compliance with the Americans with Disabilities Act (ADA), Section 508, and other digital accessibility laws.
To learn more, send us a message or read about the Bureau of Internet Accessibility’s iOS and Android App Accessibility Testing.
