HOW TO make your website mobile-friendly

Gartner research predicts that by 2013, mobile phones will overtake PCs as the most common Web access device worldwide. Bruce Lawson offers 3 strategies in a Dev Opera article to "mobilise" a web site to work across all devices i.e. not just mobiles but also alternative browsing devices like games consoles (Nintendo Wii, DSi), web-enabled TVs, in-car browsers etc -


Strategy #1: Code well and do nothing special for mobile - The current crop of advanced mobile browsers are very good at rearranging content without being told how to by a developer...Making a good semi-liquid layout that has a min-width and max-width set in your CSS and em-based typography will work very well across a range of different devices and screen sizes.

Strategy #2: Make a separate mobile site - .. (although) it results in having two sites to user-test, maintain, etc

Strategy #3: Build mobile-aware adaptive sites - hardest to pull-off methodology... (but) future-proof as it tests features rather than sniffing browsers.

There are also numerous mobile web optimization tips in that article -
  • Combine files and reduce requests across the network
  • Put script elements as far down as possible in the source
  • State the dimensions of images in the HTML
  • Opera users can sign up for seven free hours of testing on Perfecto Mobile service that lets you test on real handsets via the Internet

.. and interesting facts -

Smartphones can run full Web browsers such as Opera Mobile or Safari/iPhone, while in the developing world we see much lower-end handsets that don’t have an operating system but, if they can run Java they can use Opera Mini (a thin client for a proxy-based system that compresses pages down to about 10% of their original size before being sent to the handset for rendering — see our comparison of Opera Mobile and Opera Mini)

Also see:
Jason Grigsby’s DOs and DON’Ts of Mobile Strategy
Visual tags: Microsoft Tag vs QR Code