HTML Meta tag viewport
meta name=viewport is not part of any web standards, but most of the mobile browsers today have support for it. The meta tag adds instructions to the browser about the page scaling on different devices. To optimize the webpage for mobile devices add:
1 2 3 <meta name="viewport" content="width=device-width, initial-scale=1">
Note: meta tag should be added in the <head> of HTML page.
width=device-width will set the width of the page the same as the device screen size and
initial-scale=1.0 will set the initial zoom on load. This means it will scale on different devices since the viewport(the visible area to the user) is different on the laptops, mobile phones, tablets. Omitting the
viewport the browser will use a virtual viewport that will zoom out the website. So, it is always the best practice to add a viewport so the website will be optimized for different screens.