Barrierefreiheit und Branding werden oft gegeneinander ausgespielt, als müsse eines nachgeben. Das eigentliche Problem ist viel enger. Dieser Beitrag richtet sich an Kommunikations- und Designteams, die für eine Palette verantwortlich sind und gehört haben, dass sie durchfällt.
Was der Standard verlangt
WCAG 2.2 verlangt für Text ein Kontrastverhältnis von mindestens 4,5:1 und für großen Text 3:1, wobei als groß mindestens 18 Punkt oder 14 Punkt fett gilt. Bedienelemente und bedeutungstragende Grafiken brauchen 3:1 gegenüber dem, was an sie angrenzt. Außerdem darf Farbe nicht das einzige Mittel sein, um Informationen darzustellen. Für Text, der Teil eines Logos oder Markennamens ist, gilt keine Kontrastanforderung.
Das ist der häufigste Fehler überhaupt. Die Studie von WebAIM aus dem Jahr 2026 zur Top-Million der Startseiten fand Text mit zu geringem Kontrast auf 83,9 % von ihnen, mit durchschnittlich 34 Fällen pro Seite.
“Die meisten Paletten scheitern nicht. Bestimmte Paarungen scheitern.”
Wie das bei einer echten Palette aussieht
Unser eigenes Logo verwendet sechs Farben, eine für jede Sprache in der Anzeige oben auf unserer Startseite. Auf Weiß erreicht das Blau 6,16:1, das Violett 5,72:1 und das Pink 4,84:1, alle drei könnten also Fließtext tragen. Das Orange erreicht 4,30:1, das Grün 4,38:1 und das Bernsteingelb 3,65:1. Diese drei scheitern bei kleinem Text und bestehen bei großem Text.
Wir haben die Farben nicht geändert. Wir haben ihre Aufgaben geändert. Alle sechs erscheinen in großen Schriftgraden und im Logo. Der gesamte kleine Text auf der Website ist fast schwarz oder dunkelgrau, bei 7,23:1 oder besser, selbst die kleine Bildunterschrift direkt über der farbigen Anzeige. Die Marke behält ihre Farbe, und niemand muss 14 Pixel großes Bernsteingelb lesen.
So prüfen Sie eine Palette
- Führen Sie jedes Paar auf: jede Textfarbe auf jedem Hintergrund, auf dem sie stehen wird, einschließlich Hover-Zuständen und Text über Fotos.
- Markieren Sie jedes Paar als geeignet für Fließtext, nur für großen Text geeignet oder durchgefallen.
- Geben Sie jeder Farbe anhand dieser Tabelle eine Aufgabe: Text, Großschrift, Fläche oder Dekoration.
- Wo eine Farbe kleinen Text tragen muss, dunkeln Sie sie leicht ab, statt sie zu ersetzen. Leserinnen und Leser erkennen den Farbton, nicht den exakten Wert.
- Finden Sie heraus, was allein die Farbe aussagt, etwa bei Links, Fehlern und Diagrammlinien, und ergänzen Sie eine Unterstreichung, ein Symbol oder eine Beschriftung.
Halten Sie es schriftlich fest
Eine Palette übersteht die Übergabe, wenn die Richtlinien sagen, was jede Farbe darf, nicht nur, welchen Wert sie hat. Nehmen Sie die Tabelle in den Markenleitfaden auf. Die nächste Person, die eine Kampagnenseite baut, muss es dann nicht selbst herausfinden, und die Marke sieht weiterhin aus wie sie selbst.