Wortabstand für Lesbarkeit
Die richtige Abstimmung von Wortabstand sorgt dafür, dass Leser Text schneller erfassen und länger konzentriert bleiben.
Anfänger
Buchstabenabstand perfektionieren
Wie man Kerning und Letter-Spacing richtig einsetzt, um Überschriften prägnanter und lesbar zu machen
Der Buchstabenabstand – das ist mehr als nur eine technische Einstellung. Es’s die unsichtbare Kraft, die darüber entscheidet, ob eine Überschrift wirkt oder flach aussieht. Kerning und Letter-Spacing sind Werkzeuge, die Designer oft übersehen. Dabei machen sie den Unterschied zwischen mittelmäßiger Typografie und etwas Besonderem.
In diesem Guide zeige ich dir, wie du beide richtig einsetzt. Nicht theoretisch, sondern praktisch – mit echten Beispielen und Techniken, die sofort funktionieren.
Was du hier lernst
- Der Unterschied zwischen Kerning und Letter-Spacing
- Wann du welche Technik einsetzt
- Praktische Werte für Überschriften und Fließtext
- Häufige Fehler vermeiden
Kerning vs. Letter-Spacing: Der entscheidende Unterschied
Viele verwechseln diese beiden Begriffe. Das ist verständlich – aber es ist ein Unterschied wie zwischen Automechaniker und Chirurg. Beide arbeiten präzise, aber auf völlig unterschiedliche Weise.
Letter-Spacing ist der gleichmäßige Abstand zwischen allen Buchstaben. Du stellst einen Wert ein – sagen wir 0,05em – und alle Abstände werden identisch. Das funktioniert gut bei Fließtext. Es’s regelmäßig, maschinell, konsistent.
Kerning ist anders. Es ist die Feinabstimmung zwischen einzelnen Buchstabenpaaren. Der Abstand zwischen A und V ist optisch anders als zwischen H und I. Kerning gleicht das aus. Es’s handwerklich, individuell, intelligenter.
Das Problem: Nicht alle Schriftarten haben gutes Kerning eingebaut. Manche Paare sehen schief aus – AV, To, We. Hier musst du manuell nachbessern.
Hinweis: Die in diesem Artikel beschriebenen Techniken basieren auf etablierten typografischen Richtlinien und Best Practices. Allerdings variieren die optimalen Werte je nach Schriftart, Kontext und Zielgruppe. Experimentiere mit den Werten und vertraue auf dein Auge.
Praktische Werte für dein Projekt
Genug Theorie. Hier sind die Zahlen, die wirklich funktionieren.
Für Überschriften: Starte mit 0,02em bis 0,05em Letter-Spacing. Je größer die Schrift, desto weniger Abstand brauchst du. Eine 48px-Headline könnte 0,02em sein. Eine 24px-Überschrift braucht vielleicht 0,03em oder 0,04em.
Für Fließtext: Hier sind die Werte deutlich kleiner. 0,005em bis 0,015em reichen meist aus. Oft merkst du gar keinen Unterschied. Das ist Absicht – Fließtext soll sich natürlich anfühlen, nicht konstruiert.
Für all-caps: Das ist wichtig: Großbuchstaben brauchen mehr Abstand. Probiere 0,08em bis 0,15em. All-caps sieht sonst gedrungen und schwer lesbar aus.
Diese Werte sind Startpunkte. Dein Auge ist die beste Kontrollinstanz. Wenn es sich gut anfühlt, ist es richtig.
Kerning in der Praxis: Wo du wirklich eingreifen musst
Letter-Spacing ist einfach. Kerning ist etwas schwieriger, aber auch wichtiger. Manche Schriftarten haben Kerning-Fehler, die dein Design sabotieren.
Das klassische Beispiel: Das Wort „Awesome”. Das W und das A – sie sehen oft auseinander gerissen aus. Der Abstand sieht größer aus als er ist. Oder „Trying” – das T und das y. Das T hängt über dem y wie ein Dach, und der Abstand wirkt riesig.
In den meisten Designprogrammen kannst du Kerning manuell anpassen. In CSS ist das schwieriger, aber nicht unmöglich. Du kannst mit `letter-spacing` arbeiten oder – wenn du sehr präzise sein willst – einzelne Buchstaben mit ` ` umhüllen und ihnen spezifische Margin-Werte geben.
Wichtig: Tue das nur bei Überschriften und Herotext. Bei Fließtext ist der Aufwand nicht wert – dein Auge kann es nicht richtig bewerten.
Die häufigsten Fehler – und wie du sie vermeidest
Fehler 1: Zu viel Letter-Spacing bei Überschriften. Das sieht dünn und instabil aus. Deine Marke wirkt schwach. Weniger ist mehr. Wenn du denkst, dass 0,1em richtig ist, probiere 0,03em.
Fehler 2: Kein Kerning bei problematischen Paaren. Du siehst es – aber du magst nicht nachbessern. Das ist Perfektionismus, der sich auszahlt. Fünf Minuten Kerning-Anpassung machen den Unterschied zwischen OK und großartig.
Fehler 3: Letter-Spacing bei Fließtext anpassen. Das ist ein klassischer Fehler. Der Text wird unruhig und schwer lesbar. Fließtext will sich natürlich anfühlen. Lass ihn in Ruhe.
Fehler 4: Negative Letter-Spacing nutzen. Manchmal sieht das gut aus – aber Vorsicht. Buchstaben können sich überlappen. Das ist nicht immer schlecht (modern, bold), aber es kann auch unleserlich werden.
Die beste Strategie: Teste deine Werte mit echtem Text. Nicht nur mit Beispielsätzen, sondern mit dem Text, der später verwendet wird. Manche Buchstabenkombinationen sehen anders aus als andere.
Das Wichtigste zusammengefasst
Buchstabenabstand ist ein Detail. Aber es’s eines der wichtigsten Details. Es separiert professionelles Design von dilettantischem. Die gute Nachricht: Es ist nicht kompliziert.
Merke dir diese drei Punkte:
- Letter-Spacing für gleichmäßige Abstände. Besonders bei Überschriften und all-caps.
- Kerning für problematische Paare. Von Hand, genau, präzise.
- Dein Auge ist die beste Richtlinie. Vertraue deinem Bauchgefühl.
Die praktischen Werte: 0,02em–0,05em für große Überschriften, 0,005em–0,015em für Fließtext, 0,08em–0,15em für all-caps. Aber: Das sind nur Ausgangspunkte. Jede Schriftart ist anders. Experimentiere.
Buchstabenabstand ist eine Fähigkeit, die du mit der Zeit verfeinerst. Nicht mit Theorie, sondern mit Praxis. Je mehr du damit arbeitest, desto besser wird dein Auge. Und desto besser werden deine Designs.
Lerne mehr über Typografie
Entdecke weitere Techniken der Mikrotypografie und verbessere deine Designfähigkeiten
Zur Kategorie