July 25, 2014 · Mobile User Experience

5 important things to remember while designing a mobile website

From the silicon valley to the streets of berlin, from the busy markets of Kenya to the bustling small towns of India, not a soul can deny the mobile revolution. Everyday we hear new numbers, new statistics (refer the KP Internet trends report as the latest addition in the list) and industry bigwigs talking about the mobile being the next game changer (see this video - Eric Schmidt saying mobile has won).

Mobile came and highjacked the long time supremacy the desktop enjoyed. However, the big question is, just like Y2K, are the companies ready for this incoming challenge? Just that this one is a lot more real and lot less hyped than the Y2K problem (which was way too naive to have been given that level of dooms-day respect). All the legacy companies struggled to move from offline (read traditional) retail / mediums to getting on to internet. While that is just about getting stabilised (or is it???), we are already faced with the next big challenge. Companies are scrambling for a foothold into the mobile world. Its as big an unknown as internet was back in the old days. There will be a learning curve, changing consumer behaviours, aspirations and expectations. While that goes on, there is a lot that has already been discovered. So as part of a sequence of similar articles on mobile strategy, lets start with the simpler (and most important) things - the mobile UI.

1. Maximise the Real Estate, without clutter

If you had a big canvas to play with, life would be a lot simpler. Mobile gives you a very small window (of opportunity) to feed your consumer of the maximum you can afford. However, the key is to not get drawn by the overwhelming emotion of communicating everything. Be selective. It's better to show less that registers than to show everything that confuses, creates panic and hence makes the visitor leave. Tools like connecto help you improve the usage of real estate further with soft / non-intrusive pop-ups that help you communicate further with your end customer without hurting the site aesthetics.

2. Typing on mobile sucks!

Minimise forms. Avoid text boxes. Use as many other input fields as possible - check boxes, drop downs. Keep typing to a minimal, for obvious reasons. This will improve your user experience tremendously. Also, make sure never to customise drop downs. It overrides the browser default on the phone and makes selection hell for users!

3. Design for users with Fat Fingers!

Give space, make big buttons. Don't make too delicate buttons, links which cannot be clicked easily by people. Dont design for Cinderella! Design for the chubbier folks :) Ensure "Submit" and "Cancel" are not both too close to each other (a common mistake). It just pisses the user off. Keep ergonomics in consideration. Intuitive things to be used together should not be too far apart (Say filter items), so that both hands don't need to be used.

4. Make sure to be judicious about your images

Oh how i love images! on those glistening new smart-phone - delicious! But the joys of life come at a cost. Every image is like a baggage that slows you (read your site) down. Compress, optimise and be stingy. The lighter a site is, the faster it'll run - and there's a lot of (implicit) points a user gives to speed.

5. Throw it out there and iterate

This will just be a blog, till you make it and actually ship it out for the users to see. Sit with users, watch them use. Carefully monitor their finger gesture/movements. See what can be sped up. God is in detail and detail comes with iterations. The "perfect product the first time" is a myth. Perfect iterated product is a reality!

Go out there and win your mobile war!

  • LinkedIn
  • Tumblr
  • Reddit
  • Google+
  • Pinterest
  • Pocket