What is ViewPort?

I have seen to use viewport in meta tag ?

What does it do ?

Can anybody please explain in simple words ?

It is used to control layout on mobile browsers.
https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag

Without the viewport meta tag mobile devices will assume a page is 980px wide (even if it only contains one word) and then shrink 980px until it fits into the tiny viewport (resulting in text to small to read).

When you add the viewport meta tag the device will not shrink the page but assume that you have catered for mobile with suitable media queries and allow the page to be the width you have defined in the css. If you haven’t catered for mobile with media queries then the page will scroll off the screen and be much too wide.

Therefore if you are not using media queries then in most cases you wouldn’t add the viewport meta tag. This is how mobile engineered old sites to effectively work on mobile although they would be scaled very small.

3 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.