To build a mobile web application we should avoid several things:
Measures – Don’t give width to the layout. If you define as 300px width in one mobile device, that will cause problem in another devices.
Flash – Most cell phones do not support Flash, so it’s not a good idea to include flash files.
Tables – Don’t use tables for layout in a mobile page. Some cell phones do not support tables (Ex: ——). iPhones and other Smart phones support them.
Nested tables – If you want to use a table, make sure not to nest it in another table. These are difficult for desktop browsers to support, so better to use divs.
In header part in head tag <head> we should give this code
<meta name=”viewport” content=”width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;” />
<meta name=”apple-mobile-web-app-capable” content=”yes” />
<meta names=”apple-mobile-web-app-status-bar-style” content=”black-translucent” />
<meta name=”viewport” content=”minimum-scale=1.0, width=device-width, maximum-scale=0.6667, user-scalable=no” />
This code is to set the mobile resolution