Comment on this view

View a PDF version of this article (37KB)

Creating websites for mobile phones casts up a whole host of issues. Although mobile phones are becoming increasingly sophisticated, there is still a large percentage of handsets that are still not capable of displaying the vast array of flash and java components, audio tracks, streaming videos, live feeds and assorted widgets that form an integral part of most of today’s complex web pages. As such, a mobile website needs to take a different path to a site designed for viewing solely on a desktop computer.

It doesn’t take much more than a sprinkling of logical thinking to understand why this should be. But that’s not the half of it. Because in the same way that websites look different from one type of web browser to another, they also look different from one mobile phone handset to another. This is partly because screen sizes and shapes vary from model to model and partly because mobile devices use a range of operating systems, each of which displays a website’s content in a slightly different way.

When developing a mobile website, it’s important to ensure that they work on as many handsets as possible. A good mobile site should ordinarily be expected to work across at least 70 per cent of the mobile market.

What people want – and what they don’t want 

Usability testing has an important part to play in the development of mobile websites. In a recent Rufus Leonard usability study of an existing site that had been modified for viewing on a mobile, it was immediately clear that people interacted with the content on a phone very differently to how they would on a desktop computer.

The target audience we tested were ‘known item searchers’ rather than ‘casual browsers’. They were seeking specific pieces of information and they wanted to find them quickly and easily. Once they had found the information they were looking for, they wanted it to be succinct and simple to understand. While casual browsing is common practice on news, entertainment and general leisure sites, people are much more demanding when they are searching information sites. They have no interest in anything that is not relevant to them at that particular point in time.

The modifications to the website we tested hadn’t fully taken into account the need for quick and easy access to the search function. During the test, we saw person after person get increasingly frustrated at having to scroll past irrelevant ‘browse’ content to reach the search boxes they were looking for. On a computer, they would have been able to rapidly scan the web page and hone in on the search boxes. But on a mobile handset, this is simply not possible because of the size of the screen and also the vertical hierarchy of content and links. A mobile user is disadvantaged by what is effectively a kind of tunnel vision. 

Our test also found that users are far less forgiving about invasive and intrusive content on their phones than they would be on a computer. They don’t want clutter or waffle or adverts. They want to be in control of what they see and don’t like surprises. Their mobile is a more personal device than a computer and they expect the content that is delivered through it to be more personal and relevant to them.

What makes a good mobile website?

Some of the best known media brands are one step ahead of the game when it comes to mobile websites. These are three sites that I think work well, two of them partly due to the bolt-on applications they have developed specifically for use on mobile devices:

The BBC
www.bbc.co.uk/mobile
The BBC mobile site is an abridged version of the regular BBC site. While it’s not a design ‘rich’ site, indeed it is quite basic, it offers powerful news stories written with all the authority you’d expect from the BBC and proves the old adage that ‘content is king’. It has less editorial content on the top level page than many other mobile news sites, but there are lots of generic links, which makes it easier to find what you’re interested in. The news stories are continually updated and quick links to the most time-relevant other items, such as the latest football scores or that night’s main BBC TV programmes, always appear near the top of the menu.

Facebook
m.facebook.com
Social networking has become one of the most popular and potent facets of the internet. It’s all about interacting online with your friends and business associates and the content of a social networking site is totally personal to you. Facebook has taken the phenomenon one step further, making it portable and in your pocket. With the Facebook mobile site, you can stay in touch with people when you are on the move. There’s a very simple way to upload photos from your phone and you can change your ‘current status’ every minute of the day if you wish to. Facebook have even developed a new application you can download to your Blackberry that acts as a bridge to the site and brings a new meaning to the idea of ‘push’ social networking.
 
Google Maps
google.com/gmm 
The Google Maps website is a fantastic resource on a PC, enabling you to find locations, directions and local businesses, and the Google Maps mobile application makes the experience even better on a phone. The information it delivers is determined by your location and you don’t have to input your postcode because your phone knows where you are. With a GPS-integrated mobile device, Google Maps can pinpoint your position to a distance of just three metres. With a non-GPS device, this goes up to around 1700 metres.

Ten tips for your mobile website

When developing a mobile site, there are some general points it’s always worth bearing in mind. These are our top 10 tips:

Select a URL that works for you
There are numerous options, including “mobile.companyname.com”, “m.companyname.com” and “companyname.mobi”. The “mobi” domain is relatively new and increasingly popular.

Keep functionality simple
As a general rule, the more basic the functionality of a mobile website, the greater the number of handsets it will work on.

Be colour conscious
Colours vary enormously from device to device. It’s easier to read black text on lightly coloured backgrounds than white text on dark backgrounds.  

Keep images small
Images should not exceed the width of the screen. The screen size of a baseline mobile device is 120x120 pixels.

Show only essential information
Don’t make important content difficult to find. And remember that the majority of mobile users pay for the amount of data they access, so the larger the page the more they will have to pay.

Use basic browsing controls
Place basic browsing controls, such as a back button or a ‘return to search’ option, in a clear and logical position on each page.

Think about menu options
People tend to scan menus from the top down, so place the most important menu items near the top. Keep the number of menu items down to a minimum.

Limit links
A mobile webpage should have less than 10 links. There are 10 number keys on a phone keypad and each of these can be used as a shortcut, so users can quickly find their way around.

Limit text fields
Allow users to submit information by making selections instead of filling in text boxes. Entering text on a phone keypad can be time consuming and the information isn’t always accurate.

Incorporate clicks to call
Turn telephone numbers into links that make phone calls. Don’t forget that making phone calls is still the primary function of a mobile.

Now that you’ve spent a bit of time thinking about mobile websites, it might not be a bad idea to grab a mobile phone and take a quick look at your own website on it. Bearing in mind the usability issues detailed in this article and the tips we have outlined above, are there any areas of your site that could be improved?    

View a PDF version of this article (37KB)

Our Views