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

What Is a Viewport Meta Tag & How to Use It Properly
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)

5

Loading...

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%.

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.

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.

email__icon

Be the first to know about new articles

Reset Password

Enter your e-mail to reset your password

Your email

Check Your Email

We have sent you a new link to change your password. Check your email and follow instructions envelope

Your password has been reset successfully!

close
conversation

Contact us

Consult our market intelligence experts, and learn how you can benefit from Sitechecker.

ERROR: The Name field is empty.

ERROR: The Last Name field is empty.

ERROR: The Work Email field is empty.

ERROR: The Message field is empty.

Thank you for registration!

We are redirecting you to PayPal