In Don Norman’s book, “The Design of Everyday Things,” he gives us an analogy that I consider to be the best explanation when talking about website usability: “The user experience is like someone trying to open a door for the first time, it is technically a simple interaction, but the experience can be confusing at first contact: How do I know how to open this door? Should I pull, push or slide to the left/right?”
The design of the door should indicate how to open it, and if the design is not very clear, a label should be added showing the person how to interact with/open the door. A clear design and a label make the person (user) feel comfortable enough with the door (project) to go through the building (content) easily, without feeling anxious or unsatisfied.
Following this line of thought which anticipates the problems a user may experience when browsing a website, Jackob Nielsen suggests 10 heuristics to help us—UX designers—to create projects that incorporate the best usability and interaction possible.
1. Visibility of System Status:
The user should always know what’s going on in a project. It can be a loading bar while you are waiting to upload a document, a loading icon for a video, color changes, etc. Make it clear for your user that there is an ongoing process.
2. Matching between systems and the real world:
The user interface does not only belong to the graphics project. Before starting, the team needs to be aware of whom their target audience is and what’s the best way to engage them. How your content speaks with your target audience helps them understand that you care and that they are welcome.
3. User Control and Freedom:
This heuristic proposes that the user has the ability to perform an action if they need it. Imagine that your website has a career area where you can upload a resume. By mistake, the user uploads a wrong document (for example a recipe.pdf) but unfortunately the website doesn’t have a button to delete/change the document. The user will not be happy and very well might leave.
4. Consistency and Standards:
Consistency is key. It’s important to maintain consistency in your project. (text, color, icons, etc). The project needs to follow the same style on the pages–the elements need to talk to one another but also communicate in a clear way with the user.
5. Error Prevention:
How many times did you mention in an email that you attached a document and you sent it without the attachment? The project needs to help the user avoid mistakes such as this, or, if it has already happened, display an error message and suggest how to correct it.
Follow the same email example, if you write the word “attached” in Gmail and forget to attach anything, upon clicking the “send” button, Gmail checks to make sure you’re not forgetting to attach a document. This is the system helping the user prevent a mistake. Another common example are alerts when a user fills out a form but forgets to fill in a mandatory field.
6. Recognition rather than recall:
Asking the user to memorize their journey within your website is never a good idea and will make them feel frustrated. (Trust me, I have the memory of a goldfish and am the type of user that will never remember what I was doing moments before clicking a link).
A great user interface lets the user navigate through its features without problems. If the project is too long, making the user take many steps to return to where they started so they can navigate elsewhere can be annoying and unmotivating! Breadcrumb icons can be efficient and help the user in this case. If the breadcrumbs are not enough, a sitemap or help area can be an effective addition.
7. Flexibility and Efficiency of use:
A good experience can have different user levels; you never know who will be visiting your site, maybe it is a first-time user or maybe it’s an advanced returning user. For example, in an eCommerce store, a first-time user access can be more informative and educational about the products whereas a frequent user, when logged-in, can be shown featured products based on their the last purchases, by products in their cart, etc.
8. Aesthetic and minimalist design:
Minimalist design doesn’t mean poor design. Good aesthetic and minimalist design makes your users feel comfortable with your website and able to find what they need in an easy way (users don’t have time to waste). When a project is created, the designer and the UX specialist need to know what the user expects from the website. Clear content, without any irrelevant copy is as important as prioritizing areas, images, icons, and design identity. A happy user journey is made by good interaction between design and copy.
9. Help users recognize, diagnose, and recover from errors:
Error messages and navigation need to be clear; they need to let you know what is causing an error and how to resolve it. For example, if the password in a form subscription needs to be created with special characters and the user has not used any, a message explaining why their password won’t work should be shown near to the respective password area. Another interesting way to keep the user on your website when going to a page that doesn’t exist is by making the famous 404 error page eye-catching and helpful, adding links, search bars, messages, etc.
10. Help and Documentation:
This isn’t applicable to all projects, but in cases where it is needed, it is always important that this help area has good navigation with a search bar to hide or show more information to make it easy for the user to find the information they need. A FAQ area and infographics are other good options. You can also have a small question mark icon that – when clicked or on mouse hover – will show more information.