How to Harness the Subtle Powers of Typography

Try to think of the most attractive website you’ve recently visited. Now, try to recall the characteristics that made it so appealing. Perhaps it’s the content, or maybe it’s the stunning photography. Whatever your reason, it’s likely that typography has in some way influenced your opinion.

Words can harness the artistic power of thought, and typography provides the visual component to this art. Typography is the process of displaying and setting different typefaces, and it plays an important role in WordPress website design.

Font selection and style can create personality, change connotation, and set the mood for your website or blog. It can even cultivate brand recognition, by becoming one of your company’s defining attributes—think Coca Cola, Google, and Facebook. A font can be as vocal as the words themselves.

Selecting a typography for your website can be a mystifying and (potentially) complex process. With a seemingly endless amount of different fonts to choose from, you must maintain a degree of objectivity, patience, and intent.

So before you jump into selecting a typography for your WordPress site, here are some things to keep in mind to help make it a fun and easy process.

Serif and Sans Serif

Distinguishing whether you should select a Serif or Sans Serif typeface can be difficult, but it’s the most fundamental (and arguably most important) part of selecting a typography for your website.

First, you should understand the difference between Serif and Sans Serif.

Quite simply, Serif typefaces can be defined by the small lines tailing from the text. Conversely,  Sans Serif literally means without Serif (or without tailing lines). Both can be very useful, but for different uses.

Serif 

The signature tailing lines make Serif fonts very distinctive, creating a horizontal guide for reading. While their use is advisable for text that requires increased readability—their need for high resolution make this viable for printed text only. However, Serif fonts can be considered for online use when the size is larger. So, if you’re deciding on a header, title, and more—Serif fonts might be the right fit for you.

If you’re dead set on a Serif font for the main content on your blog or website, just make sure that the style fits the message. Serif fonts create a more traditional, book-like vibe. It’s likely that if you’re flipping through a novel or a magazine that the main content will be written in a Serif typeface. Among the most popular Serif fonts are Times New Romans, Adobe Garamond, Rockwell, and Bodoni.

Sans Serif

This type of font appears modern and sleek—and it’s the most common font type used across the internet. It’s the simplistic forms of Sans Serif fonts that make them easily identifiable ( and preferable) on the screen.

Consider this: Printed text typically has a resolution of at least 1,000 dots per inch; whereas, computers only offer around 100 per inch—with even the most advanced displays only reaching around 300 dots per inch.  This is why the distinctive Serif fonts are better for printed text, while the straight-shaped Sans Serif fonts are preferable online.

Differentiating where to use Serif v. Sans Serif can be as easily understood by this simple rule: Use Serif for printed work and Sans Serif for online work.

Alternatively, it can be more complex and vary depending on the tone, style, and intent of your website (Maybe you like the look of Serif fonts and don’t care if they’re difficult to read).

Degrees of Readability

Readability is probably the most important element to keep in mind when selecting a typography.

You should select a font based on the function of the words. If the ability to quickly read and understand content is essential for your website, then you should consider a font with increased legibility. Alternatively, if the text is merely decorative then a more elaborate font may be appropriate—even if the legibility is poor.

This point may seem pretty basic but I assure you that it’s very important. Just imagine if The New York Times printed stories in Lucida Blackletter:

Not only is the readability low, but the font sends an entirely different message. 

To ensure readability, you should also be mindful of the size and color used to “style” the font.  If your font is yellow and your background is white, the visibility of your content will be compromised.

Keep in mind that there are several other components that should be considered to ensure optimum readability—tracking and kerning, for example.

Setting the Mood

Typography can help set the tone for your entire website. For that reason, your selection should reflect the personality of your company. If the font isn’t a cultural fit, it could misrepresent your company, or worse—deter your audience.

For example, notice how the government website uses a simple and clean typography. Take note of the conservative colors and practical pairing of Serif and Sans Serif fonts.