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.
