Mobile phones of today can handle big sites fine. They can handle JavaScript quite well too. Then why is it that I constantly encounter crappy mobile versions of sites? What is it that makes these sites so bad, even though they were obviously designed with small screens in mind?
While making a special layout for small screens is a great idea, there’s often something that people still get completely wrong with their mobile “optimized” sites.
Why mobile “optimized” sites tend to suck
People who build these so-called mobile optimized sites often don’t realize that phones can actually do quite much today.
So they do a simple mistake: They remove features and make the site crippled. They might even go as far as offering less content.
While simplifying the site is not necessarily a bad idea – afterall, a small screen does limit what you can see at once – it can be easy to go wrong when reducing features from your site.
There is, however, a simple rule: Would the mobile site still be usable on a desktop browser? Is the feature I’m planning to remove something that people use on the desktop site?
If I use a feature X of a site on my PC, I do still want to be able to do that on my phone browser too. If you remove a feature in your mobile site that is available on your desktop site, and it’s not a completely trivial thing, it’s quite likely that you’re making the lives of your users more difficult.
Example of a bad site: Twitter
Have you used Twitter’s mobile site? If you haven’t, better just grab a Twitter client on your phone and forget about it, as their mobile site is pretty bad.
Let’s first look at what they did right: They removed most of the stuff that’s visible on their main site, and are just displaying the essentials.
You get a box to write new tweets, a list of tweets and some links to see your replies and direct messages. The layout is quite simple, but it’s fast and easy to use on a small screen.
However, there are bad things.
A particularily annoying design choice is the write tweet box, which is way too small. It’s nowhere near the 140 character limit, making it very tedious to write tweets. Another big mistake with this feature is that they decided to completely omit the counter which shows how many characters you have remaining. Oops.
A feature I also miss is being able to reply easily. It would not have been a big effort to add a reply writing link to each tweet, like they have on their main site.
Example of a good site: Google Reader
Google Reader is a great example of a mobile site done right. It’s much simpler than their main site, but it doesn’t matter, as what you want is immediately available: Your feeds.
Reader’s mobile site makes it very easy to read your RSS feeds on the go, which is something I do quite often. Even though it’s highly simplified and does not appear to have any JavaScript features, they still managed to keep every feature that one might need.
You can view your feeds, reading items is easy and they load quickly thanks to the simple layout, and all the actions such as marking things read and leaving items unread are still there.
Note: There is also a JS-heavier mobile version of Google Reader which seems to be default in Safari. I’m not refering to that, but that one is even better.
Final consideration
It’s easy to criticize Twitter or other stripped down mobile sites for poor functionality. However, Twitter’s site is still usable with simpler phones that have browsers that can’t handle JS code properly. Even though I have a smartphone which handles almost any website just fine, a lot of phones don’t.
So the final question to ask is do you want to make a site for smartphone owners, or for people with “non smart” phones? Personally I would turn towards smartphones, as browsing the net with other phones can be tedious in any case due to lower data transfer speeds and small non-touch screens. Writing a site for smartphones effectively means simpler phones will have problems accessing the site, but writing a site for simpler phones means smartphone users will have a worse experience.
Of course, there is progressive enhancement, which seems to be forgotten by many authors, but it requires more effort. It may be easier to choose your target audience.
Do you know any other sites that did a mobile version right or wrong?