Zum Inhalt springen
Barrierefrei²

Erfolgskriterium 1.4.12

1.4.12 Textabstand

Level AAWahrnehmbar

Wenn Worte Luft zum Atmen brauchen.

1. Was ist das Ziel dieses Kriteriums?

Stell dir vor, du versuchst ein Buch zu lesen, bei dem die Wörter so eng aneinandergequetscht sind wie Fahrgäste in der U-Bahn zur Hauptverkehrszeit. Für manche Menschen ist genau das Alltag im Internet – Text ohne ausreichende Abstände macht das Lesen zur Qual.

Menschen mit Legasthenie, Sehbeeinträchtigungen oder kognitiven Einschränkungen brauchen oft mehr Platz zwischen Zeilen, Wörtern und Buchstaben, um Text gut lesen zu können. Das Ziel von Erfolgskriterium 1.4.12 ist es sicherzustellen, dass Nutzer:innen die Textabstände nach ihren Bedürfnissen anpassen können, ohne dass dabei Inhalt verschwindet oder Funktionen kaputtgehen.

2. Was fordert das Erfolgskriterium genau?

Ganz konkret geht es darum, dass deine Website auch dann noch funktioniert, wenn Nutzer:innen die Textabstände mit eigenen Stylesheets, Browser-Erweiterungen oder anderen Werkzeugen ändern. Folgende Werte müssen gleichzeitig gesetzt werden können, ohne dass Inhalte oder Funktionen verloren gehen:

  • Zeilenhöhe: mindestens das 1,5-Fache der Schriftgröße
  • Abstand nach Absätzen: mindestens das 2-Fache der Schriftgröße
  • Buchstabenabstand: mindestens das 0,12-Fache der Schriftgröße
  • Wortabstand: mindestens das 0,16-Fache der Schriftgröße

Wichtig: Du musst diese Abstände nicht standardmäßig verwenden! Es geht nur darum, dass dein Layout nicht zusammenbricht, wenn jemand diese Werte einstellt – etwa weil Text abgeschnitten wird, sich überlappt oder hinter anderen Elementen verschwindet.

Ausnahme: Sprachen und Schriftsysteme, die einzelne dieser Eigenschaften nicht verwenden, müssen nur die für sie relevanten Eigenschaften berücksichtigen.

3. Warum ist das wichtig für Barrierefreiheit?

Stell dir vor, du willst einen wichtigen Artikel lesen, aber der Text ist so dicht gepackt, dass du ständig die Zeile verlierst oder Buchstaben ineinander verschwimmen. So geht es vielen Menschen täglich im Web.

Anpassbare Textabstände schaffen Barrierefreiheit, weil sie:

  • Menschen mit Legasthenie helfen, für die größere Buchstaben- und Wortabstände das Lesen erleichtern können
  • Menschen mit Sehbeeinträchtigungen unterstützen, die mehr Platz zwischen Zeilen und Wörtern brauchen
  • Menschen mit kognitiven Einschränkungen die Orientierung erleichtern, weil Textblöcke klarer voneinander getrennt sind
  • Älteren Menschen das Lesen erleichtern, die oft von größeren Abständen profitieren
  • Allen in schwierigen Lesesituationen helfen – etwa bei schlechtem Licht oder müden Augen

Das Kriterium ergänzt Visuelle Darstellung auf Stufe AAA, das ebenfalls großzügige Abstände anpassbar machen will.

4. So setzt du das Kriterium erfolgreich um

Die gute Nachricht: Flexible, responsive Layouts erfüllen dieses Kriterium oft schon weitgehend. Probleme entstehen meist durch feste Höhen und abgeschnittene Container. Hier sind die wichtigsten Praxis-Tipps:

Flexible Layouts sind dein Freund:

  • Verwende relative Einheiten (em, rem, %) statt fester Pixelwerte
  • Lass Container mit dem Inhalt mitwachsen, statt sie in feste Größen zu zwängen
  • Vermeide overflow: hidden bei Containern mit Text
  • Setze keine festen Höhen für Textbereiche

Container richtig dimensionieren:

  • Plane Puffer für Text ein, der nicht umbricht, z. B. in Buttons, Tabs und Navigationspunkten
  • Verwende min-height statt fester height-Angaben
  • Lass Flexbox und CSS Grid für dich arbeiten

