free tool

Viewport & mobile-meta checker

Mobile-first indexing means the viewport meta is non-negotiable — and blocking zoom is an accessibility fail. Paste a URL — we read the viewport, theme-color and mobile-web-app meta.

What this tool checks

The viewport meta tag tells mobile browsers how to size and scale a page — <meta name="viewport" content="width=device-width, initial-scale=1"> is the responsive-web standard. This checker inspects a URL's viewport tag, theme-color, and any zoom-blocking attributes, because Google indexes the mobile version of a site first: a missing or broken viewport makes the page render at desktop width on phones, hurting both rankings and readability.

What it looks at

Viewport meta tag
The <meta name="viewport"> tag in the <head> that controls how a page maps to the screen; without it, mobile browsers assume a ~980px desktop canvas and shrink everything down.
width=device-width
The value that ties the layout width to the device's actual screen width — the foundation of responsive design and clean mobile-first rendering.
initial-scale=1
Sets the opening zoom to a 1:1 ratio so the page loads at true size instead of arriving zoomed in or out.
Zoom-blocking (a11y)
user-scalable=no or a low maximum-scale disables pinch-to-zoom, an accessibility failure under WCAG 1.4.4 that Lighthouse and Google both flag.
theme-color meta
Sets the color of the mobile browser toolbar and address bar — a small but real mobile-UX and branding polish signal.
Mobile-first indexing
Google predominantly crawls and ranks the mobile rendering of a page, so a broken viewport directly degrades the version that actually gets indexed.

How to use it

  1. Paste your page URL and run the check — the tool fetches the live HTML and reads the viewport, theme-color, and zoom attributes from the <head>.
  2. Review the flagged issues: a missing viewport tag, non-responsive width values, or zoom-blocking that fails accessibility.
  3. Fix the viewport tag in your template (set width=device-width, initial-scale=1 and remove user-scalable=no), then re-run to confirm it passes.

Frequently asked questions

What is the viewport meta tag and do I need it?

The viewport meta tag tells mobile browsers to render a page at the device's real width instead of a default ~980px desktop canvas. Every responsive site needs <meta name="viewport" content="width=device-width, initial-scale=1"> — without it, phones show a shrunken, hard-to-read layout.

Does a missing viewport tag hurt SEO?

Yes. Google uses mobile-first indexing, so it ranks the mobile rendering of your page; a missing or misconfigured viewport makes that mobile version look broken and unusable, which weakens rankings and mobile usability scores.

Is disabling zoom with user-scalable=no bad?

Yes — blocking pinch-to-zoom is an accessibility failure under WCAG 1.4.4 and is flagged by Lighthouse. Users who need to enlarge text can't, so leave zoom enabled and avoid maximum-scale below 5.

What does the theme-color meta tag do?

theme-color sets the color of the browser toolbar and address bar on supported mobile browsers, letting the chrome match your brand. It has no direct ranking effect but is a low-effort polish for mobile UX.

share the result Useful result? Send it to a teammate: Telegram WhatsApp X
this is just one tool

This audit is 1 of 85 operations in seo·matrix

Free tools show you WHAT to fix. The full audit + the autonomous team of 20 AI agents fix it end-to-end — strategy, content, GEO, internal links, publishing and day-2 upkeep.

All free tools →