4 rules to ensure successful website design

4 rules for successful web design

Website design is often a major failure point behind converting new and old customers alike. This article has four effective rules to help avoid this pitfall.

First we need to delve into what a website is, and the reasons behind what the design is trying to achieve

“A website is a (product) presentation where the user is, uniquely, directing the journey.”

The vast majority of websites only convey information about the product; they don’t persuade the user to action the objective. A good website grabs the attention of the user immediately and then makes it extremely easy to navigate through all the information the user needs before presenting them with a clear call to action to the objective.

Most websites/webpages/webpage sections suffer one of the following:

  1. No clear point – It is not obvious what the Website/Page/Section does. You are making the user work to find this out.
  2. No User Benefit – There is information presented that isn’t useful to persuade the user to buy-in to the objective (and therefore shouldn’t be there). It is distracting for the user and makes it harder to find actual beneficial information.
  3. No Clear Flow – No obvious call to action to proceed to the next part of the user journey when required. The user has to think to find the next step in the journey.
  4. Too Detailed – Too much information thereby making the customer “think” to process it all, Therefore losing focus of the objective you are trying to drive them to.
  5. Too Long – The maximum time that users are normally willing to give uninterrupted attention to one thing is 20 minutes. If the website presents a journey that is longer, it will struggle to get conversion.

The common theme on the five points is that the majority of issues are not with the content, but how it is structured. Most importantly of all, these issues make the user think.

Why is it important to not let users think?

To answer this question we have to review how we, as the users, as humans, work. To start, you are lazy – we all are; we are intrinsically lazy people. We will always look for the shortest path to achieve our goal. Interestingly, and in an ironic twist, it is this desire that pushes us to innovate.

This is never more notable than how we think. The Nobel winner, Daniel Kahneman, wrote in his acclaimed book, Thinking, Fast and Slow, that there are two major systems at work in our brain.

System 1 operates automatically and quickly, with little or no effort, and no sense of voluntary control. This system is used the vast majority of the time and allows you to quickly detect distance of objects, complete known incomplete words like ‘ecommerc…’ and allows you to drive a car on an open road with very little thought.

System 2 operates very differently in that it allocates attention to the effortful mental activities that demand it, and that system 1 cannot do, including complex computations. Examples of this at work are when you try to divide 786 by 12, walk faster than normal or search for a known individual in a large crowd.

You will notice that if you attempted the example, of dividing 786 by 12, that your attention perceptibly focused and that your registered peripheral vision reduces drastically*. You essentially started ignoring what was happening around you. You also had to work much harder; resulting in higher levels of glucose required by your brain, of which the symptoms are your eyes dilating and your heart rate rising slightly. As a result, it is significantly more effortful than a system 1 process like answering 2 + 2.

If the website has failed in the design and forces the user to rely on their system 2; it has three negative effects for the users interacting with your website:

  1. We don’t like using system 2, it requires effort and we will avoid it if we can. We will only use system 2 when there is a strong desire for the result. The effect: if you make your customers use system 2, to make them think as we commonly perceive it, then they will not do so unless they really want your product. For potentially new customers, especially those that don’t know they will want your product, you have lost them already.
  2. If your customer is forced to use system 2 to comprehend part of the design, they are significantly more likely to be distracted from seeing the rest of the website. As any good presenter will tell you, remembering that a website is a presentation, is that this is a disaster. Once a user is bounced out from the process of trying to navigate the journey through your website they are vastly less likely to make the effort of re-trying.
  3. System 2 is the rational part of our brain, it is the part that questions everything including our pre-conceived ideas. It is also the part that will question potential actions, the tiny devil angel in your mind that says “Do you really need to buy domino’s pizza tonight instead of cooking a healthy meal?” If your user is using system 2 they are less likely to be open to impulse decisions and temptation. If your product is non-essential then likely say good-bye to your conversion.

Well-designed websites are considered easy, and most importantly, fast to browse. The latter is a misconception. They are just effortless to use and therefore we don’t conceive of the actual time we are spending on them. When you make people think, make them work, they are much more aware of time. The same as you are much more aware of time when you are sprinting. A minute can feel MUCH longer.

To avoid making your customers think, follow these simple four rules:

1. The Squint Test

One of my favourite design litmus tests. Simply look at a website page, starting at the top, and squint at it so that it becomes slightly blurry. There should be two points that are still obvious.

Is the purpose of the web page clear?
Can you see what the web-page is about? If it is the home page this should encompass the proposition of the website. Whilst squinting you should be able to read it still. This ensures you have a clear point that is the central focus. Similar to each slide in a PowerPoint presentation, each should have an obvious introductory overview/title. The website then has a clear flow into the webpage and easily links that page to the overall journey.

Is there a clear, and easy, next action for the user?
Remember that websites are unique in that the user is driving the journey. Once the customer understands the purpose/proposition, just as dangerous is not having an obvious actionable for them to do. Ensure there is a very easy route for the customer to move to the next step in their journey. Applying this design element to the squint test ensures it is a focus and creates a clear flow for the user to the next stage of the journey.

Example: Airbnb, one of the best designed websites in the world. I challenge you to find any webpage where its purpose is readily apparent and where there isn’t an obvious next call to action.

2. WIIFY (What’s in it for you)

I have spoken about my love of WIIFY HERE. In this case; everything should be placed onto the website with a question of WIIFY from the customer’s perspective. If you cannot give a reason why the customer would find it interesting/useful, it should be removed. This ensures that there is a clear benefit to the user and that you don’t have too much detail.

Example: Amazon are relentless in their pursuit to be focused on only showing relevant information. They are also incredibly good at using a visual hierarchy (structure) to enable them to input a tremendous amount of content that is still easy to scan and therefore prevents their customers from thinking. The linked webpage about their Kindle page is a fine example of this.

3. Readability – Language

Readability is the ease of absorbing written content. If the language of the content is written from the perspective of the author, or business, then you are forcing the user to re-interpret the text from their perspective. You are forcing them to think. Ensure that you are always writing from the users perspective, also consider font, if the font is hard to read, you are making them think. An insightful article on the importance of fonts for different platforms is HERE.

4. Linking colour to actions

The system 1 part of our brain is incredible powerful at spotting patterns, often without us realising it. Use colour to help it in doing so. Have one colour that is used for your principle objectives, another for secondary and another for the tertiary. You will unlikely need any more. Ensure that you don’t use these colours anywhere else in the website. You will be shocked at how quickly users will work out what is going on, without realising it, and seek out each colour depending on what they want. Consider Amazon, looking to buy, checkout find related product. In orange. Want more information, see account details. In blue. You likely have never clocked it before but Amazon is cluttered, but still very easy to browse, this is mostly due to their clever use of visual aids: in this case colour.

“In the end you want to illuminate the journey for the user. Don’t involuntarily hide it. Don’t make the frustrations of trying to learn about your product; taint your product.”

* There was a great experiment in 1999 where they showed the effects of using system 2 intensively. Have a try yourself:

Leave a Reply

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