Typically there are 3-4 tasks that users want to perform on a site. Ideally you should do this before you start designing but note down what these are. Does the design help users to perform these tasks? Is it clear what they need to do? Focus first on tasks and then add design elements rather than the other way round.
This is probably one of the simplest things that you can do but is extremely effective. With the design in front of you squint so that it is largely blurred. See if you can make sense of the screen. Can you tell where the navigation is? Can you identify the major user actions? Bear in mind that users have a very short attention span so if you are hiding things they are likely to leave your site before they have had a chance to do what they want to do.
Users are human. They are going to make mistakes. Too often designs focus on the glossy front page and not on how to help users recover from mistakes. Good error handling should be built into the design and if not the interface designer should take responsibility for it. I’ve worked on many projects where error handling is an after-thought that is added by over-stretched coders at the last minute. Helping users recover from errors is all part of designing a good user-experience.
Let’s be frank. If you guard your designs until launch you are likely to end up with a poor result. The web is about people doing things. So designs must help them to achieve their goals or they will quickly hit the back button and leave your site. Your friends and family can offer you a free way to stress test your designs and gather feedback. It is a good idea to ask them to perform tasks or question them as to where they think they will find things. Otherwise you may get comments like “I like the blue” but nothing that will help you to make the design easier to use.
If you have the budget user group testing is invaluable. It is not difficult to devise a task sheet for users to complete. Find a spectrum of users who are likely to use your site and watch them as they go through the task sheet. You are likely to learn more about your design from this than anything else. You can map the task list to your business goals to ensure that the site is promoting the right things and that users can access them quickly.
Use Firebug and the web developer toolbar to ensure that your download speeds are acceptable. If the BBC Homepage can attain a page weight of around 110k so can you. Look at the size of your images and try and optimise them if they are too large. Long download times are likely to irritate users so this is something that is extremely important. Yahoo recently released YSlow, a plugin for Firebug, that has some great tips on making page weight lighter.
Using the web developer toolbar turn images off on your site. Does the page still make sense? Does the overall grid make sense to what the user wants to achieve. A well thought out grid should be the basis for your design and provide users with a visual map for using the site.
Using the web developer toolbar turn off all styles on your site. Your site should look as good naked as it does with clothes on. By that I mean the underlying HTML should make sense without any styles. If the page has been created well you should be able to make sense of which elements on the page are more important than others. This is an invaluable exercise as it will improve Search Engine Optimisation and basic Accessibility.
If you want the adulation of thousands you are in the wrong industry. As a web designer praise is likely to come in the form of no emails complaining about how a site is difficult to use (if you are lucky). Making the shift from the idea that designs are an expression of your ego is an important step. Listening to users and placing them at the centre of your design process is a big shift in philosophy for many designers but it is one that is absolutely necessary and one that will pay huge dividends.
What’s the best way to find out if your design is easy to use? Get your Mum to have a look at it of course. Mums typically have a reasonable understanding of the web but will also show up poorly thought out designs. Ask your Mum (or your Dad for that matter) to perform the most common tasks that you want users to do on the site. Whatever the outcome you’ll probably find that you learn something about your design.
The web is about people doing things online. Too often users and the tasks that they want to perform are not included in the design process at all. The result is that a few months after launch more time and money will be required to rectify design issues that could really have been caught at an earlier stage.
The best web designers that I have worked with are ones who understand their craft but also understand human behavior. Furthermore they are not afraid to take and learn from criticism. It is the very thing that differentiates them from poor designers.
Have an update or suggestion for this article? You can edit it here and send me a pull request.
Build your own Vim statusline
Statuslines in Vim are not hard to create. Making your own means one less dependency in your life.
Custom Vim Bindings in tmux 2.4
tmux 2.4 made a significant change to key bindings. Here is how to support custom keybindings for versions before and after tmux 2.4
Using template files in Vim
Vim templates or skeletons, allow you to specify a template to be used for new files with a certain extension.