When the iPhone first came out it was a game changer; we could finally have a real full web experience from a small hand held device and it was pure awesomeness. Others quickly followed suit with big players like Android and Blackberry using the same WebKit browser engine used on iOS devices to power their devices too. Then the iPad and other tablets came out giving us an even larger mobile experience that has trimmed time spent on traditional desktop computers substantially. Somewhere along the way some people have forgotten how amazing this breakthrough really was by taking our incredible mobile experience and substantially dumbing it down. Not everyone has got it wrong though, in fact some are delivering incredible mobile experiences, but for the rest, it’s time to stop serving less to mobile users.
In some of these crippled mobile sites there is no option to escape the ugly mobile version. Sometimes the “view full website” link doesn’t even work! Look at the screenshot below (sorry to pick on TUAW, it’s just one of many examples I could have chosen), it doesn’t get much uglier than this. At the time of posting the “Full TUAW” link did not work either, so if you were on an iPhone, you were are stuck with this. You might as well punch me in the face and serve me the RSS feed.
Here are some do’s and don’ts for mobile websites
- Give me an awesome mobile experience if time and budget allows.
- Allow me to view your full site if I so choose.
- Serve me your full site when time and budget does not allow for a mobile experience worth viewing.
- Make the experience better than the desktop version would be on a mobile device.
- Serve me up a boring uninspired mobile version because you think you have to have a mobile version of your site.
- Lock me into your mobile site with no way of getting to your full site.
- Give me a mobile version of your site that is lacking important features that your full site has.
- Be the 1000th website to popup a message asking me to download your native mobile app.
I do understand giving people a more light weight experience on an iPhone, but if you are going to give me a mobile experience, give me something to remember and give me the option to view your full site. The iPad however is a different story, if you are going to deliver a mobile experience on my iPad it better blow me away, because most full websites look and work just fine as is. Why would I want to see an ugly almost plain text feed on my iPhone or iPad or any other mobile device? Many hand held devices are powered by Webkit, arguably one of the best browser engines available. I bought an iPad for the full web experience, not a diluted boring version.
Why would someone want your full site?
When you give a stripped down version of your site you are making a lot of assumptions. Case in point, I am a daily visitor of a large news site that by default serves me a fairly bland slimmed down version of their site on both the iPad and iPhone and I’m assuming it does the same on Android devices. One of the main reasons I come to this site is to read the articles and see the comments and social interaction. In the mobile version there are no comments. Don’t assume your mobile users won’t want something that is on your full site. If you really believe it is not important, maybe it shouldn’t be on your site at all.
This is just one example, but often mobile sites are dry uninspired plain text feeds with little thought to the design or presentation of content. If users want this they can subscribe to your RSS feed.
On to the good stuff, there are many fantastic mobile sites
It’s not all bad news in the mobile space, there are some incredible mobile websites out there. Below are just two examples, but there’s plenty more.
Airbnb not only looks great, but it has everything that the full version has, and it’s delivered in a way that makes it easier to use than the desktop version is on a mobile device.
Tim Hortons breaks down it’s site in a compelling way, the colours are vivid and the interface is intuitive. It’s a site you draws you in and makes you want to explore.
Another thing you will notice about both of these examples is that they both provide a link back to the full site. Want to see more? Check out Mobile Awesomeness for a huge collection of great mobile designs.
What about responsive design (AKA media queries)
Don’t forget about responsive design, it’s a great way to serve many screen specific layouts using your same code base. In fact, responsive design may be the best choice as we get more and more devices with many screen sizes. With time it will become harder to make device specific websites because we will have so many to contend with. Responsive design brings an elegant solution to this dilemma that is more practical than building many device specific versions or even apps of your site.
It’s okay to show your full site
Not everyone has the time or budget to make an awesome mobile website, myself included. If you can’t deliver a worthwhile mobile experience theres nothing wrong with that, but don’t settle for mediocrity, just serve your full site and offer an RSS feed, today’s devices were designed from the start to be able to easily pinch, zoom and navigate traditional full sized sites, your visitors will get by just fine.