10 Mistakes in Elearning Design: Using More Than Two Fonts

Love fonts? Who doesn’t! Fonts are a wonderful way to add personality, or to zhush up a boring design! But there is an old rule in design: you have to know the rules in order to know when you can break them.

So let’s talk about fonts: the rule is to stick to just two. Yes, just two in any given design! And those two fonts should complement each other, working well as a team.

This is the fifth post in my series, 10 Mistakes in Elearning Design.

Here’s what we’ve already covered:

• Mistake #1: Redundant Navigation
• Mistake #2: Inconsistent Navigation
• Mistake #3: Is This Interactive?
• Mistake #4: Color and Contrast

Now, font choice is another frequently found problem with visual design: let’s dive into fonts!

Mistake #5: More Than Two Fonts

Let’s take a look at this original design. How many fonts do you see?

• Introduction to Hiking – that’s one!
• Yosemite National Park – that’s two!
• California – three!
• Begin – four! Total of four fonts.

This design isn’t necessarily egregious (until you actually sit and count up all the fonts) but just looking at this title slide it’s probably clear that something is not right.

Excessive font usage can lead to a feeling of busy-ness and clutter, a certain dishevelment. While many fonts used together do exude a certain exuberance, they also lend the feel of this being an amateur work.

Furthermore, when excessive fonts are used, it can be difficult to know where to look at a slide as there is always another design choice pulling on the eye.

Now, let’s look at the Redesign.

This slide has been redone so that it has just two fonts:

• Font 1: Introduction to Hiking, California
• Font 2: Yosemite National Park, Begin

Is it a perfect slide? No. In fact, there is one more thing here that needs fixing to make it a better visual design (can you guess what it is? It’ll be listed as our next mistake in this series).

But this slide now feels a little calmer and has a little better visual hierarchy. The title is clearer, and the button text ties in with the title text.

These two fonts also work well together. I chose them based on the recommendation of this font pairing guide, which contains tons of suggestions for pairing fonts that are available free online.

Takeaways

• Use a maximum of TWO fonts for any project!
• Refer to a font pairing guide to choose

Next Time

We’ll see this slide again and we’ll fix something else that’s making it feel wonky! Any guesses?