Psychology-driven brand design. Creating and refining remarkable brand identities.

Design - from all angles

A blog about branding, marketing, and design, mostly through the lens of practical psychology, intended to be a resource to small businesses and entrepreneurs. Unless otherwise noted, all articles are written by Nyla Smith, owner of n-Vision Designs. {Subscribe to the RSS feed here: RSS}

"K" is for: Kerning

Nyla Smith | Tuesday, October 13, 2015

Let me let you in on a little trick of professional graphic designers. This little last-minute tweak can make a huge difference—and it’s a key factor separating the amateurs from the experts.

It’s called kerning.

Kerning is big. Kerning is huge. Kerning makes the difference between success and failure.

So, what is it? Glad you asked!

Kerning is what designers do to adjust the space between individual letters or characters.

That’s the big secret? Yes. That’s it.

Avoid awkward spacing

To understand kerning, consider the effects of negative space, or the empty, passive gaps between design elements. Kerning corrects awkward spaces that can appear when differently shaped letters are placed next to each other. The goal is to have all a word’s letters appear as though they are evenly spaced, which improves the flow and legibility of that word.

applying kerning to letters
Designers often adjust the spacing between letters to improve the relationships between the horizontal strokes, angled strokes, and curves of different characters.

The key word here is “appear,” because it’s really about the illusion of space. Effective kerning takes a bit of practice. Even if letters are the same distance apart mathematically, the interaction between the letter shapes may make them appear farther away or closer together than they actually are.

Kerning for Success

Good design should be invisible, allowing the intended message to shine through unhindered. Poor design creates distraction, or worse, confusion, when it gets in the way of the message. As with many things, the devil is in the details. Here’s an example.

Let’s say you’re a massage professional. You just moved into a fancy new office and commissioned a sign to hang outside your door. And your designer sent you this:

therapist logo with bad kerning
Kerning makes a big difference here.

Whoops. That’ll probably cost you a few customers.

Whether or not we realize it, our brains interpret a too-large gap between letters as the signal that one word is ending and the next is beginning. Just try and not get tripped up by the poor design choice in the kerning on this sign. It’s the difference between people being drawn in for your wonderful services and running away screaming, or laughing at your incompetence. And it’s all thanks to that unfortunate gap between the E and R.

Not all kerning faux pas are as obvious, but the eye still picks up on many of these things subconsciously. Non-designers, when shown a word with kerning applied versus one without, will say the former is more pleasant, readable, or professional-looking, even if they can’t articulate exactly why.

Kerning for Success

Kerning isn’t something you do to every single word of every project. It would be insanely time-consuming to kern the spaces between every letter of a 300-page book, for example. Spacing is less noticeable in small type, so designers typically don’t kern body copy. Spacing issues are most obvious in larger typefaces, like headlines or display text, so designers put forth extra effort there to make sure the design has the intended effect.

Kerning in logos is also important; they should feel fluid and cohesive. Unsightly gaps are a sure-fire way to look sloppy and unprofessional.

Kerning vs. Tracking

While we’re on the topic of spacing, this would be a good time to touch on a couple of other terms that may get confused with kerning. Tracking is similar to kerning, but instead of focusing only on the spaces between letters, tracking applies indiscriminantly to entire blocks or lines of text. Tracking is generally used for body copy.

Traditionally, kerning and tracking are tools of print design. However, it is possible to adjust character spacing on websites as well. Online, tracking corresponds to the letter-spacing property in CSS. If you apply a letter-spacing value of -2px to your web page text, it tightens all of the text by two pixels. Unless you use JavaScript to allow you this kind of precision, kerning online is usually impractical.

Become a better kerner :-)

Now that you’re a kerning expert, want to test your kerning chops? There’s probably an app for that, but there’s definitely a game for that!

Kerning Game
Kern Type, the kerning game. http://type.method.ac

Kern Type allows you to adjust kerning of words and test your best against a professional typographer’s solution.

See how high of a score you can get…good luck!

Nyla Smith is a Graphic Designer, Web Designer, Front-End Web Developer and Consultant with over 12 years of experience. She is the owner of n-Vision Designs, LLC in Hampton, Virginia, which exists to provide marketing support and brand consulting to small- and medium-sized businesses needing creative solutions. Contact Nyla if you'd like to discuss your next creative project. She can usually be bribed to a meeting with a cup of green tea and an oatmeal cookie.
Comments
Post has no comments.

Keep reading: