Using HTML5 for mobile apps require us to rethink traditional best practices on the desktop web. Here is a quick overview of the high-level things to take in account and we'll go deeper into the details in future articles.
Absolute Positioning & Viewport for the desktop web, is how a majority of content is developed in flow layout (as opposed to absolutely positioned). This has allowed designers to be relatively indifferent to the pixel resolution of the user's screen. More mobile design strategy needs to be used to account for the pixel resolution for the iPhone / iPad / G1 / Droid etc. are dramatic and the environment in which the device is being used requires tighter control over the position of elements. For example, if a user has to hit a button with only one hand to work the device, the button really needs to be in exactly the right spot (as opposed to off the screen).
Viewport is a new meta tag that is particularly useful for mobile situations.
meta name = "viewport" content = "width = 320, user-scalable = no"
Using viewport, now a designer or developer can design to one resolution (say 768×1024) and have the whole page display on every device you are targeting. In conjunction with viewport, if you use absolute positioning, you can guarantee the integrity of the user experience.
Cache Early and Often