Font pairing is an under-rated means to gain user attention. If a user’s average attention span on the web is just a little over 8 seconds, marketers are seriously pressed for time.
We all know font combinations make or break the intensity of the message we are about to communicate. Designers and design critiques alike simply love to discuss the importance of correct pairing which brings us to the choice of font families. Is it ok to use fonts from the same family or can we add more variety from contrasting font families? Learn how corporate font pairing works?
The amount of fonts to throw into a mix is entirely up to the designer or curator, but let’s not forget: font like humans have personality and their attributes are a means to provide language and meaning to visual communication.
When too many fonts with a strong personality are clustered together, the audience witnesses a clash that is hard to describe in words, but can only be felt visually. More than one strong font creates an awkward clash and fails to communicate the message within. In the real world, there are no straightforward rules to determine a specific type of font you should or should not use on a page layout. What really adds clarity and visibility is the use of multiple variants and weights which is achieved by adding the best of both worlds i.e. serif and sans serif.
Decide The Nature Of The Content
Consider the layout before filling the content. Is the content going to be a plain article or an e-book? Or perhaps a magazine that needs block quotes and multiple sub-headings? The bottom line is when you are using multiple fonts together, the role of each font must be properly defined in the text. To keep things simple, the option of few font pairs’ selection is given as a rule of thumb.
Moods Of Font Pairs
When we fail to understand the inherent mood of a font, then it has more chances of getting used in a wrong place. You can choose a wrong typeface for a job and get away with it, but when paired with the wrong font, it becomes a criminal offense. Consider the font ‘Alpha Slab One’ that appears sturdy and a font built to represent titles. If this thick font is used in the body instead, will it be legible? Less kerning would ruin the show, whereas more kerning will appear plain ugly. However when Alpha Slab is paired with Mako in the body text, then it makes a good combination.
Here’s what Mitchell Gumbley (Creative Consultant) has to say about font pairing conflict.
The two things to consider are ‘contrast & compliment’ — that is, do your choices have some stand-out from each other (and therefore fit-for-purpose) and, are they aesthetically harmonious (rather than creating an uncomfortable ‘jarring’ or clash)?
As always, beauty is in the eye of the beholder, and is such a subjective thing, but we should’t even be in the business of choosing typefaces for communication messages if we don’t have the basic sensitivities requisite for the role. – Mitchell Gumbley
Achieve Contrast Not Conflict
If a heading and a sub-heading were to share the same font, would you be able to tell the difference? Of course not! Or when the font pairs are conflicting with each other’s roles, the reader would be puzzled and will switch to his judgment rather than logic. This will be a complete disaster and I can quote from experience that sometimes good content is rendered ineffective when presented in conflicting fonts. Ideally a workable type contrast must have these features:
Fonts of different styles are often seen to complement each other. For instance, a mono-space font compliments the text in Slab serif and so on. You can find different styles of a typeface while exploring the typeface on any font resource site.
Visual Hierarchy or the order in which text is placed is often established by varying the weights of fonts. If the text in some places looks heavier, it is automatically highlighted from the rest. Sometimes by increasing the kerning space, the impact of the content is lowered but the visibility or attention span is extended.
If I were to discuss the color preferences for fonts, it might consume the whole day but right now let’s just restrict it to the fact that the choice of colors can easily make two fonts complement each other.
Form is the primary aspect of lettering that takes into account the proportions of a typeface. Majority of the audience unconsciously compares the relative length of the descenders or notices the curvature of letters. This is probably why we consider the decorative serif fonts for headings and sans serif for the body. The font choice that goes the other way round is usually rare.
Here’s how Larry Miller sums it up
My basic rules which can be subdivided and resubdivided by experts and…
Do not mix more-or-less similar faces
such as Galliard and Caslon
such as Helvetica and Univers.
I find that like mixing mayonnaise and (ugh!) sour cream.
Maybe try Galliard and Futura different weights.
One of endless examples.
If you are very tired, and on deadline extension, go with those that always work
such as Franklin Gothic for subheads and almost any serif face for body copy. – Larry Miller
Some of the most groundbreaking designs have achieved this status quo because they were legible which goes on to prove that the designer had an eye for font pairing. Honestly, there are no set of rules for what might work but we can always list down what might never work.
Join the discussion on rules for font pairing in The Typography Network