We were recently asked by a client to change one of two typefaces on a website design because ‘they didn’t match’. They were referring to contrasting typefaces, one being serif and the other sans serif – so, although they weren’t the same, they worked together nicely as a team. The point the client was making, we found, was that they preferred the same typeface (concordance) throughout. It was a subjective decision.
When you’re working on pairing typefaces, there are three types of relationships between fonts that you’ll need as a rough guide:
All of the type on your design is similar, typically used to refer to the use of a single typeface in multiple fonts on a page.
Two or more typefaces that are different but work well together.
Two typefaces which are too similar to one another to work nicely. The designer’s general rule is to try to achieve concordant or contrasting type, but avoid conflicting type.
Here’s a few examples.