This is actually an old version of For the latest and greatest, check out the new site.

Fix Your Face

Short of being a lesson in kerning, here's a little tip in making your typography look just a little bit better.

Whenever you sit down to design, you should be sure to make the details count. The difference between an amateur and the professional is subtlety. Specifically when it comes to type, it's a good idea to take an extra couple of minutes to refine some of the nuances.

Two of a kind

Let's refresh. According to The Complete Manual of Typography, kerning is the act of adjusting the space between two characters to compensate for their relative shapes. However, because of the particular shapes of some letters, most typefaces have specific relationships between certain letters called kerning pairs.

Software programs do a decent job of approximating good kerning, but you should still make it a habit to go in and tweak, especially when your type gets significantly larger than body copy. Sidestepping a full kerning lesson, the secret to successful kerning is that each character should be visually centered between the characters to its left and to its right. (Notice that I said "visually", not "numerically"; there's a big difference.) As an example, let's use the word "Ladder", set in Adobe Caslon Pro Regular, seen below.

Thumbnail of the word Ladder

Notice that each letter is visually centered against the characters on its sides:

Thumbnail of the letter spacing in the word Ladder

I chose this specific word because it contains one of those difficult kerning pairs, a capital "L" and a lowercase "a". To illustrate the excessive negative space in this pair, I've highlighted the gap:

Thumbnail of the gap between the L and the a

To fix this, once you've kerned the type as best as possible, convert it to an editable format. If you're in a vector program like Illustrator (preferred), convert the type to outlines so that you can edit the points. If you're in a bitmap program like Photoshop, rasterize the type. The main problem with this pair is that the base of the "L" is too long to be comfortable. Using a selection tool (bitmap program) or the direct selection tool (vector program), select the whole left side of the "L"—everything except the right serif—and shift it several pixels to the right. There's no set rule for how far you should go; use your own discretion, but remember that you don't want to edit the precise curves that make the typeface so well-excuted in the first place. You can see a before/after below:

Thumbnail of the word Ladder before being fixed

Thumbnail of the word Ladder after being fixed

It's not a perfect solve, but decreasing the size of that gap makes that pair a lot tighter, creating the illusion that it's closer to the way the other letter pairs are kerned. It's almost indiscernible to anyone that's not looking for it, but, when it comes to typography design, minutia is key.


Charles said:

I'm glad you wrote this article, there have been several assignments where I wasn't quite happy with the kerning of a certain headline - I now totally understand why. For some reason this tip never came up in class, definitely makes the case for good bloggers.

Posted on September 27, 2005 02:09 AM

Stephen Caver said:

These sort of type tips are really valuable to me. As a student, these are the kind of things I want to learn, but unfortunately the details are not gone over. Sure, there is a basic lesson on kerning, but specific tips like this are hard to come by, and being sort of alone in my fascination with type, it's even harder to get this sort of tip. Thanks.

Posted on September 27, 2005 05:19 AM

Billy said:

I don't think deforming letterforms is a good idea. You've solved your whitespace 'problem' by distorting the elegant proportions of the glyph. The 'L' is always going to have a lot of negative space—that's the nature of its form. If that bothers you esthetically, consider using another typeface—perhaps a condensed font—or consider using all caps for your headlines.

Posted on September 27, 2005 10:53 PM

Dan Mall said:

@Billy: I see your point, but to say that this technique deforms a character is exaggerated.

The 'L' is always going to have a lot of negative space—that's the nature of its form.

You're absolutely right, but that's because of the history of Roman letterforms. Type manipulation, although it can impact legibility, is very much an aesthetic decision. By using a condensed face, we run into the same proportion issue, where the negative space between the “L” and the “a” are a different color than the rest of the word. An all caps headline just accentuates that difference, as “LA” is an even more terrible kerning pair than “La”, specifically because of the slant in the capital “A”.

Famous typographers throughout history have manipulated their letterforms to suit their aesthetics. Herb Lubalin decided that Futura's letterforms weren't suitable to his aesthetics, which led to the production of this beautiful set of ligatures. I think we can all take a cue from this sort of forward thinking.

Posted on September 27, 2005 11:11 PM

Alex said:

This is an interesting way of teaching. Kudos.

Posted on September 30, 2005 10:41 PM

David Letterman said:

While I'm an frequent advocate of by-all-means-necessary as a design approach, I think bastardizing letterforms is a rather heavy-handed way to resolve the frequent issue of unfortunate kerning pairs.

In my opinion, these types of letterform modifications are best reserved for logotypes, or titling situations -- not normal typesetting applications.

Posted on March 28, 2006 10:01 PM

Sorry: comments are closed.