Get free SEO audit

What Is a Viewport Meta Tag & How to Use It Properly

What Is a Viewport Meta Tag & How to Use It Properly

What is a viewport meta tag

Viewport is a site page area visible to the user without scrolling. On the responsive website, pages are available for all types of devices and display correctly regardless of screen resolution. The user is comfortable reading text, viewing images, scrolling content, filling in columns, making purchases.

A typical site optimized for mobile devices contains the following meta tag:

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

The property width determines the size of the viewport. It can be set to a certain number of pixels or to a special value device-width, that means the width of the screen in CSS pixels at a scale of 100%. Sometimes the issue occurs when the viewport <meta> tag has a specific width set.

The property initial-scale controls the zoom level at the first page load. Properties maximum-scale, minimum-scale and user-scalable determine how users are allowed to enlarge or reduce the page. It’s necessary to fix the issue when the viewport <meta> tag is missing an initial-scale.

When you don’t use meta name=”viewport”

The browser finds instructions for scaling the resource page in the tag or rule “viewport”. If you do not specify it, the browser will show the user the standard size of the desktop page and will try to optimize the content by increasing fonts and elements. It will show the content that fit on the screen, and the user will have to scale the page manually or use horizontal scrolling.

Search engines will not consider such pages responsive, which means they will not give them high positions in the SERP.

Check other of our awesome SEO tools!
Traffic Checker Estimate website traffic stats by different channels & in different periods.
Rank Checker Get a report with keywords that bring the website the most of organic traffic.
Speed Test Test a specific page for speed and get suggestions how to improve it.
Backlinks Checker Our free backlink checker tool will help you monitor links to your website.
Website Safety Check out that the website is safe and not listed as suspicious.
Similar Websites Free tools allowing users to get information on similar sites in a few seconds.
View all tools

Check your website SEO performance

Get a personalized checklist on how to improve your website to rank higher on Google

No limits! Upgrade your account to crawl this domain