Letter spacing, and the sizes type was drawn for

Three different things with similar names

Kerning adjusts the space between one specific pair of letters. AV, To, Ta and Wa need it, because the shapes nest. Typeface designers ship kerning tables with the font, and the browser uses them by default in most cases; font-kerning: normal makes it explicit.

Tracking, or letter-spacing, applies the same adjustment uniformly across a run of text. This is the one you control.

Optical size is the idea that a typeface should be drawn differently for different sizes. It is the one most people have never heard of, and it explains the other two.

Why large type needs tighter tracking

A typeface's default spacing is designed for a particular size — usually somewhere in the range of running text. When you scale the letters up to 60 pixels, the spaces scale up with them. But apparent gaps do not grow the way they measure: at large sizes the same proportional space reads as a hole.

So headings need negative tracking and small text needs positive. Working numbers:

60px display    letter-spacing: -0.02em to -0.03em
40px heading    letter-spacing: -0.01em to -0.02em
16px body       letter-spacing: 0
12px caption    letter-spacing: 0.01em
12px ALL CAPS   letter-spacing: 0.06em to 0.10em

The all-caps line is the one to memorise. Capitals are spaced for use as initials inside lowercase words, not for running together in a word of their own, so a caps label set at default tracking looks cramped. Adding 6 to 10 per cent is the standard correction, and a caps label without it is one of the most recognisable marks of untrained typesetting.

Use em rather than pixels so the tracking scales with the size.

What optical size actually was

In metal type, every size was cut separately. A punchcutter making 6-point type gave it sturdier strokes, larger counters, shorter extenders and looser spacing, because at 6 points the ink spreads and the eye needs help. The same face at 48 points got finer hairlines, tighter spacing and more delicate detail.

Photocomposition and then digital type threw this away: one outline, scaled to any size. That is why a heading in a digital face often looks slightly loose and slightly clumsy, and why small text in the same face looks slightly fragile. You have been compensating by hand with tracking ever since, without necessarily knowing that is what you were doing.

Variable fonts brought it back as a real axis. A font with an opsz axis contains a design space, and the renderer interpolates the appropriate drawing for the size in use:

body { font-optical-sizing: auto; }

That is the default in modern browsers where the font supports it, and it applies the correct design automatically. Families with a genuine optical size axis include Roboto Flex, Source Serif 4, Newsreader and Literata — all free. When a face has this, you need much less manual tracking, because the shapes themselves are being adjusted rather than just the gaps.

When to touch kerning by hand

Almost never in running text. The font's tables are better than your judgement across thousands of pairs.

There is one real exception: a logotype or a short display line, where five or six words are going to be reproduced thousands of times and the pairs are visible at large size. There you set the letters individually, and the usual method is to work on the spaces rather than the letters — adjust until each gap looks like it contains the same amount of air as its neighbours, which is a judgement about area, not distance. A common training exercise is to set a word upside down, where you cannot read it and therefore cannot be distracted from the shapes.

Inkscape, Krita and Scribus all support manual letter-by-letter kerning; so does any vector editor. This is not a paid-tool capability.

Where it goes wrong

• Tracking body text to fit. Adding letter-spacing to make a paragraph fill a space damages the word-shape recognition that reading depends on. Change the measure or the size instead.
• Negative tracking at small sizes. Below about 14 pixels, letters are already close to touching at typical screen resolutions, and negative tracking makes them collide.
• Tracking scripts that join. In Devanagari the letters sit under a connecting headline, and in Arabic they join cursively. Adding letter spacing breaks the joins and can make the text unreadable rather than merely ugly. Set letter-spacing: normal explicitly for those blocks if a global rule is applying tracking site-wide.

That last one catches people out constantly on multilingual sites, because the rule was written for a Latin heading and applied to everything.