Website problems
Pinch zoom disabled
The viewport meta tag accepts directives that prevent a visitor from zooming — one disabling user scaling outright, and one capping the maximum scale. Either removes the only magnification mechanism a phone offers, which for someone with low vision is the difference between a site being readable and not. It is an accessibility failure with a named WCAG criterion, and there is no layout problem it solves that a responsive layout does not solve better.
What the directives do
The user-scalable directive set to no prevents zooming entirely on browsers that honour it.
A maximum-scale value caps how far a visitor may zoom, which is the same restriction expressed as a ceiling.
A minimum-scale value prevents zooming out, which is rarer and has the same shape.
Setting the initial scale is fine and unrelated — it decides the starting zoom rather than restricting the visitor's control.
The relevant criterion asks for content to be resizable to at least twice its size, which either restriction can violate.
Why it gets added
A layout that breaks when zoomed, which is a layout problem being hidden rather than fixed.
An attempt to make a web application feel more native, where zooming is seen as an unwanted browser behaviour.
Double-tap zoom interfering with a tap handler, which has its own fix in the touch-action property.
A copied viewport line carried between projects, which is how it spreads to sites nobody made the decision for.
In each case a real annoyance is being solved by removing a capability the visitor needs.
Who it affects
Anyone with low vision, for whom zoom is the primary adaptation on a phone.
Anyone reading small text in poor light, which is a much larger group and a temporary condition.
Anyone trying to read an image containing text, which cannot be resized any other way.
Anyone using a device smaller than the one the design was tested on.
None of them has an alternative: the browser control is the only magnifier available.
What browsers do about it now
Some mobile browsers ignore the restriction entirely and allow zooming regardless, which is a deliberate accessibility override.
Others honour it, so the behaviour differs by browser and by platform.
Which means the directive is unreliable as a control and reliable as a failure — it works often enough to exclude people and not often enough to achieve what it was added for.
It is also flagged by every accessibility audit, so it is a finding that will keep returning until removed.
Fixing the problem it was hiding
Test the layout at high zoom and fix what breaks, which is usually fixed widths that should be relative.
Use the touch-action property where double-tap zoom conflicts with a tap handler, which solves that specific case without removing zoom.
Make text large enough that zooming is not the first thing a visitor reaches for.
Avoid text rendered inside images, which cannot reflow at any zoom level.
Keep only the width and initial-scale directives in the viewport tag, which is what the overwhelming majority of sites need.
How to check it yourself
View source and read the viewport meta tag content attribute.
Any user-scalable or maximum-scale directive is the defect; width and initial-scale alone is correct.
Try pinch-zooming on a real device, remembering that some browsers ignore the restriction and will zoom anyway.
Zoom to twice the size and check the layout still works, which is the criterion the directive was hiding a failure against.
Check every template, since the tag lives in a shared head partial and applies everywhere.
How VeriFixScan detects it
`mobile.viewport` reads the viewport declaration including the scaling directives, which is this problem directly.
`mobile.text_size` reports text below a comfortably readable size, which is what makes zoom necessary in the first place.
`mobile.content_width` and `mobile.horizontal_scrolling` report whether the layout fits, which is what the directive was frequently hiding.
`mobile.responsive` reports the responsive layout signals present.
Where the declaration is missing or restrictive, the downstream mobile measurements are reported as unreliable rather than presented as findings.
What the viewport tag should contain
A width directive set to the device width, which tells the browser to lay out at the real screen width rather than at an assumed desktop one.
An initial scale of one, so the page starts unzoomed rather than scaled to fit.
Nothing else. Every other directive in common use restricts the visitor rather than describing the layout.
A viewport-fit directive is the one modern exception, used on devices with rounded corners or a notch to control how content reaches the edges.
Those two lines are what the overwhelming majority of sites need, and adding to them is almost always adding a restriction.
Frequently asked questions
- My layout breaks when zoomed. Is disabling zoom reasonable?
- No — that hides a layout problem by removing a capability. Fixed widths that should be relative are the usual cause, and fixing them is the work the directive was deferring.
- Browsers ignore it anyway. Does it matter?
- Some do and some do not, which makes it unreliable as a control and reliable as an exclusion. It works often enough to affect people and never often enough to be worth keeping.
- What about double-tap zoom interfering with my tap handlers?
- The touch-action property solves that specific conflict without removing pinch zoom, which is the capability people actually rely on.
Sources
Related
VeriFixScan crawls a site and applies its checks to every page it reaches, keeping the evidence behind each finding. Scanning one website is free.
Scan a website