Digital Marketing Updates 2018: A Comprehensive Guide to Kerning in Typography

Tuesday, 22 May 2018

A Comprehensive Guide to Kerning in Typography

I’m willing to bet you already know what kerning is -- you just don’t realize it.

While you might not recognize when kerning is done well, you certainly see it when it’s done poorly.

Here’s an example of bad kerning: M a rk e t i ng .

Kerning is adjusting the space between letters, and either increasing or decreasing the distance to ensure better readability or appearance.

Interestingly, it’s not always best to have equal spacing between each letter. Each letter has different shapes and curves, so sometimes kerning actually helps the letters look less conspicuous. For instance, a “cl” can sometimes appear to be a “d”, so you might use kerning to space them further apart.

What is kerning?

Kerning refers to the space between letters to ensure better readability. Since not all letters are created with equal curves and shapes, you might need to increase or decrease the distance between one letter and another, to create more legible text. Kerning improves the appearance and design of your text, which might otherwise look awkward.

No matter what your job title, it’s important to understand the power of kerning. Kerning can help you create better designs, produce more visually appealing copy, or construct better presentations. Kerning is one of those actions that can push your deliverables from ordinary to exceptional.

If you don’t know how kerning works, don’t worry. Here, we’ll show you how to use kerning in Photoshop, Word, and Illustrator. Plus, we’ll provide examples of bad kerning, so you know what to avoid when using kerning for your own text.

Kerning vs. Tracking

Kerning is the adjustment of distance between two letters. You’d use kerning if you felt a word looked funky because the letters A and B were too close together. Tracking, on the other hand, is adjusting the spacing equally between each letter, to either spread apart or bring together an entire word.

Kerning in Photoshop

Kerning in Photoshop is incredibly easy, once you figure out where the “Kerning” tool is. If you’re designing a presentation or email template in Photoshop, and your words look a little sloppy, this is an easy way to clean up your text to improve the appearance.

1. First, ensure your cursor is in between two letters. Next, select the “Character” panel, as highlighted by the red arrow below (If you can’t find it, try searching “Character” within the Photoshop search tool).

3. Within the “Character” panel, you’ll see a V/A (with a little arrow below the A). That’s the “Kerning” tool. It’s automatically set to “Optical”. Click the down arrow to see your options for kerning.

4. For instance, I chose the number “75”. If you’re unsure how much space you want between your letters, test out a few different options. The negative numbers make your letters closer together, and the positive numbers create more space between the letters.

5. Now, there’s a nice “75” point space between my “K” and “E” (of course, this is probably an example of bad kerning … ).

Important note: There’s a quicker option to use the “Kerning” tool in Photoshop. If you click in between two letters, you can hit “Option” and then hit the “Right” arrow. This will create more distance between letters.

Kerning in Word

If your writing copy in Microsoft Word, or using Word to design a poster, you might want to use kerning, especially if your font is bigger and the letters look awkward.

Fortunately, it’s easy to do.

Within a Word document, go to “Format” and then click “Font”. FYI, I left my cursor in between the “K” and the “e” in the document, because that’s the space to which I wanted to apply kerning.

2. Next, click “Advanced” within the Font panel.

3. Under the “Advanced” section, you’ll see “Kerning for fonts” with an empty box to the left of it. Check that box. Then, input a number (I put “20”, which you’ll see circled). The number you choose will depend on how much space you want between the letters.

4. There’s now “20” points of kerning in between the “K” and the “e”.

Kerning in Illustrator

Finally, let’s take a look at kerning in Illustrator. Since many designers and marketers use Illustrator for clients or for personal projects, it’s important to know how to apply kerning to your letters.

Kerning in Illustrator is an almost identical process to how you’d do it in Photoshop (which makes sense, since they’re both Adobe products). Nonetheless, here’s how you do it.

First, click the “Text” tool and put your cursor in between two letters -- I put mine in between the “K” and the “E”. Then, find your “Characters” panel.

2. Similar to Photoshop, there will be a “V/A” tool, with a little arrow underneath the “A”. That’s the kerning tool. With your cursor placed between two letters, increase or decrease the number beside the kerning tool -- as you can see, I set mine to “200”.