24.2 · Dynamic Type, display settings, contrast and touch targets

People read your UI at a huge range of sizes, contrasts and motion tolerances. The layout that only works at the default size and a perfect screen works for almost nobody for long.

Mental model. Never fix a size, a colour or a motion in a way the user cannot change. Build with the system’s settings, test at the extremes.

Text size

Dynamic Type, scaled metrics, and layouts that do not clip.

  1. How does Dynamic Type work, how do you support it in UIKit and SwiftUI, and how do layouts adapt at accessibility sizes? 24.2.1 · L2
    Users choose a preferred text size in Settings (and per app), and apps are expected to follow it. Use text styles (.body, .headline, .title, .caption…) rather…

Display settings

Reduce Motion, contrast, bold text, transparency, colour and invert.

  1. How do you respect Reduce Motion, Increase Contrast, Bold Text, Reduce Transparency, Differentiate Without Color and Smart Invert? 24.2.2 · L3
    Users can change how the system looks and moves, and your app should follow without being asked. Reduce Motion (UIAccessibility.isReduceMotionEnabled, SwiftUI…

Contrast and targets

The contrast ratio, colour blindness and minimum target sizes.

  1. What contrast ratio and touch-target size should you meet, and how do you design for colour blindness? 24.2.3 · L3
    Contrast is measured as a ratio between the relative luminance of the text and its background, from 1:1 (no difference) to 21:1 (black on white). The common…

More in Accessibility & localization