DIY Design School #25

 

How to Choose Fonts That Go Well Together

 

Hey, {{ subscriber.firstName | default('DIY Designer') }}!

It's been a while since we talked about one of the key parts of your brand identity and a topic I love - fonts! And in particular, choosing fonts that go well together to make a great font system.

Fonts can be a tricky one to navigate as there are so many available, so many styles you can choose and so many options for how to use them. It can really get overwhelming! I'd love to help you figure out how to pair fonts really well so you can create an on-brand, easy to use and read font system for your website and any other brand materials.

 

Let's get into the fonts...

 

SOME RULES FOR CHOOSING FONTS

Let's start with the basics...

 

THINK ABOUT YOUR BRAND

As with everything else we create, our font system has to be fitting with our brand sweet spot and everything else we create for our brand. Having a good, on-brand font system can be the difference between your branded elements looking off-key and them pushing your brand identity to the next level and making your brand recognisable from all angles.

 

Different font styles fit different brand values and design styles so keeping your brand in mind and double checking that every font you consider fits perfectly with your business will be the key to making sure your font system is a continuation of your brand identity.

 

READABILITY

The main purpose of our type is to make sure it is easy to read for everyone. With every font that you find or consider using, try it out in a few different sentence structures and paragraphs to make sure it is easily digestible in any format.

 

Also in this category would be choosing the correct sizes for each font style. With paragraphs, you want the font to be large enough to read but not so large that it distorts the page and looks a bit silly. With titles, you need to set a hierarchy so your main headings are larger, subtitles smaller and then paragraphs smaller than that.

 

HIERARCHY

Your hierarchy determines which parts of your content are more important than others and in which order you should read. This is so important to make sure your text doesn't all merge into one and ignore the above - readability.

 

You want 1-2 Heading fonts for a heading and subheading, a paragraph font for the bulk of your text and then possibly a feature font for little text-based flourishes to add some interest.

 

LESS IS MORE

Again, along with any other design principle, keep it simple and less is more. If you’ve ever been on a website that uses even one too many fonts, you’ll know that it starts to look messy and not easy on the eye. It’s very easy to go overboard with fonts because there are so many nice ones, but this is why we create a font system to pull together and follow to keep everything cohesive.

 

THE BEST WAYS TO PAIR YOUR FONTS

With some examples along the way...

 

ALL SERIF OR SANS-SERIF

One way to create a minimal, easy to pair font system is by using either serif fonts or sans-serif fonts. Sticking to one or the other makes it easier to show a specific mood and brand throughout your fonts and also to find fonts which go together. Make sure you pick fonts which are a similar style and mix up the weights and sizes to create your hierarchy.

MIXED SERIF AND SANS-SERIF

Another way you can be on to a quick winner is by combining a serif font with a sans-serif font, which straight away creates some contrast, balance and interest with your font system. Again, stick to fonts which are a similar style and fit together to make sure they will fit with your brand and create the right mood.

CONTRASTING STYLES

A great way to add a little personality and stand out, is to create a font system with some contrasting styles. Choose a bold, display font for your heading and then an opposite style for your paragraphs. The best way to keep this not going over the top is by using the same bold style for your headings and subheadings but in different weights or spacing.

USE THE SAME FAMILY

You may have seen throughout these font systems that I've often used the same family of font more than once, usually for headings and subheadings. This is another great way to ensure everything will pair together and show a more minimal look. Mix up the weights, spacing, size and try using uppercase or italics for some headings to bring some contrast.

BALANCE THE STYLES

The key for a great font system is perfecting balance. You want a good balance of different weights, you want the sizing to be well judged and you want your hierarchy to be really clear. Use your eye to judge whether your system is well balance and adjust the sizing or anything else you need to to make sure you achieve this balance.

All the fonts above are available on Google Fonts!

 

THIS WEEK'S ACTION TIP!

Did I mention you have homework?

 

CHECK IN ON YOUR FONT SYSTEM

 

Nothing too intense this week as I'm sure you already have a font system in place! But I just want you to read through the points above and check in with your own fonts to make sure they are balanced, contrasting, fitting your brand and stick with a hierarchy.

 

Once you've done this, a great way to make sure you stick with your font system is to create a brand style guide page on your website! Follow this past newsletter to find out how.

 

And that's all for this week! Need a hand with your font system or need a little feedback? Drop me a reply to this message and I'm always on hand to offer help or some tips! :)

Cat

 
 

FOLLOW ALONG WITH ME ON INSTAGRAM

 
f-twitter
f-instagram
f-pinterest