WEBSITE DESIGN GUIDE - THE 10 MOST IMPORTANT WEBSITE DESIGN GUIDELINES
1. DON'T FORGET TO COMMUNICATE A VISITOR BENEFIT
Every visit to your site is made with a mission or a job in mind. Visitors want to achieve something, whether that is buying a product, finding information about the service you offer, or just killing time or looking for entertainment. Your job is to make the visitor realise they can complete that mission or job on your website.
If you’re selling products or services, or just trying to convince the visitor to do something (for example, joining a fun run), then you need to communicate how your stuff delivers a benefit to them. You also need to show how that benefit is greater than what they would get from any available alternatives, remembering that these alternatives could come from a direct competitor offering a close substitute, or from something altogether different that still meets the underlying needs of that visitor.
Doing this is very different to listing out features or attributes of your stuff. Although these might be important to display somewhere, more focus needs to be placed on how that stuff improves the lives of your visitors. This is the difference between, for example, telling a visitor that your homemade photo frames have adhesive backing and telling them that your frames can be used without having to drill any holes in their walls.
2. GET TO KNOW YOUR VISITOR
There are a wide range of design decisions that can be better made once you have a clear understanding of who your visitor is and what they are trying to achieve.
For example, your navigation hierarchy and main navigation bar should be informed by the missions your visitors are on, the reasons they've come to your site and their overall goals and jobs. Content should be written at an appropriate technical level for your visitor to understand, and using a tone of voice that is likely to resonate with them. Prioritising accessibility improvements becomes easier once you know which groups of visitors need more help and the type of help they require.
There are a couple of easy ways you can learn more about your visitors. Google Analytics can tell you who they are, how they're using your site and even the search terms they used to find you (which can be very enlightening). Feedback surveys can also be used to ask visitors directly what is important to them and what they're looking to achieve.
However you go about it, just remember that you don't just have one type of visitor. It is tempting to think of your visitor in terms of their most common persona (for example a 45 year-old woman with older children), but this can force your design focus too narrow. Instead, identify the most common four to five types of visitors and try and design so that all of their needs are accounted for.
3. PRIORITISE SPEED AND EASE
Both speed and ease are core aspects of good website design. This is unsurprising as if your visitor can't work out how to do something then you're forcing them to decide whether to persevere or give up (many give up). If your site is slow to load (taking more than just a couple of seconds), or if the process you're asking your visitors to follow is lengthy, then you’re further testing their patience.
Every part of your site should attempt to be as quick and easy for the visitor as possible, but in particular:
The homepage - can the visitor quickly see what it is you do and where they should go to learn more?
Navigation - is the visitor able to get to where they want in only a few clicks, and are they only asked to make simple navigation decisions?
The checkout - can visitors get through this process without having to give too much personal information, and are the forms easy to complete?
Content - can the visitor quickly find the key pieces that will benefit them, and is it quick and easy to consume?
As a designer, it can be difficult to assess the speed and simplicity of some of these parts of your site because you are far too close to the design of it and you know exactly how it works. Instead, ask a friend or colleague (or anyone who might be unfamiliar with the intricacies of your site) to test it out and watch how they navigate. Look for hesitation, confusion and mistakes, note where this is occurring and make improvements in those areas.
4. WHEN IN DOUBT, STICK TO CONVENTIONS
Luckily, there are hundreds of millions of websites on the internet, of which many will have been forced to make similar decisions to you, and these can be looked to for inspiration or guidance.
In fact, it is sensible to proactively look at how similar websites to yours have been designed. Visitors have typically visited tens of thousands of different websites and they have learned certain things about how they tend to work - for example where to find search bars, main navigation bars or contact details. Think about a supermarket - you can visit one you've never been to before and can, typically, navigate it quite easily because supermarkets are designed in a similar way to other supermarkets.
All of this means that, whilst of course you should be looking to make your site unique to you and improve things you think don't work elsewhere, it's rarely desirable to completely reinvent the wheel. Doing so forces visitors out of the autopilot browsing mode that they'd prefer to be using, and into a conscious and more effortful decision-making mode. This creates friction in the experience and frustrates the visitor.
5. ENSURE YOUR VISUAL DESIGN IS 'GOOD ENOUGH' AND THEN FOCUS YOUR ATTENTION ELSEWHERE
A website’s look and feel tends to get a large share of total design time for a few reasons. Firstly, we want to be proud of what we’ve created and having a great looking site is one indication that we’ve done a good job. Secondly, deciding how the site is going to look, picking colours, fonts and sourcing images is pretty enjoyable - much more so than having to think hard about navigational hierarchies or form design. Finally, website builders make this job pretty easy - giving us a wide range of beautiful looking templates - and we humans tend to gravitate towards things that are easy.
Having a bad-looking site sends lots of subconscious signals to your visitor and encourages them to believe you are unprofessional or won’t be able to help them on their mission. You don’t want this, and so you need to design something that doesn’t send these negative signals. However, the impact that the most beautifully immaculate design can have is likely to be less pronounced. Some visitors might immediately make up their minds to buy from you based on you having a great-looking site alone, but most are still going to need to evaluate what you have to say and how you say it.
Therefore, the recommendation is to get your design to a point where it is neat and tidy and unlikely to put visitors off, but once this point is reached spend time in other areas. Remember; a good-looking site is not the same as an effective one, and making the visitor’s life easy or finely honing your key messages is going to be a better use of your time than obsessing over tiny visual design decisions.
6. MAKE THE BEST USE OF THE LIMITED SPACE YOU HAVE
All websites have a limit on what they can communicate to the visitor. This isn’t because of physical limitations - you can technically have an infinitely long website if you wish - but because of limitations in your visitors’ attention spans and available time.
Someone coming to your website does not want to spend an infinite amount of time reading through it. In fact, they mostly want to spend as little time as they can until they get what they need from you - be that information, entertainment or a product or service. To do this they need to be able to find key parts of your site quickly, which has several large implications:
You should be questioning the value of every bit of content you add to your site. The larger your site is, and the more content you have, the harder it is for someone to find what they are looking for. As such, although there is often the temptation to add more and more content, unless your website is a content hub this isn’t always desirable. Remember; everything you add to your site needs to have a clear purpose, and ideally a visitor benefit.
You should be carefully considering the ordering of every page. Your most impactful and important content should come at the top of the page, increasing its chances of being found. Imagine your visitor was unable to scroll on a particular page - would they still see your key messages? If not then you should consider redesigning that page.
You should actively be looking for ways to scale your site back. This is challenging because we find it hard to get rid of something we have invested time into making. However, if a piece of content isn’t adding any value or benefit to the visitor, it could well be having a negative impact by preventing more beneficial content from being found. Don’t be afraid to remove something that doesn’t play a role on your site. Doing so will increase the average importance of everything that remains, leading to a tighter, more impactful website.
7. PLAN AHEAD BEFORE YOU START TO BUILD
When building a website, it is often tempting to get stuck in without giving much thought to the direction your design should take or how the finished site might look. Doing so almost always leads to a less effective website, and often means you have to spend time re-doing or optimising parts of your site’s design.
Planning ahead is of specific importance in three areas.
The first area is navigation. Your navigational hierarchy and main navigation bar should be designed with a full understanding of the content you are likely to provide and the missions your visitors are on. This allows you to build a logical structure that supports the most common missions, and makes your most important content easier to find. For sites with simple hierarchies, making changes further down the road is not a big issue. For more complex sites, with multiple navigational levels, it can be a lot trickier and could mean making time-consuming changes on lots of different pages.
The second area is mobile design. Given the importance of mobile visitation (around half of all visits are now on mobile), you should be actively considering the experience of visitors on those smaller devices. However, the degree to which you can customise your mobile site is dependent on who your website provider is. Some providers allow you to make changes to your mobile website independently of your non-mobile version. Others simply translate your non-mobile site into a mobile-friendly version, making mobile design quite a lot harder. This leads many to adopt a philosophy called ‘mobile first design’ - the idea that your design should be driven by considering what will work for mobile, and then scaling that up to arrive at the non-mobile version.
The third area where planning is particularly important is accessibility. As you may have read in the earlier guide, this is a complex topic that is best tackled through making continual iterative improvements to your site. However, to set off on the right foot you should consider whether your website is likely to have any significantly important visitor groups who are likely to need more help, and design for them from the start.
To give you a slightly hyperbolic example; if you ran a site selling products to improve the lives of people with visual impairment, then many of your visitors are, unsurprisingly, going to have visual impairments. This would mean you would need to design a site that uses large text, uses colours that strongly contrast against each other and one that effectively supports screen readers.
8. INVEST TIME INTO OPTIMISING EVERY PIECE OF CONTENT ON YOUR SITE
When you hear the word ‘content’, it is only natural if your mind jumps to news articles, blogs, opinion pieces or video. However, almost everything on your site is content - whether that is product information, a list of areas of the country your company services or help pages and FAQs.
Every piece of content on your site deserves the same level of scrutiny to ensure it is working effectively and delivering a visitor benefit. Achieving this requires consideration of lots of different things such as the language and tone of voice used, its succinctness and how accessible it is to the visitor who will be consuming it. Investing time to ensure each piece of content is optimised means the visitor will have a better, more consistent experience on your site. It will also prevent your most impactful messages from being undermined by weaker content that has not enjoyed the same level of finesse and attention.
9. TEST, TEST AND TEST AGAIN
It is highly unlikely that you haven’t spent any time testing your website. You will have seen your website previewed when you’ve been building it, and you’ve likely accessed it directly through your browser. However, lots of different devices and browsers exist and they all read and display your website slightly differently. Different visitor groups, with differing physical and mental abilities, are likely to visit your site and will experience it in different ways.
As such, your testing needs to be comprehensive and reflective of the fact that your site is visited in different ways by different people. Automated testing can aid this process, but you also need to spend time manually testing your site using different browsers and devices, and by simulating the experience that certain visitor groups are likely to have.
Once you uncover an issue: fix it and re-test. Do this enough times and you’ll turn what might seem like a list of relatively minor improvements into a significantly improved experience for your visitors.
10. BE CAREFUL WHEN CHOOSING FINANCIAL BENEFIT OVER THE VISITOR EXPERIENCE
There are a number of activities you can undertake that deliver a financial benefit to your site, such as adding adverts, adding pop-ups or leveraging physiological tricks and techniques to improve your conversion rate. Many of these activities might be required for your website to be successful, but they almost all damage the visitor experience.
I’m not going to advise that you avoid taking steps to improve your website’s chances of success, but there are two things you should be doing when you’re forced to make a trade-off between financial benefit and the visitor experience:
Assess how significant the damage to the visitor experience might be as a result of any activity. Will it be so impactful that you are likely to gradually lose visitors by reducing their chance of revisiting? You should always consider the long-term health of your site, and carefully consider whether any short-term gains are really worth it.
Consider whether you can achieve the same or similar benefit in a way that is less damaging to the visitor experience. For example, can you give adverts slightly less prominence or only show them on certain pages? Can pop-ups be used less frequently or be less prominent when they trigger?
At the end of the day, your visitors typically have lots of different choices as to where to visit and take their custom. If you treat them badly or put your success over their experience too often, then eventually this will catch up to you.
Alternatively, if you can give your visitors a smooth and frictionless experience, and enable them to quickly and painlessly complete their missions and achieve their jobs, then financial success is almost guaranteed to follow.