There’s Brad and Angie, Carrie and Big, Marissa and Ryan, but in the eyes of a creative, there is no better pairing than Fonts and Colours. They have been together since the dawn of time, always complementing each other. A match made in design heaven.
We are living in a world where people are moved by looks first and function second. But what is it about a website that draws us in? Is it the colours? A clever headline written in an attractive font?
Alongside slow loading times and neon gifs, colours and typography are two of the most important elements that play a crucial role in determining the success and failure of a website. It is the combination of these elements, along with the brand imagery that creates the overall mood and personality of a website.
Okay, so fonts and colours are important. We know that. But the human eye can see millions of different hues and there are thousands of fonts out there to choose from. Narrowing the choices down seems like a daunting task that might just send us into an existential crisis, right?! Wrong. Let us fill in you in on a little secret, creating a moodboard is an effortless step when it comes to establishing the visual direction of your brand – so get Pinning. Here at First Flight we are total suckers for a good old Pinterest board. Search words that match your brand personality. Are you wanting to be fresh and clean? Rustic and moody? Bright and full of pop? Once you have figured that out, scroll until you couldn’t possibly bare to look at another perfectly paired text and colour combo. Now that you’ve collected a million and one images, go back through and make a cull of anything that looks slightly out of place. From here, I’d bet my bottom dollar that you have curated a concise and consistent theme that will make your colour and font choices a helluva lot easier.
Your target audience has less patience than the blink of an eye. You have to be able to grab their attention and hook them in. This is where typography hierarchy comes into play. You are ideally going to want three different levels of typography to work with. The first, being your headline – now this is going to be the head grabbing line, you want this to stand out so use a dynamic font and stronger aesthetic. The next is going to be a second tier heading, this will convey key information and hook them in and want them begging for more. Depending on the personality of your brand, you can keep this one big and eccentric or bold and simple. The third font is you basic copy. This is the font that everything else will be written in, so keep this one basic and timeless. Hierarchy is all about helping your most important information stand out visually and keep people wanting more.
Time to pull out that fundamental colour wheel, you know the one, you used to love them in primary school. Choosing colours for you web layout is a little more than choosing a couple hues and chucking them down in equal parts across your project. Colours can be paired and grouped in so many different combinations. Enter, the 60-30-10 rule – a simple way of creating a beautiful, balanced colour scheme for your site. Similar to the font hierarchy, you are going to want to take your colour selection and decide on a dominant hue. This is going to make up majority of the colour scheme, in this case, 60%. Your remaining colours are going to make up your accents, these bad boys are there to complement and balance out your dominant colour.
When it comes to visual communication, your brand’s combination of colour and font are powerful tools in attracting that oh-so-important attention of customers! Just remember you want them to be a direct reflection your overall brand personality – you’ve got this.