Your website is the face of your company and in this instance it is very much the case of judging a book by its cover!
1. Your User
The average human attention span is less than that of a goldfish, according to a study from Microsoft Corp. It was found that our attention is held for just 8 seconds, a whole second less than our fishy friends.
So, what does this have to do with website design? Well, this means that when a user visits a website for the first time, the site has just 8 seconds to convince them of its value proposition and ultimately to convince them to stay on the website.
This means that the design needs to be appealing and functional; it will need to be fast and usable, a slow webpage can lead to frustration, a loss of interest and ultimately a loss of a site visitor.
Before you can begin the design, you will need to think about your user: what do they need from your site? What do they value? What are their abilities? The purpose of creative website design is to convince the user to do XYZ or buy XYZ, so you will need to understand your users through and through. You may even need to conduct some market research to fully gauge what they will need from your site for it to be effective.
There are two broad types of website user: the quick skimmer and the in-depth reader. The quick skimmer, as the name suggests, will read through the page as quickly as possible; the second is the in-depth reader who will read the page in all its detail; an individual user may change their type at different stages of their customer journey. You will need to be sure that your website caters for this dual readership path, both in terms of its user journey and in its aesthetics.
What your website needs to achieve will largely depend on your users and your industry but in a more general sense, your site should be:
Valuable, it should provide the user with satisfaction.
Useful, it should fulfil a need.
Desirable, it should be designed to evoke emotion.
Credible, it should be trustworthy.
Findable, your content needs to be easy to navigate.
Usable, your website needs to be easy and clear to use.
This has been described by Peter Morville as the User Experience Honeycomb, which is a really interesting take on what a website should do.
The main thing that you, as a web designer, need to get across is your value proposition: how does your product or service solve pain points? What are the main benefits? Why should the consumer pick you over your competitors?
Let’s first take a look at how Microsoft manage their user's experience.
There are various elements that Microsoft utilise here on their site that are great examples of best practice in website design.
The first thing that might strike you with this page is the simplicity and minimalism of it, there is no overcrowding of content. So how can you achieve this and why do you need to?
It has been proven that on entering a site, a user's eyes will start in the top left corner before going to the right and then continuing down the page. They will see the webpage, in an ‘F’-style formation, so you shouldn't overcrowd this area with too much information but this is also where you should place your most important content.
The above-the-fold of your site must not be too chaotic, overcrowding will take away from a user’s comprehension and ability to navigate easily through the content. You can see above that Microsoft know this and, for ease of use, have made the user's next navigation the first aspect a user will see next. This is the first thing that will direct the user’s journey and will help them to get to where they want to go as quickly as possible.
Another part of this site which is particularly valuable in website design is the use of white and negative spaces which aren't packed with any content. This negative space between elements, to a web designer, is fundamental, but to a website owner, may seem a waste; it has been proven however that more white space and less overcrowding of sites can increase user comprehension by 20%. Using relevant visuals will also help improve comprehension and will support your value proposition too. In the Microsoft example, all of the images are self-explanatory and all sit against plain backgrounds. This allows for minimal copy and clear guidance as to where the user should be looking as they go through the page, and a better understanding of the purpose of the site.
Now, let’s take a look at another example of a brilliantly designed website.
Dropbox Business demonstrates a number of best practice design elements. Firstly, even on your very first glance, it is clear where the site wants you to go next. The Call-to-Action (or CTA) ‘Try free for 30 days’ is placed in a central position, the clickable element is obvious and it uses an active verb ‘try’ which encourages the user to react. It is always best to place CTAs either in a central position in the page or more towards the bottom of the page, placing it at the top could come across as being too pushy and may well be off-putting for a user. Other features of design which may make you appear to be trying to take too much control over the user could include using things like blinking text or ads or changing the scrolling from the browser's norm, users want to be in control of their own browsing.
In going through some other pages on this site, there is a level of consistency in both visual aspects and in its functioning. Colours and fonts remain the same, demonstrating how closely the brand strategy has been followed in the creation of this website. In selecting your brand’s fonts, it is always best to use a maximum of just two fonts across the whole site, and these should relate directly to the overall style and personality of your brand, as well as your industry. When it comes to the written content, information hierarchy is important and as you can see above, Dropbox Business sets the priority of each section in their use of headings and subheadings. The headings can further help guide your reader when they are differentiated using colour and different weightings, this will especially help the skim reader find the parts they are most interested in. The elements will allow the user to know where the emphasis is, what is important here and they will be more able to grasp you as a company through your written content, if this is done effectively.
The functioning of your website will also be vital to giving off an image of your brand which will appeal directly to your consumer. Users will be put off by a number of common issues with websites. The first is broken links, you should ensure that if a link is broken you create a 404 error page which also includes links to other parts of the site. It would be ideal to not have any broken links at all, but if they do exist on your site, the 404 error page will help you retain your site visitors.
Here is Webstars’ own Error 404 page:
Similarly, you should ensure that your pages don’t take too long to load. Loading speed could also lose you users, users expect instantaneous loading, 40% will abandon a page if it takes more than 3 seconds to load, with this figure going up to 53% on mobile sites. This could have a dramatic impact on how a user will then see your brand and its characteristics.
CrazyEgg offers some great advice on improving loading speeds, including:
Minimising HTTP requests
Enabling compression and browser caching
Optimising CSS delivery
The key then, in designing a website, is to put yourself in your user’s shoes, but not your shoes that look like your user’s!
You can’t assume that you know what they want to see or what kind of content will work best so it’s always safer and more worthwhile to do your research!!!
Read more on website design by taking a look at the following: