This is Internet Era. Each one of us using internet in day to day life work. Every one buying products online. Everyone is using latest gadgets iPad , iPhone , smart phones, tablets, android, windows etc. All devices having different screen size and resolutions. It will be impractical to create different website versions for all devices resolutions.
As a web developer, while working on new website, you ever think about the responsive web design. Is the website you are working on need a responsive design?
I am not going in detail about responsive design. I am going to discuss view port meta tag in responsive web design.
Viewport meta tag tells the browsers how to behave when render a webpage on different screen devices.
Note- Use Viewport meta tag only when you are designing responsive website, put it in your <head> section.
This defines that the width of the Viewport will be the same as the device you are viewing the website on. The scale of the website will be set to 100% and the maximum scale is set to 100%
The width of the virtual viewport of the device.
The physical width of the device’s screen.
The height of the “virtual viewport” of the device.
The physical height of the device’s screen.
The initial zoom when visiting the page. 1.0 does not zoom.
The minimum amount the visitor can zoom on the page. 1.0 does not zoom.
The maximum amount the visitor can zoom on the page. 1.0 does not zoom.
Allows the device to zoom in and out. Values are yes or no.
Please share your views on Viewport meta tag for responsive designs. Thanks