This has potential to be a very boring subject.  But really Kerning and Leading are 2 of the biggest tools for making normal text look really nice.  In this post we’ll discuss Kerning, and its partner Tracking, and in a following post we’ll discuss Leading.  There are lots of sites that cover all the technicalities and details of these tools, if you want to get more in depth, but I just want to discuss some of the basic design principles behind them, especially for people that may never have heard of the terms before.

In programs like MS Word, you may have never even come across these options, unless you were looking for them specifically.  And even then, they don’t all go by their technical terms.  Tracking is typically called “Character Spacing”, Kerning is just called Kerning (for lack of a better obvious term), and Leading is called “Line Spacing”.

kerning and tracking text


The difference between Kerning and Tracking is subtle.  They both affect the spacing between characters, but Kerning is more interested in character “pairs” and how they sit next to each other, where Tracking is more about the global amount of spacing between all letters.  In the example image, you can see how different Kerning affects the way some letter combinations behave together.  We’re mainly concerned with the “AV” combination here, because they look so strange when they don’t overlap at all.   The default setting in Photoshop is “Metric”, which uses hints that the original font designer provided.  If they didn’t provide much, “Optical” is also useful, because it looks at the shapes of the letters and tries to place them evenly apart.  As a last resort, you can set the Kerning with a numerical value if you want to adjust even further.  (It should be noted that in example D, only the “AV” combination has Kerning= -280, not the whole word, like in the examples before it.)

The goal is to get a fairly consistent amount of “space” between each pair of letters.  There’s no exact science to how that space is measured, but it should be based on the size of the whitespace “shape” you get between letters.  For instance, the triangular shape you get between “H” and “A”, and between “V” and “E” are essentially the same, but just flipped upside down.  So the most visually pleasing example overall is either b or c.  Personally I might choose the optical version in this case, but certainly not with every letter combination.

All of this is mostly important in titles and other short pieces of text that will be large.  If you have time to worry about the kerning of every letter combination in, say, a blog post like this, more power to you.  But it will mainly be noticeable where people have more time to focus on just a few letters, and when those letters are large.


So tracking is what you use if you want a bunch of letters to be close together or farther apart, like in example E.  The farther apart you get the letters, the less that your kerning really matters, too.  An example of using a larger tracking value is in this Justin Begins announcement, on the title.  One of the biggest reasons I use tracking is to adjust lines of text, so that they’ll line up perfectly with a line before or after them. If it’s done subtly enough, one line won’t appear to be a lot more compressed than the other.  Oftentimes, making the tracking small (below 0) helps a very normal font not just look bland and boring, and can make it feel “designed”.

Photoshop Shortcuts

Photoshop makes it really easy to do letter spacing (tracking in this case) by offering hotkeys.  If you wanted to adjust the “AV” combination in the example, you’d click between the A and V and then use Alt+Left Arrow to move them closer, and Alt+Right Arrow to spread them apart.  It works with selections, too — to get something like example E, select the whole word, and Alt+Right Arrow a few times to spread all the letters apart more.  Fairly painless that way.

Do you have examples of other uses for Tracking and Kerning that have worked well?  Let me know in the comments.