Choosing the Right Typeface
When you only had ten fonts, choosing one from this list was easy. Now that you have dozens of Web safe fonts and can link to any font that is licensed for Web downloading, your horizons are much broader. This new power, though, comes with the responsibility of having to be thoughtful in your choices. The exact type you choose should depend on several factors.
What is the font’s voice?
My perceptions of a few fonts. What’s your reaction to these fonts?
Establish a typographic voice
Choose your typeface to reflect the mood and demeanor of the message your Web site is conveying. If the site is meant to be upbeat and happy, choose fonts with a playful look. If the site is meant to be professional and serious, choose clean, simple fonts.
I once worked with a writer who published a daily advice column. She insisted, despite my protests, on publishing her column in Comic Sans MS, a font that is generally ridiculed by typographers. I quickly realized that this font “spoke” to her audience in a relaxed, informal tone that no other available font could have achieved. She was actually using the typeface to better communicate her message.
We now have a wide selection of fonts to choose from, so choose those that best serve the content’s message. It’s important that you define the voice you are trying to achieve, and then choose typefaces accordingly.
Use the right fonts in the right places
With ready access to more than just a handful of fonts, it is tempting to use more than we need. If we aren’t careful, we will see an explosion of bad typography. Something similar happened early in Web design. Designers, used to the color limitations in print, went a little overboard when they could use any and all colors in a single design. It is important with Web typography, as with any design, always to have a purpose for your typeface choices.
What is this book’s typographic voice?
My perceptions of the fonts I chose for this book.
In this book, for example, I wanted to create a balance between the past and the future. All body copy is set in the Perpetua font family, which is also a Web safe font. Titles and auxiliary content—such as captions and sidebars—are set in the sans-serif typeface Museo, a free font you can use with @font-linking in a Web page. I chose these fonts because not only do they look good together—contrasting serif and sans serif—but I also wanted to put my money where my mouth is by using typefaces that can be set both in print and in Web sites. The one typeface exception I made was for text used to display computer code, which is traditionally monospace, so I used Consolas.
If you are new to typography or design, limit yourself to a single font, leveraging its weights and styles and varying colors to create contrast.