Meta Viewport Test
The Viewport Meta Tag Checker reads the <meta name="viewport"> declaration on any URL and validates that it correctly sets width=device-width and initial-scale=1 — the configuration mobile browsers need to render the page at the correct width and scale. A missing or misconfigured viewport tag forces mobile browsers to render the page at desktop width and zoom out, producing tiny illegible text and a broken mobile experience that Google flags as a usability issue.
What This Tool Checks
- Presence of <meta name="viewport"> in <head>
- width=device-width attribute
- initial-scale=1.0 attribute
- user-scalable setting (accessibility implication)
- maximum-scale and minimum-scale (avoid restricting zoom)
- Conflict with viewport-fit=cover or other modern values
Why It Matters for SEO
Without a viewport tag mobile browsers render the page at 980px width and scale down — text becomes unreadable, layouts overflow, and Google's mobile-friendly test fails. The fix is one line of HTML. Restricting user zoom (user-scalable=no) breaks accessibility for visually impaired users and triggers WCAG audit failures. Modern best practice is width=device-width, initial-scale=1, and never disable zoom.
How to Fix It
Add <meta name="viewport" content="width=device-width, initial-scale=1"> inside <head> on every page. Do not set user-scalable=no or maximum-scale=1 — they break accessibility. For sites that use the iPhone notch area, add viewport-fit=cover to extend the layout edge-to-edge.
How It Works
We fetch the page, parse the <head> for any <meta name="viewport"> tag, decode each property of its content attribute, and report whether the configuration matches Google's mobile-friendly recommendation. Restrictive zoom settings that hurt accessibility are flagged separately.
Common Mistakes to Avoid
- No viewport meta tag at all (legacy or copy-paste templates)
- Setting user-scalable=no (breaks accessibility)
- maximum-scale=1 (also restricts zoom unnecessarily)
- width=1024 hard-coded (force-renders at desktop width)
- Multiple competing viewport tags (only the first is used)
Quick Checklist
- Viewport tag present in every page <head>
- width=device-width set
- initial-scale=1 set
- user-scalable not disabled
- No maximum-scale less than 5