Mobile Web – Best Practices

Standards

* Use XHTML Basic 1.0.

Images

* Minimize the use of images. If you must use them, make them relevant and supply meaningful ALT text so that mobile devices can use the text descriptions.

* Make images smaller than 100 pixels. Specify the image height and width in the source code.

* Don’t use background images on your mobile pages.

User Interface

* Set margins and padding to 0. Widths and margins are detrimental to good handheld display.

* Use one column layouts and avoid floats. Horizontal overflow can be a problem on handhelds, so make sure wide elements fit the narrow screen.

* Add skip anchors. ‘Skip to content’ and ‘Back to top’ anchor links are vital when using a mobile device.

* Be consistent. Use similar alignment, color, and layout on pages.

* Align content to the left.

* Place non-essential links and other marginal content at the bottom of the page.

* Take advantage of ordered lists of links and accesskeys.

CSS

* Use external style sheets to control presentation.

* Ensure that contents are readable without style sheets.

* Use the link element to link to an external style sheet. Some handhelds don’t recognize @import or @media.

Advertisements

Comments on: "Mobile Web – Best Practices" (1)

  1. Hello,Creating a consistent and enjoyable experience while developing mobile content for a wide array of handsets and devices is a daunting task, the most common operating systems in use are windows mobile, the iPhone platform, palm os, mobile linux and symbian os. Thanks a lot.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Tag Cloud

%d bloggers like this: