Zum Inhalt springen
44 Barrierefreiheit Dokumentation

1.4.12 - Anpassungen von Textabständen ermöglichen

AA 2.1 Design, Umsetzung

Ziel

Sicherstellen, dass Benutzer den Textabstand anpassen können, um das Lesen zu erleichtern, ohne dass Inhalte oder Funktionalitäten verloren gehen.

Beschreibung

  • Inhalte müssen so gestaltet sein, dass Benutzer Textabstände wie Zeilenhöhe, Buchstabenabstand, Wortabstand und Absatzabstand anpassen können.
  • Änderungen an den Textabständen dürfen nicht zu abgeschnittenen oder überlappenden Texten führen.
  • Die Mindestanforderungen sind:
    • Zeilenhöhe: mindestens 1,5-fache Schriftgröße.
    • Absatzabstand: mindestens doppelt so groß wie die Schriftgröße.
    • Buchstabenabstand: mindestens 0,12-mal die Schriftgröße.
    • Wortabstand: mindestens 0,16-mal die Schriftgröße.

Anforderungen

  • Entwickeln Sie Layouts, die sich flexibel an verschiedene Textabstände anpassen können. Es bedeutet nicht, dass das Styling der Schrift für die normale Darstellung direkt an die Mindestanforderungen angepasst werden muss. Stattdessen sollten die Designs sicherstellen, dass der Textabstand flexibel anpassbar ist, ohne dass Inhalte oder Funktionalität verlieren.

Code-Beispiele

Mindestanforderungen für Textabstände in CSS:
body {
  font-family: Arial, sans-serif;
  line-height: 1.5; /* Zeilenhöhe */
  letter-spacing: 0.12em; /* Buchstabenabstand */
  word-spacing: 0.16em; /* Wortabstand */
  margin-bottom: 2ex; /* Absatzabstand */
}
Flexibles Layout für anpassbare Textabstände:
.container {
  max-width: 100%;
  padding: 1em;
  box-sizing: border-box;
}


p {
  line-height: 1.5;
  margin-bottom: 2ex;
}