Condensed fonts: The good, the bad, the ugly

No one likes that too tight feeling of riding the metro or train with too many people at once. But that’s the same feeling you get when using a family of condensed or ultra-thin fonts on your website. (And that’s why you don’t see them all that commonly used.)

Condensed variations of most fonts should be used sparingly or avoided altogether in most design projects with blocks of text. Although there are a wide-range of excuses to use them there is a simple reason why you should not: Condensed fonts can be very hard to read.

What is a condensed font?

The letters of a condensed font have set-widths that are narrower than in the standard typeface from the same family. The term condensed font can also apply to fonts where each variation is much taller than it is wide. Often such fonts may have the words “condensed,” “narrow” or “compressed” in their names, although some fonts use numbers to represent character widths.

Some common condensed fonts include Bernard Condensed, Franklin Gothic Demi Condensed, Gill Sans Condensed and Liberation Sans Narrow.

Why would you use condensed fonts?

The primary reason many people choose a condensed font is to save space. Depending on the typeface, up to twice as much copy can be put in the same space using a narrower typeface.

Designers can also use a larger point size when working with condensed fonts but the larger size can be misleading. Letters will be taller but the difference between 10 and 12 points for a condensed font does not dramatically increase readability.

Condensed fonts also have a look and style of their own. Some narrower fonts may have a more modern or funky feel to them and might serve as a complementary design element. Used sparingly and for large type, such as a header, condensed fonts can be quite effective design tools.

Why condensed fonts should be avoided

As a general rule, condensed fonts do not lend themselves to readability. Back to that packed train, letters and line spacing are tight thus making blocks of text intimidating to look at and even harder to comprehend. Sites that have large blocks of text and rely on text blocks should not use a condensed font as the primary typeface because readability will be a concern.

Narrow fonts can also be hard to pair with other typefaces if not done carefully. A super-thin font next to a wide typeface can be jarring to read and can make a thin font appear even more condensed than it is.

Also think about the color scheme of your site. Many sites with scrolling text use black text on a white (or light colored) background. The contrast between dark and light can be difficult to read when working with closely spaced letters and thin line strokes. The contrast can even cause letters to blur when reading blocks of text or scrolling through multiple lines.

Condensed fonts also cause problems when it comes to color, especially in condensed fonts with thin strokes. Colors can take on a hue of their own and bleed from surrounding colors, appearing different in the type than in other elements on the page, such as colored boxes or images. The resulting effect can be jarring or force you to diverge from your overall color palette.

A few places where condensed fonts work

Although condensed fonts can be difficult to use effectively, they can work for certain elements of design.

A condensed font can add a lot of pop as a banner or when used with a few words in headers. This site and Designing Monsters featured above, for example, use a condensed typeface for headlines and headers. Note that few words are used in the condensed typeface and it is not used for the main copy on either site.

A narrow typeface also can make a great art element. When used less as a tool for reading and more for emphasis, narrow letters can provide impact and an element of sophistication. You also don’t need to worry about matching font families when working with words as art. Use the condensed typeface to create an image and choose typefaces for your site that stand on their own.

Finally, condensed fonts can be useful in tables and charts. Typically both use few words in each block of information. Using a condensed font may allow you to optimize space and keep your table or chart neat and organized. Keep in mind this works best for items with only a few words and you may consider using a larger point size to increase readability.

Alternatives to condensed fonts

Sometimes all you need to get away from a condensed font is a new way of looking at other typefaces.

If space is the reason you have turned to a condensed font, consider these alternatives: Typefaces with short descenders and ascenders or oval, rather than round, characters. Fonts with short g’s and h’s ill allow more lines of text in the same vertical space, keeping all other type specifications the same. Characters with a more ovular shape tend to be less wide than their circular counterparts and will allow for more letters per line.

Also think about letters with thinner strokes if you are looking for a lighter typeface. If you are using a condensed font with a heavy feel, such as a slab, try a typeface with a bolder, thicker stroke.

A few fonts to consider: Serifs Georgia, ITC Fenice Regular or Weidemann Book and sans serifs Trebuchet, Myriad, Helvetica or Berlin Sans.

Image Credits:
Abstract Vector Image By Vectorportal.com