5 usability tips for mobile website design

Reading Time: 3 minutes

Be honest, how often have you been disappointed by the mobile web experience? You can almost tell with some mobile web sites that they haven’t so much been designed, as compressed and fudged. You can notice straight away when a designer has followed the path of least resistance and simply tried to pair down the main website so that it fits in a mobile format. It just doesn’t work. All you end up with is a mobile website that doesn’t deliver and a set of disgruntled customers who probably won’t be bothered to shop with that particular business ever again. Mobile website design is a specialised subject. Now some might argue that anyone could do it satisfactorily, but we at TSW System Solutions don’t agree. Professionally designed mobile websites not only look the part, but they also deliver: they’re usable, simple, practical, accessible and thoughtfully designed. So what’s the most important part of mobile website design? The answer to that is usability.

If you want to create a mobile website that has a solid and reliable mobile interface, then it has to be designed properly. Hopefully these tips will give you some guidance.

Know your audience

The success of any web design is based on the relationship between the designer and the user. No designer can hope to build a user-friendly interactive mobile website, without have knowledge of who the user is likely to be. They have to know the audience the site’s aimed at. This can be done by conducting a few tests and gathering information using various testing and analytics tools on a large scale site. With this information at hand, designers will then know what the audience wants and what they’re attracted to.

Keep it accessible

Mobile websites are only effective if the user is able to move around from one part of the site to another with minimal fuss. In short, it must be accessible. It’s much better to allow toggling for options, rather than forcing users to view them. Hide rarely used features and widgets and keep the interface as clear and simple as possible. Most of the attention of a website user needs to be focused on content: aesthetics are actually secondary: the content should be both accessible and legible.


The simpler the mobile website design, the better.  Remember, less is more. Ensure your navigation bar is as short as it can be, and eliminate excessive hyper-links within the one page. Keep the use of images to a minimum. A simple mobile website will be far more effective than an overly-fussy one.

Using colour

It might seem an odd thing to suggest, but colour used within the right parameters can be very effective: a visually compelling colour can communicate information without using lots of additional space. Background colours are accepted; however there must be a definite contrast between a background colour and text. Information conveyed using colours, should contain a clear contrast between any of the other elements within the mobile websites design. Remember, colours are used to communicate information effectively, not just to make things look pretty.

Test, test, test

All good mobile website designs will need to be tested, and then tested again. Testing for usability can’t be a one-off affair: it needs to be ongoing. The tests need only be simple, but should be applied to all different platforms. Don’t forget that users will access the website using a variety of devices. Rigorous testing will ensure that whatever device your users choose to view your site with, you will know that it will run as efficiently as possible.

Leave a Reply

Your email address will not be published. Required fields are marked *

Skip to content