Barrierefreiheit: Deinen Text und deine Grafiken vorbereiten
2 Min. Lesezeit
Besucher mit eingeschränkter Sehkraft können es schwierig finden, den Unterschied zwischen dem Vordergrund und dem Hintergrund der Seiten deiner Website zu erkennen. Um die Zugänglichkeit für sie zu verbessern, empfehlen wir Folgendes:
- Die Text- und Hintergrundfarbe des Kontrasts zu einem Verhältnis von 4.5:1 für normalen Text und 3:1 für großen Text ändern.
- Ein Kontrastverhältnis von mindestens 3:1 für Grafiken und Komponenten der Benutzeroberfläche (z. B. Eingabefelder, Platzhalter usw.).
- Level AAA erfordert ein höheres Kontrastverhältnis von mindestens 7:1 für normalen Text und 4.5:1 für großen Text.
Hinweis:
Großer Text ist definiert als über 14 Punkte (ca. 18px) und fett oder 18 Punkte (ca. 24px).
Farbkontraste testen
Es gibt zahlreiche Websites und Browser-Plugins wie Contrast Checker, das den Farbkontrast testet, indem es die Vordergrund- und Hintergrundfarben vergleicht (anhand der Farbcodes). Um den Farbkontrast für den Text über einem Hintergrundbild zu überprüfen, empfehlen wir dir den Colour Contrast Analyser zu verwenden, mit dem du die Hintergrundfarbe auswählen und testen kannst.
Farbcodes im Editor finden
Farbcodes bei Wix ADI finden
Den Farbkontrast im Wizard für Barrierefreiheit anpassen
Hast du Diagramme oder Daten auf deiner Website?
Kontrastreiche Farben sind eine großartige Möglichkeit, Daten auf deiner Website anzuzeigen. Wir empfehlen jedoch auch die andere Indikatoren zu verwenden (z. B. Texturen und Muster), um zwischen den Informationen zu unterscheiden.
Nächster Schritt:
Gehe zurück zur Checkliste für Barrierefreiheit, um die Barrierefreiheit deiner Website weiter zu verbessern.
War das hilfreich?
|