O'Reilly logo

Programming the Mobile Web by Maximiliano Firtman

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

The Document Body

The body is the most important section of the document, as it will define the content that the user will see.

Key best practices include:

  • Avoid formatting tags.

  • Use semantically correct, clean XHTML; we will define styles later with CSS.

  • Don’t create a document larger than 25 KB. Larger documents cause problems on old browsers (and caching problems even on modern ones).

  • If you have a lot of text to show, separate the content into many pages.

  • Don’t use tables for layout.

Note

The classic desktop web meta options, like refresh and cache-control, work well on mobile browsers. Usage of the refresh metatag for autoupdating documents is not good practice for mobile devices, though: it is difficult to scroll on some mobile browsers, and an unsolicited page refresh can be unpleasant for the user. You can do an Ajax autoupdate if it is really necessary to keep the document updated.

Almost every mobile browser supports caching, either in meta tags or using HTTP headers. It is best practice to use the meta cache tag for enhanced cache purposes. For example:

<meta http-equiv="expires" content="Mon, 5 Mar 2012 01:01:01 GMT">

Main Structure

A typical mobile document will be divided into four main sections:

  1. Header

  2. Main navigation

  3. Content

  4. Footer

The header should be as simple as possible, using an h1 title and/or a logo or company banner. The main navigation should be no more than five main links, ordered by likelihood of use in a mobile context (most to least probable). The content is obvious; ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required