Why is this important?
With more and more people using the Internet with their mobile phones, more and more sites are launching mobile-optimized versions of their service. The importance and numbers of people using mobiles to browse the web has recently been debated by Tomi Ahonen on his Communities Dominate blog and Dean Bubley who disagrees with Tomi on the numbers (continued here and here).
Best practices checklist
This is all very good, but whatever the numbers are, it’s clear the mobile web is increasing in importance. Personally, after some years of skepticism, already a couple of years ago I found myself using the mobile browser daily. Unfortunately, there are some quite annoying and seriously debilitating trends in that space. If you’re planning on making a mobile-optimized version of your site, consider the following list, which from my point of view captures some of the most important best practices when doing so:
- Make a light-version of your site – light in terms of size, that is. Make images smaller, optimize the page structure, skip some videos, cut some ads etc. Websites exceeding one megabyte per page are not a joy to download over any wireless connections. Yet, don’t make the pages too small either – few things are more annoying than having to read a short article that’s split to something like seven pages to keep things “light”; the RTT delays over wireless networks are way higher than over fixed and page transitions are slow.
- Don’t skimp on the content. Having a “light” site doesn’t mean you should leave out content from it. Some service providers apparently think that mobile users don’t need all that content – wrong! It’s a sure way to annoy people if you put one tenth of your content or shortened versions of articles on the mobile site.
- Take it easy with the ads! I’m all too well aware that mobile advertising is one of the big things in both advertising and mobile operators’ future business. Small, relevant advertisements are acceptable and might even be welcome, but simply porting the current web-situation to the mobile side is unacceptable. I’ve seen some non-intrusive, well-placed and relevant ads on NY Times and some downright horrible ones on other sites. Also, remember that even a relatively small ad takes up a huge portion of the small mobile screen, so keep things small.
- Don’t use Java. I thought Java applets were dying anyway, but it seems at least some braindead banks (ahoy, Sampo!) plan on requiring Java as a “security” feature. Having Java applets perform any critical function will effectively block out all mobile users.
- Consider a client if your service would significantly benefit from it. A case in point is GMail – it works tolerably via the browser, but it works wonderfully with its own downloadable client. Not everything is ready to be run on browser on the mobile side quite yet.
- Make the redirection to the mobile site automatic.. This is one of the most important things and if done right, does not conflict with the point below on being able to access the full site. On the way to making mobile web work well, there understandably have been – and will continue to be – some wrong turns. One of these is the launch of .mobi TLDs (top-level domain), meant for mobile-optimized websites. This is, in my opinion, entirely unnecessary – users shouldn’t be forced to enter a different address when using a phone to access some site. Those running a website shouldn’t be forced to run the same content in two different domains. If you must have the mobile site at a different address without automatic redirection, use simple and short addresses – things like m.site.com are light years faster to type on your phone than, say, http://www.kirjasto.oulu.fi/tekstiversio/plain.html.
- Allow access to the full site. Some people may not want to visit only the mobile-optimized site from their device but would rather have access to the full one; it’s wrong to force a user to only access the mobile version. This is even more so if you break the other rules. It should, therefore, be possible to easily access the full, standard site via a link from the mobile site. Google does this well by putting a link in their mobile version that allows you to access the regular version. Many others have still not gotten there, even though it’s an exceedingly simple thing to do.
Let’s take a couple of examples of mobile-optimized news sites and see how they rank according to the above criteria. To start with, consider one of the most popular news sites, CNN.com. When you access http://www.CNN.com from a mobile browser, you’re directed to http://cnnmobile.com/. So far so good, considering the basic CNN main page is quite heavy. But afterwards there’s nothing but disappointments to be found here: there is very limited amount of content available, it’s spread over too many pages and way too much of the space is taken up by ads. CNN is a prime example of how NOT to create mobile site. Also, there’s no way to access the full version of the site from the redirected site – to do that, you have to manually enter http://edition.cnn.com/ – not very intuitive. Anyway, take a look at the crowded screenshots below – there is very little useful information on any one screen as the page is filled with other crap:
BBC News has a few versions optimized for different devices, maybe even too many. There’s the full-blown version at http://news.bbc.co.uk/ and a low-graphics version at http://news.bbc.co.uk/text_only.stm . Then there’s a PDA-version at http://www.bbc.co.uk/mobile/pda/, a mobile optimized version with images at http://news.bbc.co.uk/nolpda/ukfs_news/hi/default.stm and without images at http://news.bbc.co.uk/low/english/pda/default.htm – which one of those is one supposed to access?! It’s a trial and error process and not a very convenient one at that. If you access the main website, http://news.bbc.co.uk with an S60 mobile browser, you get to http://bbc.co.uk/mobile, which is a crappy WAP version of the news site with few and tiny images and no way to get to the real version. Not good. See below for screenshots:
A better example is NY Times; when accessing http://www.nytimes.com/ with a mobile device, you’re taken to http://mobile.nytimes.com/ which is a pretty usable mobile version. The advertising (when there – there are very few ads) is not intrusive and the pages contain plenty of text and stories – I’m not sure if it has all the textual content that is on the regular version, but it certainly has enough. The stories are split to pages, but the pages are reasonable in their length so that’s okay. Moreover, “paging” is just the default setting that you can change, another plus. There are also some images which is nice. Something I’m not, however, able to do is access the full version with the mobile browser.
Overall, many sites do some things right – like directing automatically to a mobile-optimized version without having to memorize a mobile site URL, but also some things wrong – like not (easily) allowing access to the full version of the site. Of the news sites, the CNN mobile version is quite useless while the NY Times one is already pretty good; BBC News falls somewhere between the two, but only if you access the right mobile version which you have to choose yourself – for S60 browsers, the one at http://news.bbc.co.uk/nolpda/ukfs_news/hi/default.stm works best IMO.
One more potentially lethal misstep that should be mentioned is content adaptation / mobile browsing gateways by the operators. They might work to some limited extent for very simple browsers, but some operators are planning on using these gateways to e.g. inject advertisements. A very bad idea. If you find a website that doesn’t “mobilize” well for your device, you can always use operator-independent mobile optimizers; Opera does that, Mowser used to do it and Google does it also. With increasing number of websites mobilizing reasonably well and as you can use operator-independent services for others, why should you tolerate an intrusive operator-run content adaptation gateway?
Btw, Google also does some decent site “mobilization” if you need such a feature – and finally, it might be worth to check out their other mobile services from http://mobile.google.com/ also.