Ist Text auf dem Hintergrund lesbar?

Gestalterinnen und Ingenieure brauchen oft ein klares Ja oder Nein auf eine täuschend schlichte Frage: Ist diese Textfarbe in dieser Größe auf jenem Hintergrund wirklich lesbar? Ein Kontrastverhältnis allein entscheidet den Fall nicht, weil die Web Content Accessibility Guidelines großen Satz nachsichtiger behandeln als den Fließtext. Diese Prüfung nimmt eine Text-Hexfarbe, eine Hintergrund-Hexfarbe und eine Schriftgröße entgegen, stuft die Probe nach der veröffentlichten Regel von achtzehn Punkt oder vierzehn Punkt fett als normal oder large ein und vergleicht das offizielle Kontrastverhältnis der relativen Luminanz mit dem Minimum der von Ihnen gewünschten Stufe. Das Urteil ist ein boolesches Feld namens legible, dazu Verhältnis, Schwelle und Skalenklasse, damit Sie die Rechnung neben der Antwort zeigen können.

Wie die WCAG-Lesbarkeit nach der Größe entschieden wird

Die Web Content Accessibility Guidelines behandeln nicht jedes Zeichen gleich. Fließtext bei sechzehn Pixeln hat eine strengere Kontrastpflicht als eine Überschrift bei vierundzwanzig Pixeln, weil größere Buchstabenformen bei kleinerem Luminanzabstand lesbar bleiben. Diese Prüfung macht daraus ein einziges boolesches Urteil.

Sie zerlegt Textfarbe und Hintergrund als opakes sRGB-Hex, linearisiert jeden Achtbitkanal mit der amtlichen stückweisen Kurve und bildet die relative Luminanz mit den Gewichten 0.2126, 0.7152 und 0.0722. Das Kontrastverhältnis ist die hellere Luminanz plus 0.05 geteilt durch die dunklere plus 0.05. Zugleich rechnet sie die gelieferte Größe in CSS-Punkt um, wobei ein Punkt vier Drittel eines Pixels entspricht, und stuft die Probe als large ein, wenn sie mindestens achtzehn Punkt erreicht oder mindestens vierzehn Punkt beträgt und fett markiert ist.

Großer Satz braucht mindestens drei zu eins für AA und vier Komma fünf zu eins für AAA; normaler Satz braucht vier Komma fünf und sieben. Die angeforderte Stufe wählt eine dieser vier Schwellen. Das ungerundete Verhältnis wird mit der Schwelle verglichen, damit ein angezeigtes 4.50 kein 4.499 unter AA durchlässt.

Nichts wird aus CSS, Bildschirmfotos oder einer lebenden Seite abgeleitet: Sie nennen das Paar und die Größe und erhalten ein wiederholbares Urteil für Tickets, Design-Token und automatisierte Tore.

Wo eine Ja-Nein-Prüfung nach der Größe ihren Nutzen zeigt

Produktteams treffen diese Frage, wenn ein Markengrau auf einer Folie elegant wirkt, als sechzehn Pixel Fließtext auf einer weißen Karte aber scheitert, oder wenn eine Überschrift bei vierundzwanzig Pixeln AA bestünde, dasselbe Paar auf einem Formularetikett aber durchfiele. Gestalterinnen fügen ein Token-Hex, die Fläche dahinter und die Größe aus der Skala ein und lesen ein einziges Flag legible, bevor sie das Paar festziehen.

Ingenieure hängen den Vertrag an Pull-Request-Prüfungen, die ein Fließtext-Token sperren, wenn regelmäßige sechzehn Pixel unter 4.5 zu 1 fallen, und lassen einer Hero-Überschrift bei achtzehn Punkt trotzdem die Großtext-Schwelle von 3 zu 1. Fachleute für Qualität und Barrierefreiheit heften das Zahlenverhältnis, die eingestufte Skala und das boolesche Feld an Tickets, damit die Korrektur das echte Paar und die echte Größe trifft, nicht eine Vermutung vom Bildschirmfoto. Marketingteams prüfen Kampagnen-Hex gegen den Seitenhintergrund in der tatsächlichen Bildunterschriftgröße, nicht in einer angenommenen Überschriftengröße.

Auf dieser Seite läuft die Arbeit vollständig in Ihrem Browser. Koppeln Sie dieses Urteil mit einem ganzseitigen Barrierefreiheitsscanner, wenn Sie lebendes Markup durchsuchen müssen, und mit einer Kontrastverhältnis-Matrix, wenn Sie alle AA- und AAA-Flaggen beider Skalen auf einmal wollen. Nutzen Sie diese Seite, wenn die Suchabsicht genau lautet, ob jener Text in jener Größe auf jenem Hintergrund sicher ist.