infinite42

Mobile web use is reaching critical mass, according to technologyexpert.

What does this mean for you as a website owner? It means that more of your visitors will be browsing your site on mobile devices such as BlackBerrys and iPhones. The recent release of the new iPhone will increase this number.

So what? Good question.

How does your website work on an iPhone, or a cellphone? Have you checked? The biggest difference is that these portable devices have a much smaller display than your average PC or laptop. This can mean that your nicely laid-out pages are squashed, stretched, and otherwise moved around [obviously this is less of a problem on the iPhone, but it’s true for most other devices].

Mobile devices tend to be slower than PCs, so loading times are longer. If your site relies on large images or flash animations these can make the browsing experience pretty lousy.

Unless you code your pages properly, your CSS stylesheet can be ignored. This means your fonts can be messed up too, for example with oversized letters in headings.

So here’s a list of useful guidelines to follow to make sure your website works well for your mobile visitors:

1. Design for the smaller screen. Go for less columns, and ideally no horizontal scrolling
2. Use a separate CSS stylesheet and switch to a mobile version
3. Design your pages for input with a stylus/trackball, rather than a mouse
4. Reduce image sizes, or remove them altogether
5. Disable flash animations
6. Make fonts compatible with the smaller screen size (especially headings)

If you follow these guidelines you’ll provide a better browsing experience for your visitors. Hopefully they will spend more time on your site and come back in the future for more…

Tags: BlackBerry, cellphone, css, devices, display, image, iphone, mobile, portable device, screen, stylesheet, web, website

You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.