Testen mit einfachen CSS-Regeln: Du kannst deine Website ganz einfach testen, indem du diese CSS-Regeln vorübergehend anwendest:

* {
  line-height: 1.5 !important;
  letter-spacing: 0.12em !important;
  word-spacing: 0.16em !important;
}
p {
  margin-bottom: 2em !important;
}

Prüfe danach jede Seitenvorlage: Ist aller Text vollständig sichtbar? Überlappt nichts? Funktionieren alle Bedienelemente noch?

Werkzeuge für den Test:

  • Browser-Erweiterungen wie Stylus, mit denen du eigene CSS-Regeln einspielen kannst
  • Die Entwicklertools im Browser
  • Text-Spacing-Bookmarklets, die genau diese Werte per Klick setzen

Was du vermeiden solltest:

  • Absolute Positionierung für Textcontainer
  • Feste Größenangaben, die nicht mit dem Inhalt mitwachsen
  • Verschachtelte Container, die überstehenden Text abschneiden

5. Warum dieses Erfolgskriterium für Unternehmen relevant ist

Auch bei Erfolgskriterium 1.4.12 gilt: Barrierefreiheit ist kein Selbstzweck – sondern bringt handfeste Vorteile für dein Unternehmen.

1. Zielgruppe erweitern

Viele Menschen mit Legasthenie, Sehbeeinträchtigungen oder nachlassender Sehkraft passen Textabstände an, um besser lesen zu können. In Deutschland leben laut Destatis rund 7,9 Millionen schwerbehinderte Menschen; dazu kommen viele Menschen mit Leseschwierigkeiten ohne anerkannte Behinderung. Mit flexiblen Layouts schließt du sie nicht aus.

2. Robustheit und Flexibilität verbessern

Layouts, die vergrößerte Abstände aushalten, sind auch besser auf längere Übersetzungen, andere Schriftarten und unterschiedliche Geräte vorbereitet. Das spart Nacharbeit bei jeder neuen Sprache oder jedem Redesign.

3. Höhere Nutzerzufriedenheit

Wenn Text leichter lesbar ist, verstehen Menschen deine Inhalte besser – besonders bei textlastigen Angeboten wie Online-Shops oder Informationsportalen.

Und nicht zuletzt: rechtliche Anforderungen. Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG) für viele Produkte und Dienstleistungen für Verbraucher:innen, etwa Online-Shops. Technischer Maßstab ist die EN 301 549, die für Webinhalte auf WCAG 2.1 Level AA verweist – 1.4.12 gehört dazu. Öffentliche Stellen sind über die BITV 2.0 bzw. Landesrecht verpflichtet. Dieser Abschnitt informiert allgemein und ersetzt keine Rechtsberatung.

6. Das Erfolgskriterium im Wortlaut des W3C

Success Criterion 1.4.12 Text Spacing (Level AA)

In content implemented using markup languages that support the following text style properties, no loss of content or functionality occurs by setting all of the following and by changing no other style property:

  • Line height (line spacing) to at least 1.5 times the font size;
  • Spacing following paragraphs to at least 2 times the font size;
  • Letter spacing (tracking) to at least 0.12 times the font size;
  • Word spacing to at least 0.16 times the font size.

Exception: Human languages and scripts that do not make use of one or more of these text style properties in written text can conform using only the properties that exist for that combination of language and script.

Note 1: Content is not required to use these text spacing values. The requirement is to ensure that when a user overrides the authored text spacing, content or functionality is not lost.

Note 2: Writing systems for some languages use different text spacing settings, such as paragraph start indent. Authors are encouraged to follow locally available guidance for improving readability and legibility of text in their writing system.

Kurz gesagt: Wenn Nutzer:innen Zeilenhöhe, Absatz-, Buchstaben- und Wortabstände auf die genannten Werte vergrößern, dürfen keine Inhalte oder Funktionen verloren gehen.

Offizielle Erklärung beim W3C

Das W3C erklärt jedes Erfolgskriterium ausführlich – mit Absicht, Beispielen und Techniken (auf Englisch).

Understanding 1.4.12 (öffnet in neuem Tab)