These docs are for CORA 0.10, an older release. Read this page in the newest docs.
Zooming needs to stay enabled
- Rule:
axe/meta-viewport - Checks: Zooming and scaling must not be disabled
- WCAG: 1.4.4
- Fix class:
mechanical: A fix needs no authored text or visual decision.
Who it affects
Section titled “Who it affects”- People with low vision, who zoom, magnify or need strong contrast.
How to fix it
Section titled “How to fix it”The viewport tag sets user-scalable=no or user-scalable=0
Section titled “The viewport tag sets user-scalable=no or user-scalable=0”Remove user-scalable from the content attribute. Zooming is allowed by default.
<meta name="viewport" content="width=device-width, initial-scale=1">The viewport tag sets maximum-scale below 2, such as maximum-scale=1
Section titled “The viewport tag sets maximum-scale below 2, such as maximum-scale=1”Remove maximum-scale, or set it to at least 5 so people can zoom to 500%. A value from 2 up to 5 passes this rule but is reported under meta-viewport-large.
Zoom was limited to stop phones zooming into form fields on focus
Section titled “Zoom was limited to stop phones zooming into form fields on focus”Give text fields a font-size of at least 16px, which stops iOS Safari zooming in on focus, and remove the zoom limits.
Fixes that fail
Section titled “Fixes that fail”Blocking zoom another way, such as touch-action: pan-x pan-y on the page or a script that cancels gesture events
Section titled “Blocking zoom another way, such as touch-action: pan-x pan-y on the page or a script that cancels gesture events”axe checks only the viewport tag, so the rule passes, but the page can still stop people from pinching to zoom.
More on the rule
Section titled “More on the rule”axe-core’s documentation of the rule
CORA’s fix guidance adapts content from accessibility-agents, under the MIT License: see its notice.