1.4.3 - Kontrast (Minimum)
AA 2.0
Design
Ziel
Sicherstellen, dass Texte und Bilder von Text einen ausreichenden Kontrast zum Hintergrund aufweisen, um die Lesbarkeit für Menschen mit eingeschränktem Sehvermögen zu gewährleisten.
Beschreibung
- Text und Textbilder müssen ein Kontrastverhältnis von mindestens 4,5:1 zwischen Vordergrund- und Hintergrundfarbe aufweisen.
- Ausnahmen:
- Großer Text: Mindestkontrast von 3:1 für Texte ab 18pt (oder 14pt fett) und deren Bilder.
- Nebensächlicher Text: Dekorative, inaktive oder unsichtbare Texte sowie Texte innerhalb von Bildern, die primär andere visuelle Inhalte darstellen, sind ausgenommen.
- Logotypen: Text als Bestandteil von Logos oder Markennamen unterliegt keinen Kontrastanforderungen.
Anforderungen
- Farben mit ausreichendem Kontrast in der Gestaltung verwenden, insbesondere für Textelemente, Buttons und Links.
- Farbpaletten berücksichtigen, die auch bei Farbfehlsichtigkeit gut lesbar sind.
- Kontrasttests während der Gestaltung durchführen, um die Anforderungen zu erfüllen.
- Für große Schriftarten, ab 18 px oder 14 px fett, ein Kontrastverhältnis von mindestens 3:1 gewährleisten.
- Sicherstellen, dass die HTML- und CSS-Farbdefinitionen ein Kontrastverhältnis von mindestens 4,5:1 aufweisen.
- Verwendung von Tools wie Farbmessern oder automatisierten Test-Tools zur Überprüfung von Kontrastwerten.
- Texte auf komplexen Hintergrundbildern so platzieren, dass ausreichender Kontrast gegeben ist (z. B. durch Überlagerung mit einem Farbfilter).
- Bei der Einbindung von Bildern von Text sicherstellen, dass diese die Kontrastanforderungen erfüllen.
- Überprüfung aller Text- und Hintergrundfarben mit Kontrastanalysetools.
- Manuelle Tests bei Texten auf grafischen Hintergründen durchführen, um sicherzustellen, dass der Kontrast ausreicht.
- Validierung der Kontrastverhältnisse in unterschiedlichen Anzeigegeräten und Bildschirmauflösungen.
Code-Beispiele
Beispiel für Text mit ausreichendem Kontrast:
<p style="color: #000000; background-color: #FFFFFF;">Schwarzer Text auf weißem Hintergrund (Kontrastverhältnis 21:1).</p>