Viewport proporties
Here are the different Viewport meta tag properties and observations after working with them:
width:
Default is 980, to view ordinary web pages in the portrait aspect ratio.
We have set this to 480 in webmc to design for the width in landscape aspect ratio. This follows the following advice from the Safari Web Content Guide for iPhone - “Setting the viewport width should be the first task when designing web applications for iPhone to avoid the user zooming in before using your application.”
height:
Default is calculated based on the value of the width property and the aspect ratio of the device.
initial-scale:
The initial scale of the viewport as a multiplier. The default is calculated to fit the webpage in the visible area. The range is determined by the minimum-scale and maximum-scale properties.
minimum-scale:
Specifies the minimum scale value of the viewport. The default is 0.25. The range is from >0 to 10.0.
maximum-scale:
Specifies the maximum scale value of the viewport. The default is 1.6. The range is from >0 to 10.0.
user-scalable:
Determines whether or not the user can zoom in and out?whether or not the user can change the scale of the viewport. Set to yes to allow scaling and no to disallow scaling. The default is yes.
Setting user-scalable to no also prevents a webpage from scrolling when entering text in an input field.