Craft

What every designer should know about kerning

4 min read
Liz Steelman
  •  Jan 14, 2021
Link copied to clipboard

As every designer knows, knowing about design is a curse. Everywhere you go, you see examples of design gone awry — everyday objects that could be more aesthetically pleasing, easier to use, or just better all around, and you wonder why they aren’t. You can explain what went wrong and where, but you never really understand why anyone would choose to design it that way.

In no aspect of design is that problem more apparent than kerning, the proper spacing of letters within a word. Once you can kern properly, you’ll notice business logos and highway signs that made all the wrong choices. You’ll see rn’s that look like m’s, mid-word spaces, and letters wandering off on their own like lost sheep. But more importantly, you’ll be able to create harmonious logos, headings, and text blocks on your website or app that feel natural to read, even for users who aren’t design knowledgeable.

Kerning vs. tracking

A one-sentence definition of tracking makes it sound a lot like kerning, which is why the two design elements are frequently confused. Simply put, tracking is the consistent space between letters over a block of text. The name comes from a time when lines of text on a printing press were lined up along a raised track. If you adjust tracking in modern design programs, the entire paragraph or text box you have selected will tighten or loosen.

If you adjust kerning, the only space that will change is the one your cursor is in, between two letters. This might seem like a strange option to choose if the spaces between letters are already consistent, but proper kerning isn’t really about consistent letter spacing. It’s about letter spacing that looks consistent, which often is not the same thing. The negative space in a capital K or W will make it appear farther from the letter to its right than it really is, whereas a lowercase a or u appears close to the letter on its right but far from the one on its left. All these values vary greatly from font to font, but you’re likely to find your greatest challenges in the very place that needs to impress viewers the most: in logos, titles, and headings that use statement fonts.

In most programs, you can get perfect tracking by trusting your computer, but to get truly great kerning you need to trust yourself. A good way to start is by looking through the text and finding two straight vertical lines that are next to each other; in this sentence, you might choose the di in finding, or the li in lines. The real space between those lines is the same as the perceived space. Use that space as a guide, and make sure you perceive every pair of letters as being the same distance apart as those two lines.

The only way to improve your kerning skills is through practice and experience. Here are some helpful free typography resources.

Leading vs kerning

Leading (which rhymes with sledding) is the third important element of letter spacing. It is the distance between the baseline of one line of text and the baseline of the next. You may also hear it called line height or line spacing, but like tracking, the name leading dates back to the good old days of the printing press, when lines were separated in the printer’s tray with lead bars. Leading is measured as a ratio of a default, sometimes called single spacing, that varies slightly from program to program. However, it is usually about 120 percent of the font size. Decrease it too much, and the lines will intersect.

Good leading makes reading a block of text feel natural. If it is too tight, it’s easy for a user to lose their place, skipping a line or reading it twice. However, moving from one line to the next shouldn’t feel like leaping the Grand Canyon. Short, even lines, like the ones in bulleted lists, tend to be less confusing with more leading, as is continuous copy. Dense and difficult prose, in particular, is more readable with more white space; although it might make designers cringe, there’s a reason why double spacing is the choice of academics.

Bad kerning

As we said before, it’s rare to see kerning so bad that the layman notices it. Once in a while, a careless typesetter causes a disaster by, say, tightening the space between the L and I of FLICK until it looks like a U, or adding an unwarranted space in the middle of GLASS or ANALYSIS. But most bad kerning—or “keming,” as the cool kids call it—only registers on a conscious level to people who typeset text for a living. So why is it a problem?

Well, to begin with, there are a lot of people in the world who are or have been involved in the design industry, and they all appreciate a well-kerned piece of text. In fact, it may be the fastest way to impress a designer. But you don’t have to be a designer to know what looks good, even if you can’t necessarily articulate why. Reading a word with an extra bit of space between two letters feels like missing a step when walking downstairs. Squinting at two letters that are too close together to make out is no one’s idea of a good time. Errors like that are distracting, but a well-kerned block of text exudes a harmony that adds power to the message of the text.

Business Thinking for Designers by Ryan Rumsey

Great design will get you far—but pair your talent with a business mind to truly transform your career and company. Learn the strategies to effectively communicate with your business partners, plus tools, tips, and frameworks that you can put right to work in our book.

Download for free