1.4.4 Resize Text
Text must be resizable up to 200% without assistive technology and without losing content or functions.
Level AAPrinciple 1: Perceivable
What does it mean?
People with low vision often enlarge text using browser zoom or text-size settings. At 200%, all text must still be readable and all functions usable: nothing cut off, overlapping or hidden. Captions and images of text are exceptions.
Typical causes of failure are fixed heights on containers, text sized in units that do not scale, and settings that block zooming on mobile devices.
Who does it help?
- People with low vision
- Older people
- People reading on small screens
Common failures
- A viewport meta tag with user-scalable=no or maximum-scale=1
- Fixed-height boxes where enlarged text is cut off
- Buttons whose labels overflow and become unreadable at 200%
- Navigation items that overlap when text is larger
How we test it
- axe-core Automatic: axe-core finds typical violations. A violation is pre-filled as “fails”.
- evidence Evidence: our scanner collects material such as screenshots, lists and measurements.
Test question: At 200 % zoom, is all content and function still there without loss (see screenshot)?
A person decides every criterion. No criterion ever passes automatically.
How to fix it
<meta name="viewport" content="width=device-width, maximum-scale=1, user-scalable=no">
<style>.card { height: 120px; overflow: hidden; font-size: 14px; }</style><meta name="viewport" content="width=device-width, initial-scale=1">
<style>.card { min-height: 7.5rem; font-size: 0.875rem; }</style>Zooming is allowed again and the card grows with its text instead of cutting it off.
Practical tips
- Test with browser zoom at 200% and also by raising the default font size in the browser settings.
Official source
How does your website do on this criterion?
The free check tests your home page automatically; the audit decides all 55 criteria.