We all have our preferences when it comes to design. After all, we’ve spent our whole lives picking outfits, matching furniture and choosing paint colours.
But web design is a slightly different beast. After all, it’s not about your personal taste – it’s about reaching an audience and ensuring they respond well to your site.
Here are some design tips to ensure that your site catches the eye – for the right reasons.
Pass with flying colours
First impressions can mean the difference between a conversion and a bounce. Don’t let a poorly thought-out colour scheme send your potential customers running.
So what separates a well thought-out colour scheme from a bad one?
As always, your audience should be your main consideration. Different colour schemes will resonate with different user groups in different ways.
Factors that influence how receptive your audience is to a particular colour scheme include:
- The culture or background of your audience.
- The age and interests of your audience.
- The niche and context of your site.
As an example, the colour red is linked with prosperity and success in Chinese culture, and is often a key component in design aimed at this audience.
Meanwhile, a very young audience might be more receptive to brighter, high-contrast colours that suggest liveliness and youth.
Finally, a site targeting a luxury market might look towards more muted colours such as greyscale tones and golds.
Rolling with the colour wheel
If you’re not sure where to start, head over to Colour Matters or the Adobe Colour Site, both of which will give you plenty of solid tips for ensuring that your website doesn’t look as though it’s got dressed in the dark.
Typically, though, you’ll find that sites often follow one of these colour scheme approaches:
- Triadic – using three different colours evenly spaced around the colour wheel.
- Analogous – using colours that are next to each other on the colour wheel.
- Split complementary – using a base colour and the two colours next to the one that is the base colour’s complement.
Although we hear a lot about complementary colours in design, these can be a bad idea for web design, as they can result in difficult-to-read or jarring results.
Links and buttons shouldn’t play hide and seek
If your customer’s arrived on your site, chances are you want them to do something while they’re there. Perhaps it’s to click on a link, or to purchase something.
Whatever the goal, make it easy for your audience.
If you have a button that reflects your main call to action – for example, one that says “buy” – ensure that it’s easy to find and impossible to ignore.
Make sure that it:
- looks like a button
- contrasts with the page background
- is easily spotted on the page.
The colour of your button is key, and not just because you want to make sure it “pops” out from the page. You also want to ensure that its colour scheme doesn’t create dissonance for your customers.
For example, in computing, things that are greyed-out usually mean that you can’t proceed, so avoid potentially confusing people by using grey for your buttons. Green, on the other hand, can mean “go”. Similarly, web users are used to links being blue, so don’t confuse things by option for an unusual colour.
To assess the visibility of your buttons, play the optometrist for a moment and step away from your screen. Is your button easily spotted from a distance? If you need better than 20/20 vision to see it, you might want to address its size, design, or location on the page.
Simple is better
When it comes to fonts and typefaces, simple is better.
As exciting as it can be to scroll through the huge variety of available fonts and typekits, save the typographical experimentation for your kids’ school projects.
Using too many fonts, difficult-to-read fonts, or handwriting-style fonts can reduce your site’s accessibility, and can also lend an amateurish effect.
Strive for no more than 2 or 3 fonts for your site, and use fonts that are highly legible and that display well across all browsers and devices.
Show your fonts who’s boss with a font hierarchy
When getting your fonts in order, think about establishing a font hierarchy.
This might sound technical, but really it just means making sure that you’ve organised your information so that the most important things are easiest to find.
Think about how on a newspaper the main story gets the biggest headline, while smaller stories get smaller headlines. Each story might also have a bolded introduction that sums up the article that follows, while the article itself tends to be in small, non-bolded print.
All of these conventions are part of a newsprint hierarchy – and the same principles apply to web design.
Your hierarchy should incorporate things such as:
- Font size
- Font weight
- Font colour
- Font type (eg serif or sans serif).
If your brand has established fonts it tends to use, you’ll need to work within these parameters while adhering as best as you can to good design principles.
Good design makes for a good user experience
When it comes to site design, usability is key. Keep things simple, visible and intuitive, and try to make your visitors do as little work as possible in browsing your site. After all, you want them thinking about clicking buy, not about where to find the buy button.
- Sourcing free stock images for your site
- Our ultimate photo editor list
- Choosing the right theme and design for your brand