What is the viewport meta tag?

The viewport meta tag is a line in a page's head that tells mobile browsers how wide to make the page and how far to zoom it. The standard version is <meta name="viewport" content="width=device-width, initial-scale=1">. Without it, phones often render the page at a wide desktop width and shrink it, so text becomes tiny.

Why it matters

A responsive layout adapts its design to the screen width, but only if the browser reports the real width. Without the tag, mobile browsers use a wide virtual width, often around 980 pixels, and scale the page down to fit. Google indexes the mobile version of pages, so a page that is hard to read on a phone is a problem for visitors and for search.

How to add or check it

Open the page source and look in the <head> for name="viewport".
If it is missing, add the standard tag near the top of the head:

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

width=device-width makes the page as wide as the screen, measured in device-independent pixels.
initial-scale=1 sets the starting zoom to 100 percent, so one CSS pixel matches one device-independent pixel.
Load the page on a phone, or use the device toolbar in your browser's developer tools, and check that text is readable without pinching and nothing forces sideways scrolling.
Confirm the tag appears only once, and that your CSS has breakpoints for small screens.

Your layout also needs CSS that adapts, such as flexible widths and media queries. The tag alone does not make a fixed-width design responsive.

Common mistakes

Leaving the tag out of a template.
Adding user-scalable=no or maximum-scale=1, which blocks pinch zoom and harms people who need larger text.
Setting a fixed width such as width=1024.
Putting the tag outside the head.
Assuming the tag fixes content wider than the screen, such as a wide image or table.

Crawvix's scan checks that the mobile viewport is set, and that page zoom is not blocked.

Frequently asked questions

Do I need the viewport tag on every page?

Yes, every page should have it, and a shared template usually handles that. A page without it can look very small on a phone.

Is the viewport tag a ranking factor?

Google does not list it as one. It supports a mobile-friendly page, and Google indexes the mobile version first.

What does initial-scale do?

It sets the zoom level when the page first loads. A value of 1 means no zoom, so the layout matches the screen width.

To check your own pages, Try the free website sample.