5 Typography

 

This chapter covers

  • Some basic vocabulary of typography
  • Optimizing your type choices for readability
  • Using typography to set the tone of your designs
  • Establishing a hierarchy of importance using typography
  • Choosing inclusive fonts

Back in the day when desktop publishing was a thing (and it happened to be a thing that I quite enjoyed at the time), I remember when Microsoft Publisher would suggest pairs of sometimes very different-looking fonts that went nicely together, with one to be used for headings and the other for body text. These font schemes, as they were called, felt as enigmatic to me as suggested color palettes did—where did they come from? How could someone know which fonts would pair well and which wouldn’t? Font pairing, like wine pairing or chocolate pairing, is a skill that requires practice, and you have to start with a firm foundation in the basics.

In this chapter, we’ll learn some basic vocabulary about typography, and then we’ll learn how to make sure our text is as readable as possible. After that, we’ll talk about how different fonts set different tones, how we can use type to subliminally communicate a hierarchy of importance, and finally, how we can be inclusive in our typographic choices. [cracks knuckles] Ok, let’s go!

5.1 Some basic vocabulary of typography

5.1.1 Character

5.1.2 Typeface vs. font

5.1.3 Serif vs. sans serif

5.1.4 Weight

5.1.5 Italics

5.1.6 Font size

5.1.7 X-height

5.2 Optimizing for readability

5.2.1 Small font sizes

5.2.2 Lining, tabular, and uniwidth numbers

5.2.3 Limit the number of fonts

5.3 How type sets the tone

5.4 Communicating a hierarchy with type

5.4.1 Color