No viewport meta tag

This issue fires when a page's <head> contains no <meta name="viewport"> tag at all.

A passing page declares one:

<meta name="viewport" content="width=device-width, initial-scale=1" />

This is the "there is no tag" half of what used to be a single check titled Viewport meta tag missing or incomplete. The other half — a tag that exists but is short a directive — is a separate issue now, because the two need different work: this one needs a line added to your template, that one needs an existing line corrected.

Without a viewport tag, mobile browsers assume the page was designed for a desktop, lay it out at roughly 980 CSS pixels wide, and scale the result down to fit the screen. Text arrives too small to read and tap targets too small to hit.

• Mobile-first indexing. Google indexes the mobile rendering of your page. A page that renders as a shrunken desktop layout is assessed on that rendering.
• Mobile usability is a ranking signal. Pages that fail Google's mobile-friendly assessment lose visibility in mobile results, which is the majority of search traffic for most sites.
• It is not something CSS can compensate for. Media queries in your stylesheet are evaluated against the viewport width the browser assumed. Without the tag, that width is wrong, so responsive CSS silently does nothing.

1. Add the tag to the <head> of every page, as early as practical and before any stylesheet that depends on it:

   <meta name="viewport" content="width=device-width, initial-scale=1" />

2. Add it in the layout, not per page. Most sites render a shared <head> partial or layout component. Putting the tag there fixes every page at once and stops the issue reappearing on the next new template.

3. Do not restrict zoom. Avoid user-scalable=no and maximum-scale=1; both prevent users from zooming and are an accessibility failure.

4. Verify. Re-run the scan, and check the page in Google's Mobile-Friendly Test or your browser's device toolbar.

1. No viewport tag

Problem — mobile browsers fall back to a ~980px virtual viewport and scale the page down, so the whole layout arrives zoomed out:

<head>
  <meta charset="utf-8" />
  <title>Trail shoes</title>
</head>

Fixed:

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Trail shoes</title>
</head>

2. The tag is present but its content is empty

Problem — an empty content declares nothing, so this counts as no tag at all:

<meta name="viewport" content="" />

Fixed:

<meta name="viewport" content="width=device-width, initial-scale=1" />

3. A partly configured viewport still passes this check

Passes this issue, raises #31 instead:

<meta name="viewport" content="width=1024" />

The tag exists, so "there is no viewport tag" is not true of this page. Whether the content is complete is the separate check, viewport_meta_tag_incomplete — one line to add versus one line to correct, which is why the two are reported apart.

Fully correct:

<meta name="viewport" content="width=device-width, initial-scale=1" />

1. HTML parsing. The crawler parses the fetched HTML and reads the <head> section.

2. Tag lookup. It looks for <meta name="viewport"> and reads its content attribute.

3. Pass/fail.

   • Fails when no viewport meta tag is present, or its content attribute is empty.
   • Passes when a viewport tag with a non-empty content exists — whatever that content says. Whether the content is complete is the separate check, viewport_meta_tag_incomplete.

The two conditions are mutually exclusive by construction, so a page never raises both.

Storage Level

Page Level — evaluated for each crawled URL.

Database Table / Prisma Model

PageHtmlHeadAudit

One row per crawled URL, keyed by urlId.

Fields Used

The same column feeds viewport_meta_tag_incomplete (#31), which judges the directives inside the string when there is one. Empty raises this issue; non-empty raises the other or neither, so the two are mutually exclusive by construction.

Detection Dependencies

• HTML Document — the <head> of the fetched page is parsed for <meta name="viewport">