Fixing Resize Text on Shopify (WCAG 1.4.4)
Text must be able to scale to 200% without losing content or functionality.
Why it matters
Disabling zoom in the viewport meta tag is a single line, but it locks low-vision customers out of the store entirely on mobile. The information printed smallest — price, size chart, shipping terms — is exactly the information that needs enlarging.
Shopify — where to look
Theme code: the viewport meta tag in layout/theme.liquid.
What to do
Reduce the tag to width=device-width and initial-scale=1; remove the user-scalable and maximum-scale restrictions.
Verification status
Checked by reading the platform’s own source code. Dawn ships an unrestricted viewport (width=device-width,initial-scale=1), so a restriction here was added by hand.
Source: https://github.com/Shopify/dawn/blob/main/layout/theme.liquid
Reference themes change. If your store runs a different or older theme, confirm the file before editing it.
How to verify the fix
- View source and check the viewport meta tag for user-scalable=no or a maximum-scale below 2.
- Set desktop browser zoom to 200% and confirm the price, Add to Cart button and navigation are still visible and usable.
- Try pinch-zooming on mobile.
Other platforms
- Fixing Resize Text on WooCommerce
- Fixing Resize Text on Webflow
- Fixing Resize Text on Wix
- Fixing Resize Text on Squarespace
The full criterion
Read the full explanation of WCAG 1.4.4 Resize Text, or the formal W3C definition.