meta-viewport-large
Rule Severity : Minor
Description
The meta-viewport-large rule ensures that the <meta name="viewport"> element does not use the user-scalable=no parameter and that any maximum-scale value is set to at least 5 (representing 500% zoom). Users with low vision rely on the ability to zoom in significantly beyond the standard 200% to read content comfortably. Restricting maximum zoom through the viewport meta tag removes this critical accessibility mechanism.
This rule meets WCAG requirements by:
- Supporting Text Resizing (WCAG 1.4.4 Resize Text): It ensures that text can be resized up to at least 200% without assistive technology, and beyond that for users who need greater magnification, without loss of content or functionality.
- Enabling Reflow (WCAG 1.4.10 Reflow): It ensures users can zoom to 400% and have content reflow to a single column without horizontal scrolling, which requires the viewport not to artificially cap zoom capability.
To comply with this rule, remove the maximum-scale restriction from the viewport meta tag, or set it to at least 5.0. Never use user-scalable=no.
Examples
This example shows a viewport meta tag with maximum-scale=2.0, which prevents users from zooming beyond 200%. This is insufficient for many users with low vision.
Here, the maximum-scale restriction is removed entirely, letting the browser and operating system handle zoom at whatever level the user requires.
How to fix?
To fix violations of the meta-viewport-large rule, follow these steps:
-
Locate the
<meta name="viewport">element in your document’s<head>. -
Remove the
user-scalable=noparameter if it is present. -
Remove the
maximum-scaleparameter entirely, or if a maximum is required for layout reasons, set it to at least5.0(representing 500% zoom). -
Test that your page content remains usable when zoomed to high magnification levels. Confirm content reflows correctly and does not require horizontal scrolling.
Reference
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!