Text Spacing (WCAG 1.4.12): Zeilen-, Wort- und Absatzabstand anpassen
Viele Menschen mit Leseschwäche, Dyslexie oder Sehbehinderung passen Textabstände über Browser-Extensions oder eigene Stylesheets an. Wenn eine Webseite dabei Texte abschneidet, überlappt oder verschwinden lässt, ist das eine WCAG-Verletzung. Das BFSG verlangt über die EN 301 549 die Einhaltung von WCAG 2.1 Level AA – Text Spacing gehört dazu.
Die vier Text-Spacing-Werte
WCAG 1.4.12 definiert vier konkrete Mindest-Anpassungen, die eine Seite vertragen muss, ohne Informationsverlust: Zeilenhöhe (line-height): mindestens 1.5-fache der Schriftgröße. Absatzabstand (paragraph spacing): mindestens 2-fache der Schriftgröße (margin-bottom/margin-top). Buchstabenabstand (letter-spacing): mindestens 0.12em. Wortabstand (word-spacing): mindestens 0.16em. Wichtig: Die Seite muss diese Werte nicht von Haus aus verwenden – aber wenn ein Nutzer sie per User-Stylesheet erzwingt, darf kein Inhalt abgeschnitten, überlappt oder unzugänglich werden.
Technische Umsetzung und Testing
Um WCAG 1.4.12 einzuhalten, gelten folgende Best Practices: Verwende keine festen Höhen (height) auf Textcontainern – nutze min-height oder gar keine Höhenangabe. Vermeide overflow: hidden auf Textbereichen. Nutze relative Einheiten (em, rem) statt px für Abstände. Teste mit dem Text-Spacing-Bookmarklet (z. B. von Steve Faulkner), das die vier Werte per JavaScript auf die Seite anwendet. Prüfe danach: Wird Text abgeschnitten? Überlappen Elemente? Verschwinden Buttons oder Links?
Häufige Text-Spacing-Probleme
Container mit fester Höhe: Ein div mit height: 200px; overflow: hidden schneidet Text ab, wenn der Zeilenabstand vergrößert wird. Absolute Positionierung: Texte in absolut positionierten Elementen können sich überlappen. CSS Clamp/Truncation: -webkit-line-clamp oder text-overflow: ellipsis verbergen Inhalte bei vergrößerten Abständen. Inline-Styles: Fest definierte line-height-Werte in Inline-Styles überschreiben User-Stylesheets und verhindern die Anpassung.
WCAG-Bezug
WCAG 1.4.12 Text Spacing ist ein Level-AA-Kriterium und damit über das BFSG und die EN 301 549 (Abschnitt 11.1.4.12) verbindlich. Es steht in engem Zusammenhang mit WCAG 1.4.10 (Reflow) – beide Kriterien fordern ein flexibles Layout, das sich an Nutzerbedürfnisse anpasst. Auch WCAG 1.4.4 (Resize Text) ist verwandt: Wer die Schriftgröße verdoppelt und gleichzeitig die Abstände anpasst, testet gleich drei Kriterien auf einmal.
Wie steht deine Webseite in diesem Punkt da?
Kostenloser Scan gegen 15 WCAG-2.1-AA-Kriterien – inkl. Text Spacing-Check.
Jetzt Webseite prüfen →