Type Genius: the joys of font-pairing

Tweet

I'm a little bit obsessed with nice fonts - I love how they can impact on design and help tell your story. An aspect of design which is often undervalued is the combinations of fonts: pairing up fonts (or sometimes mixing groups of three fonts, ideally not more than three in one design) for posters, or social media campaigns, or PowerPoint presentations.

I've just found a great site called Type Genius that helps out with choosing fonts, more on which below.

Here are four font combinations I like, three of which I've used, and all the fonts for which can be downloaded individually from Fontsquirrel:

BEBAS NUEUE AND MONTSERRAT

The first combination is what is used for the blog and much of the rest of site. The blog title is Bebas Nueue and the body text is Monstserrat. (Whenever I use Heading 2 in the formatting that's also Montserrat, but in all-caps - the Heading 3 used in this post os back to Bebas Nueue again). I chose them mainly because when I rejigged the design of the site recently I wanted a thicker body text font, so chose Montserrat which I've been using since I saw Matthew Reidsma use it for his UXLibs I keynote. Bebas compliments it for titles because it a tall and narrow font in contrast with Montserrat being thick and more rounded.

LATO AND ROBOTO SLAB

The second combination I've not used at the time of writing, but got from Type Genius - which you can find at typegenius.com. You tell it what font you want to use, and it gives you a number of potential companions to pair with it (as it happens when you put in Montserrat it suggests Bebas Nueue, as used on this site).

In the case of Lato and Roboto Slab, I've actually not used the Regular Lato in the example above at all - I used Lato Thin for the first part and Lato Heavy for 'titles'. I do like the contrast of light and heavy.

RALEWAY AND... RALEWAY

Which brings us to the third combination, which isn't technically a pair as it's just Raleway used in three different ways. I love Raleway beyond all other fonts. As long as you have both Raleway Regular and Raleway Bold installed (although PowerPoint will try and Bold non-standard fonts when you highlight them and click the Bold button, it's not the same as actually installing the Bold version that the typographers intended) they work so beautifully together, especially in all caps. The intro to UX presentation I blogged about recently used Raleway in all possible combinations (Regular and Bold in both lower and upper case) with no other fonts involved:

What is UX and how can it help your organisation? from Ned Potter

The other joy of Raleway is it renders perfectly on Slideshare. Some other fonts, even when you save and upload your presentations as a PDF, go a bit blocky on Slideshare, for example my LIANZA Marketing Manifesto slides, which use Raleway along with ChunkFive Roman - the latter looked great at the conference but not so good on Slideshare, but Raleway was perfect in both situations.

MATHLETE BULKY AND CAVIAR DREAMS

I used this combination for my Tuning Out The White Noise presentation which became the most popular thing I've ever put on Slideshare (despite Mathlete Bulky not rendering properely on the site) and I use it in some of my training materials, so I've become slightly bored with it due to over-exposure! I also over-used Mathlete and have since changed it round so it gets much less use in my slides, because it's a little too quirky for any kind of long-term reading. I like the way it looks but usability has to come first.

Further reading

For more info and guidance on font-pairing, check out this article from CreativeBloq, and Canva's Ultimate Guide to font-pairing.

If you have a particular pairing you'd recommend I'd love to hear it in a comment below.

Presentation Tools 1: Fontsquirrel

Tweet

I love a good presentation. I think they're often the best way to communicate information, and I create them as stand-alone online objects as well as for actual talks to an audience. So it's Presentation Tools Week on the blog - seven different useful tools from the list below, explored over the next five days.

These fall into two broad categories: tools for creating presentations from scratch, and tools for making PowerPoint presentations better in some way

When I began giving presentations 5 years ago, I remember looking at Bobbi Newman's, Buffy Hamilton's and Helene Blowers' Slideshare accounts and being amazed that slides could look so beautiful. My horizons were truly expanded; previously every PPT I'd seen had been functional, boring, and (as I later learned) ineffective as a communication method. I learned by trying to expose my brain to as many great ways of putting together a PowerPoint presentation as possible, and trying things out to see what worked for me.

These days things are a lot easier, as there are several helpful tools which assist you in creating effective and pretty slides. Some of them do a lot of the work for you, and some of you provide a helping hand for specific elements of a presentation. I've summarised the 7 tools I think Past Me would have found most useful. Hopefully if you're reading this you can take something from one or more of these platforms too.

Tomorrow we'll look at an alternative to PowerPoint, but for now we'll look at working with it, using non-standard fonts. It took me a long time to realise just how important fonts were to a good presentation.

FONTSQUIRREL (fontsquirrel.com)

FontSquirrel is a website full of downloadable fonts, and I use it ALL the time - it's the first port of call for non-standard fonts. I think using new fonts which we're not all over-saturated with from the Office suite can make a HUGE difference to how good a presentation or poster looks, and everything on FontSquirrel is free even for commercial use.

Examples from FontSquirrel

I use Megalopolis Extra in loads of presentations, along with Aller, Caviar Dreams, ChunkFive Roman, Quicksand Book, and Pacifico. You need admin permissions to install fonts on your PC, so if you can't have that permanently at work, try and get it for a couple of hours, go onto FontSquirrel, and go mad downloading interesting fonts. Once you install them they install across the Office Suite, so you can use them in Word as well. Try it!

(NB: An alternative to FontSquirrel is DaFont, which I've heard people recommend, but I can't vouch for it as I've never used it myself.)

Remember to save your PPT as a PDF when using non-standard fonts! Otherwise when you come to present on a different PC without the fonts installed, it will almost certainly go horribly wrong.

Some guidance around fonts - generally it is thought that you should use a maximum of 3 fonts per presentation (although as with all 'rules' around presenting, feel free to break this one if you have a good reason), and my personal minimum font size is 36 for slides.

Font-pairing is an art I feel like I've not mastered at all, but would like to - I found the following (albeit very brief) presentation helpful:

The Ultimate Guide to Font Pairing from Guy Kawasaki