Have you ever had someone stand uncomfortably close to you? You don’t understand why they’re hovering, and the whole situation reminds you of the awkward social interactions of middle school.
That’s basically what happens to letters when the kerning is off.
Kerning focuses on the space between two specific characters. Although characters have various widths, it’s important to proportionally distance them.
Designers can’t rely on the automatic kerning of computer programs. Due to different font styles and serifs, some letters may need extra kerning for words to look right. Manually adjusting the kerning gives designers more control.
Digital typography makes kerning much easier than in print. The default kerning may not be appropriate for all letters though.
Letter combinations like ‘VA’ or ‘AV’, large fonts and capital letters often require kerning. It may seem like a bit of unnecessary work, but you’ll be amazed at what this small attention-to-detail adds to the overall design.
To calculate kerning values, count the number of font units the default space between the characters needs to be changed. Positive values increase the space and negative values decrease the space.
It’s all relative to the font you’re using, too. Don’t expect the value between two letters to be the same when you change the typeface. The required adjustment tends to vary quite a bit.Negative adjustments
are the most common. They are often used for capital letters T, V, W, Y, and to bring capital and lowercase letters closer together. Positive adjustments are used mainly for special characters, accented letters or punctuation.
Kerning tables have the kerning values of a pair of characters. Because there are 100s of character pairings for each font, the tables often consist of multiple sub-tables.
There are standard ways of kerning OpenType fonts, these values are stored in the Glyph Positioning Table. This table defines characters with similar features and kerning needs as classes, to give standard kerning values for each letter combination.
refers to the default spacing. There are two methods, metric and optical. Metric kerning uses the values found in the kerning tables associated with the font. Optical kerning is more advanced and uses the outline of the letters in an algorithm to calculate the optimal space between characters.Manual Kerning
is where the designer can override the automatic kerning. Illustrator and Photoshop enable designers to manually adjust kerning.
Advanced designers can sometimes use contextual kerning in high-quality typography projects. The process looks at the space between two characters AND those on either side of it. It adjusts one or both spaces in a sequence of three characters.
You won’t use this skill very often, but is handy should you ever need it.
Just as the type of font you use can affect kerning, the font size will influence it too. Kerning becomes more important with larger text because the spacing is more noticeable to the eye.
Wait until the finished design before kerning. If you need several sizes, each may need its own level of adjustment. Individually kern the variations instead of simply shrinking the design.
Sometimes it’s difficult to see where you need to make kerning adjustments. Your mind gets influenced by the familiarity of the word. So, it’s hard to see it objectively.
To avoid this frustration, turn the design upside down. You’ll then be able to focus on letter shape and spacing without bias because you can laser-focus on the kerning.
There are common combinations of letters or characters that are more challenging to kern. You’ve got to keep an eye on capital letters or slanting shapes. It’s useful to do these first. Then kerning the rest of the letters around them will be easier.
Here are some to look out for:
Kerning, leading and tracking are a way to polish the design. Leading refers to the vertical space between lines, and tracking applies consistent spacing between all letters in the text.
After you’ve implemented the leading and tracking, it’s time to make nuanced shifts with kerning. Think of it like the cherry on top of a sundae -- it may seem like a small ingredient, but the entire dessert feels off without it. That’s kerning.
We enjoyed exploring this topic with you. Want to keep going? Pick one of these related terms to read next:A. Serif [grey-dee-uh nt], noun:
These do have the pen strokes… Read the full definition »B. Kerning [skyoo-uh-mawrf-siz-uh m], noun:
Want to dive into the nuances of crisp typography in your designs? It all starts here… Read the full definition »C. Gradient [vek-ter graf-iks], noun:
As the perfect transition, jump into this definition of gradients. You’ll learn about how to use them in modern design… Read the full definition »