On Web Typography

Author photoby Jason Santa Maria

How type works

There are no rules in typography.

This is the hardest fact for people to grapple with when they try to familiarize themselves with the rules, because there aren't any. We have principles, best practices, and methods that work most of the time, but nothing that works all of the time. We can do our best to ensure that something is durable: good-sized type for reading, plenty of whitespace, pleasing typefaces, and visual appeal, but we can't account for all environments and devices, which are often in flux. Learning typography is about figuring out what choices work best for each situation.

Whether we're the designers or the readers, we're all part of the audience for those choices. From the moment we wake up to the time we go to bed, we're bombarded by type: newspapers and magazines, signs on subways and freeways, emails and websites, the myriad interfaces and labels adorning everything we touch. We're exposed to more type each day than at any other point in history. Type is pervasive—and thus so is typography—yet bad typography remains. Why?

Put plainly, good typography is hard. And the sheer number of options we have can feel overwhelming.

For one, more typefaces exist than any one person could use in a lifetime. Typeface families themselves are enormously intricate, some containing thousands of glyphs, and each of them containing many small details. Filtering through the options is a Sisyphean task. You also have to consider the elements of composition. Things like size, spacing, color, and tone all affect the reading experience.

The bulk of typography, if done well, isn't supposed to be noticed. Unlike a painting, song, or other creative output, type is a means, not an end. It's often said that good typography is invisible. Readers may only snap to the realization of the presence of type when they struggle with understanding what it's trying to convey. Namely: when typography fails.

When it comes to designing for the screen, we have even more considerations, from new devices with new screen resolutions every month, to techniques like responsive web design, let alone the constant temptation for visitors to click away from your site. With all these elements on the table, it's no wonder that many people find the prospect of using type a bit daunting.

But by creating websites, we assume the role of communicators. Whether you are a designer, writer, developer, or anyone contributing to a site, your work is connected to communication. Luckily, we have history on our side—many approaches to typography from centuries' worth of print design hold up on the web. We can stand on the shoulders of those who came before us. But first, let's dig deeper into typography's purpose.

Why typography matters

Whether online, in print, or on the side of a spaceship, typography is the primary vehicle we use as designers to communicate our message. When we get it right, it's powerful. And to do it well, we need to strike the balance between beauty and utility—and then disappear into the night.

Typography is one of your greatest design assets. It's not visual decoration or something that gets added at the end to spice up a design. Good typography gives spirit to words and is a potent mechanism to inform and delight.

It doesn't matter how well-considered your layout is, how wonderful your website's interactions, code, colors, imagery, or writing are. If your type is bad, the design fails.

Typography is communication

Most of the communicative heavy-lifting in our designs hinges on text. And because we're inundated with things asking for our attention, our typography needs to put its best foot forward. That means setting our type to avoid getting in our readers' way, and nudging them to give us a moment of their busy day. Through our typography, we're often politely asking: “Will you look at this?” With the glut of information out there, that question becomes a tricky proposition. Most people are short on time. By not caring, by not attending to your typography, you might as well close the browser window for them.

Through type, we're able to communicate our message and play with the tone and tenor of the delivery. Just as different musicians perform the same song differently, we can take a variety of approaches to the way we deliver a message.

With that in mind, you want to equip yourself with the best tools you can find, so you have the best shot at someone saying, “Yes! I want to read this!” Well, they likely won't say it out loud, but if you get them to stick around for a little while, that's just as good. You want to grab people and pique their interest.