Mobile-friendly web design matters more than ever

In recent months, with the release of the new iPhone 3G and other similarly web-oriented mobile devices (see here), organizations have started placing more and more emphasis on creating mobile-friendly versions of their sites.

This has taken on an even greater importance in recent months, with the release of the new iPhone 3G and other similarly web-oriented mobile devices (see here).

Generally speaking, you can

In recent months, with the release of the new iPhone 3G and other similarly web-oriented mobile devices (see here), organizations have started placing more and more emphasis on creating mobile-friendly versions of their sites.

This has taken on an even greater importance in recent months, with the release of the new iPhone 3G and other similarly web-oriented mobile devices (see here).

Generally speaking, you can use some code to detect what type of device/browser is attempting to access your site and redirect that visitor to a properly formatted version of your site that utilizes a mobile-friendly combination of CSS and HTML.

The most popular means of doing this appears to be via establishing a sub-domain (e.g. m.yoursiteURL.com).

There are many constraints that need to be taken into consideration when designing a mobile-friendly version of your site – I’ll touch on a few of them here briefly.

Smaller Screen Resolutions
This is one of the trickier aspects of designing for mobile devices – different devices have different screen sizes, and thus different resolutions.

A typical web site is designed for the industry-standard screen resolution – 1024×768, whereas some common mobile device resolutions are:

  • 128 × 160 pixels
  • 176 × 220 pixels
  • 240 × 320 pixels
  • 320 × 480 pixels (iPhone)

Consider using a single column design, which should work best across the variety of resolutions that your users will use to experience your site.

Bandwidth Limitations
Typically, users who are not near a WiFi hotspot will have frustratingly slow connection speeds.

Therefore, consider limiting the amount of images

on the mobile version of your site.

iPhone-specific Considerations
Tips on optimizing websites for iPhone
How to make an iPhone icon for your site to appear when adding it to the homepage of your iPhone

I’m sure others have lots to add – please give us feedback!

Dave Leonard