Wat is kerning?
Kerning is het bijstellen van de ruimte tussen twee specifieke letters. Niet tussen alle letters tegelijk, maar precies tussen dat ene paar dat scheef oogt.
Denk aan een hoofdletter V naast een A, of een T naast een o. Die combinaties laten met de standaardruimte een gat vallen dat je oog meteen ziet.
In lopende tekst op een website ga je hier nooit aan zitten. In een logo is het het verschil tussen verzorgd en amateuristisch.
Wat kerning precies doet
Elke letter heeft links en rechts een vaste hoeveelheid ruimte ingebakken. Bij de meeste combinaties klopt die ruimte prima.
Bij schuine en ronde vormen klopt hij niet. Een V en een A hebben allebei een schuine flank, dus onderaan raken ze elkaar bijna en bovenaan valt er een gat. Kerning haalt dat gat weg.
Waarom jouw oog dit ziet en de computer niet
Je oog kijkt naar oppervlak, niet naar afstand. Twee rechte letters met vier pixels ertussen ogen even dicht als twee schuine letters met twee pixels ertussen.
Een goed lettertype heeft daar duizenden kernparen voor ingebouwd. Een goedkoop lettertype heeft er een paar honderd, en dat zie je terug zodra je een kop groot afdrukt. Meer daarover lees je bij font.
Waar je het in de praktijk nodig hebt
In logo’s. En verder eigenlijk nergens.
Een logo is een handvol letters die je duizenden keren groot laat zien. Daar valt elke scheve tussenruimte op. Bodytekst van zestien pixels leest niemand letter voor letter, dus daar merkt niemand het.
Mijn vuistregels
- Lopende tekst: nooit kernen, het lettertype doet dat beter dan jij.
- Koppen boven de dertig pixels: kijk of er gaten vallen bij paren als VA, To en Ay.
- Logo’s: per letterpaar met de hand, en daarna vastleggen als vectorbestand.
- Twijfel je? Zet de tekst op zijn kop, dan zie je ruimte in plaats van woorden.
Die laatste truc gebruik ik zelf nog steeds. Zodra je de letters niet meer leest, zie je precies waar het ritme hapert.
Kerning op een website
In de browser kun je kerning aan- en uitzetten, maar niet per letterpaar bijsturen. De standaardinstelling staat goed, dus laat hem staan.
Wil je in een kop toch een specifiek paar bijstellen, dan moet je die twee letters apart wegzetten met een eigen marge. Dat is onderhoudswerk waar je over een jaar spijt van hebt. Meer over hoe je dat soort keuzes vastlegt lees je bij css.
Wat je in plaats daarvan doet
Kies een lettertype met een fatsoenlijke kerningtabel. Dan is het probleem weg voordat het ontstaat.
En zet je afstanden globaal, niet per element. Hoe dat samenhangt met de rest van je vormgeving lees je bij typografie. De term zelf staat kort uitgelegd bij kerning.