WCAG-Erfolgskriterien · Level AAA

WCAG 1.4.6: Kontrast (erweitert)

WCAG 1.4.6 verlangt ein minimales Kontrastverhältnis von 7:1 für normalen Text und 4,5:1 für großen Text zwischen Vorder- und Hintergrundfarben und geht damit über den AA-Grenzwert hinaus, um die Lesbarkeit für Nutzer mit Sehbeeinträchtigungen, Farbsehschwächen oder solche in schwierigen Lichtverhältnissen sicherzustellen.

Was diese Regel bedeutet

WCAG 1.4.6 Kontrast (erweitert) ist ein Erfolgskriterium der Stufe AAA unter Richtlinie 1.4 (Unterscheidbar). Es verlangt, dass die visuelle Darstellung von Text und Textbildern ein Kontrastverhältnis von mindestens 7:1 gegenüber ihrem Hintergrund aufweist. Für großen Text – definiert als mindestens 18pt (ungefähr 24px) bei normaler Schriftstärke oder mindestens 14pt (ungefähr 18,67px) bei fetter Schrift – beträgt das erforderliche Kontrastverhältnis mindestens 4,5:1. Dies ist ein deutlicher Schritt über das Erfolgskriterium 1.4.3 der Stufe AA hinaus, das nur 4,5:1 für normalen Text und 3:1 für großen Text verlangt.

Das Kontrastverhältnis wird anhand der relativen Leuchtdichte der beiden beteiligten Farben berechnet, wie in der WCAG-Spezifikation definiert. Die Formel berücksichtigt die linearen RGB-Werte der Vorder- und Hintergrundfarben, um ein Verhältnis von 1:1 (kein Kontrast, identische Farben) bis 21:1 (maximaler Kontrast, Schwarz auf Weiß oder Weiß auf Schwarz) zu erzeugen.

Dieses Kriterium gilt für allen gerenderten Text in der Benutzeroberfläche, einschließlich Text in Bildern, Icons mit Text und Text, der in Canvas-Elementen gerendert wird, sofern die gerenderte Ausgabe zugänglich ist. Es betrifft Überschriften, Fließtext, Beschriftungen, Platzhaltertext in Formularfeldern, wenn er sinnvolle Informationen vermittelt, Button-Beschriftungen, Linktexte, Navigationselemente und alle anderen textlichen Inhalte, die auf dem Bildschirm sichtbar sind.

WCAG 1.4.6 teilt die gleichen offiziellen Ausnahmen wie Kriterium 1.4.3. Die folgenden Punkte sind ausdrücklich von der Anforderung ausgenommen:

  • Inzidenteller Text: Text oder Textbilder, die rein dekorativ sind, die für niemanden sichtbar sind oder die Teil eines Bildes sind, das wesentliche andere visuelle Inhalte enthält. Ein Beispiel wäre Text, der im Hintergrund eines als Dekoration verwendeten Fotos sichtbar ist.
  • Logotypen: Text, der Teil eines Logos oder Markennamens ist, unterliegt keiner Kontrastanforderung. Dies gilt nur für den Wortmarken-Teil des Firmenlogos, nicht für angrenzenden Fließtext oder UI-Beschriftungen.
  • Inaktive Benutzeroberflächenkomponenten: Text in deaktivierten Formularelementen, deaktivierten Buttons oder anderen Interface-Elementen, die derzeit nicht bedienbar sind, ist ausgenommen. Diese Ausnahme sollte jedoch sparsam angewendet werden – inaktive UI sollte immer noch ausreichend wahrnehmbar sein, um ihre Existenz zu vermitteln.

Ein Bestehen unter diesem Kriterium bedeutet, dass jede Instanz von Textinhalt, die nicht ausdrücklich ausgenommen ist, das Verhältnis von 7:1 (oder 4,5:1 für großen Text) erreicht oder übertrifft. Ein Nichtbestehen tritt ein, wenn irgendein nicht ausgenommener Text unter diese Schwellenwerte fällt, selbst mit einem kleinen Abstand. Der Kontrast muss in allen unterstützten Zuständen – Hover, Fokus, Aktiv, Besuchter Link – bestehen, da das Kriterium auf die gerenderte Darstellung in jedem dieser Zustände angewendet wird.

Warum es wichtig ist

Laut Weltgesundheitsorganisation leben weltweit etwa 2,2 Milliarden Menschen mit einer Form von Sehbeeinträchtigung. Hunderte Millionen von ihnen haben Erkrankungen, die die Fähigkeit, Farben zu unterscheiden oder kontrastarmen Text wahrzunehmen, direkt beeinträchtigen, darunter Katarakte, Glaukom, Makuladegeneration und verschiedene Formen von Farbsehschwäche. Für diese Bevölkerungsgruppe können Benutzeroberflächen, die nur die AA-Kontrastschwelle von 4,5:1 erfüllen, weiterhin erhebliche Hürden beim Lesen und Verstehen darstellen.

Das durch dieses Kriterium geforderte Verhältnis von 7:1 ist speziell darauf abgestimmt, den Kontrastempfindlichkeitsverlust zu berücksichtigen, der mit alternden Augen und häufigen Sehbehinderungen einhergeht. Forschungen in der Sehwissenschaft zeigen, dass eine Person mit moderat reduzierter Kontrastempfindlichkeit – ungefähr vergleichbar mit einer Person mit 20/80-Sehschärfe mit Korrektur – eine effektive Kontrastreduktion von etwa drei zu eins erleben kann. Ein Designverhältnis von 7:1 liefert nach dieser wahrnehmungsbedingten Reduktion immer noch ungefähr 2,3:1 wahrgenommenen Kontrast, was nahe an der Mindestschwelle liegt, ab der Text lesbar wird. Ohne diesen Spielraum können solche Nutzer möglicherweise überhaupt nicht in der Lage sein, den Inhalt zu lesen.

Betrachten Sie ein Szenario aus der Praxis: Eine 68-jährige Bankkundin oder ein 68-jähriger Bankkunde verwaltet an einem hellen Nachmittag die Finanzen online, während Sonnenlicht vom Laptopbildschirm reflektiert. Selbst bei klinisch voll funktionsfähigem Sehvermögen können Blendung und die natürliche Verringerung der Kontrastempfindlichkeit im Alter dazu führen, dass mittelgrauer Text auf weißem Hintergrund völlig unleserlich wird. Ein Design, das unter normalen Bedingungen 7:1 Kontrast erreicht, bleibt in diesem Kontext nutzbar; eines, das gerade so 4,5:1 erreicht, nicht.

Über die behinderungsspezifischen Auswirkungen hinaus profitieren praktisch alle Nutzerinnen und Nutzer in suboptimalen Leseumgebungen von kontrastreichem Text: helles Sonnenlicht im Freien, abgenutzte Bildschirme mit reduzierter Hintergrundbeleuchtung, monochrome E‑Ink-Displays und minderwertige Projektoren in Besprechungsräumen. Die erhöhte Kontrastanforderung stellt daher nicht nur eine Verbesserung der Barrierefreiheit dar, sondern ein breites Usability-Upgrade.

Aus Sicht der Suchmaschinenoptimierung korreliert kontrastreicher Text tendenziell mit saubereren, stärker strukturierten typografischen Hierarchien. Auch wenn Suchmaschinen den Kontrast nicht direkt messen, führt die gestalterische Disziplin, die erforderlich ist, um AAA-Kontraststandards zu erfüllen, typischerweise zu Seiten mit stärkerer visueller Hierarchie und besseren Lesbarkeitswerten, was zu niedrigeren Absprungraten und längeren Verweildauern beiträgt – Signale, die die SEO-Performance indirekt verbessern.

Verwandte Axe-core-Regeln

  • color-contrast-enhanced: Dies ist die primäre axe-core-Regel, die mit WCAG 1.4.6 verknüpft ist. Sie bewertet die berechneten Vorder- und Hintergrundfarben aller Textknoten im DOM und berechnet ihr Kontrastverhältnis mithilfe der WCAG-Leuchtdichteformel. Die Regel markiert jedes Textelement, bei dem das Kontrastverhältnis unter 7:1 für normal großen Text oder unter 4,5:1 für großen Text liegt (wie durch berechnete Schriftgröße und Schriftstärke definiert). Sie meldet das tatsächlich gefundene Verhältnis, das erforderliche Verhältnis und das verantwortliche Element, was die Behebung unkompliziert macht. Die Regel unterscheidet zwischen normalem und großem Text anhand der gleichen von WCAG definierten Größen: 18pt (24px) bei normaler Schriftstärke und 14pt (18,67px) bei fetter Schrift.
  • Einschränkungen, die manuelle Tests erfordern: Automatisierte Regeln wie color-contrast-enhanced können Kontrastfehler in mehreren wichtigen Szenarien nicht erkennen. In <canvas>-Elementen gerenderter Text ist für den DOM-basierten Scanner unsichtbar und erfordert eine manuelle visuelle Prüfung. Text, der über Farbverläufen oder fotografischen Hintergründen liegt, stellt eine besonders schwierige Herausforderung dar: Das Kontrastverhältnis variiert über den Text hinweg, je nachdem, welcher Teil des Verlaufs oder Bildes hinter jedem Buchstaben liegt. Automatisierte Tools entnehmen in diesen Fällen typischerweise eine einzelne Hintergrundfarbe oder melden unklare Ergebnisse. Text, der seine Farbe bei Hover oder Fokus ändert, muss ebenfalls in jedem interaktiven Zustand manuell getestet werden, da automatisierte Scans in der Regel nur den standardmäßig gerenderten Zustand erfassen. Zusätzlich kann Text, dessen Kontrast von CSS-Custom-Properties abhängt, die zur Laufzeit über JavaScript aufgelöst werden, bei einem statischen Scan möglicherweise nicht bewertet werden.

Wie man testet

  1. Automatischer Scan mit axe DevTools: Installieren Sie die Browsererweiterung axe DevTools (Chrome oder Firefox). Öffnen Sie die Zielseite, aktivieren Sie die Erweiterung und führen Sie einen Scan der gesamten Seite durch. Filtern Sie im Ergebnis-Panel nach der Regel-ID color-contrast-enhanced oder suchen Sie in der Problemliste nach „enhanced“. Für jedes markierte Element zeigt das Panel das Element, das tatsächliche Kontrastverhältnis und das erforderliche Verhältnis an. Notieren Sie alle Elemente, die als „Überprüfung erforderlich“ und nicht als eindeutiges Bestehen oder Nichtbestehen gemeldet werden – diese betreffen typischerweise berechnete Hintergründe, die nicht aufgelöst werden konnten und eine manuelle Überprüfung erfordern.
  2. Automatischer Scan mit Lighthouse: Öffnen Sie die Chrome DevTools, navigieren Sie zum Lighthouse-Tab und führen Sie ein Accessibility-Audit durch. Lighthouse verwendet intern axe-core, sodass dieselben color-contrast-enhanced-Verstöße angezeigt werden. Der Bericht gruppiert sie unter „Accessibility“ und verlinkt auf jedes fehlerhafte Element. Beachten Sie, dass Lighthouse die Seite in ihrem Standardzustand prüft und keine interaktiven Zustände wie Hover oder Fokus testet.
  3. Manuelle Farbabtastung: Verwenden Sie den Farbwähler der Entwicklerwerkzeuge des Browsers oder ein spezielles Tool wie den Colour Contrast Analyser (TPGi), um die Vorder- und Hintergrundfarben von Textelementen manuell zu erfassen. Dies ist besonders wichtig für Text über Bildern, Verläufen oder halbtransparenten Hintergründen. Entnehmen Sie mehrere Punkte entlang des Textes, an denen sich der Hintergrund ändert, und prüfen Sie, ob das minimale Kontrastverhältnis über alle entnommenen Punkte hinweg 7:1 für normalen Text oder 4,5:1 für großen Text erreicht.
  4. Testen interaktiver Zustände: Erzwingen Sie mit den DevTools des Browsers die Zustände Hover, Fokus, Aktiv und Besuchter Link für Elemente (über das :hov-Panel in Chrome DevTools oder ein entsprechendes Werkzeug). Führen Sie in jedem Zustand die Kontrastprüfung erneut durch, um sicherzustellen, dass Farbänderungen, die über CSS-Pseudoklassen angewendet werden, keine Kontrastfehler einführen. Achten Sie besonders auf Zustände „Besucht“ bei Links, Hover-Zustände von Buttons und Fokusindikatoren von Formularfeldern.
  5. Screenreader-Überprüfung (NVDA + Firefox): Auch wenn Screenreader den Kontrast nicht direkt testen, bestätigt die Überprüfung, dass Text für NVDA zugänglich ist, dass es sich um echten Text im DOM handelt (nicht um ein Textbild ohne Alternative). Starten Sie Firefox, öffnen Sie NVDA und navigieren Sie mit dem Lesecursor durch die Seite. Jeder Text, den NVDA nicht lesen kann, sollte untersucht werden, um festzustellen, ob es sich um ein Textbild handelt, das eine Kontrastprüfung auf Bildebene erfordert.
  6. Screenreader-Überprüfung (VoiceOver + Safari auf macOS): Aktivieren Sie VoiceOver mit Command+F5 und navigieren Sie mit VO+Rechtspfeil durch die Seite. Wie bei NVDA kann Text, den VoiceOver überspringt oder falsch liest, auf eine nicht standardmäßige Textrendering-Methode hinweisen, die eine manuelle Kontrastprüfung erfordert.
  7. Graustufen-Simulation: Aktivieren Sie den Graustufen-Anzeigemodus über die Bedienungshilfen-Einstellungen des Betriebssystems (verfügbar unter Windows, macOS, iOS und Android). Dadurch werden alle Farbinformationen entfernt und Kontrastunterschiede sofort sichtbar. Text, der im Graustufenmodus schwer lesbar wird, verfehlt mit hoher Wahrscheinlichkeit die Anforderungen an den erweiterten Kontrast.

Wie man es behebt

Fließtext auf hellem Hintergrund – falsch

<!-- Fails 1.4.6: #767676 on #ffffff yields approximately 4.54:1,
     which passes AA (1.4.3) but falls far short of the 7:1 AAA requirement -->
<p style='color: #767676; background-color: #ffffff;'>
  Please review our terms and conditions before proceeding.
</p>

Fließtext auf hellem Hintergrund – korrekt

<!-- Passes 1.4.6: #595959 on #ffffff yields approximately 7.0:1,
     meeting the enhanced contrast requirement for normal-weight body text -->
<p style='color: #595959; background-color: #ffffff;'>
  Please review our terms and conditions before proceeding.
</p>

Farbige Überschrift auf Markenhintergrund – falsch

<!-- Fails 1.4.6: brand blue #4A90D9 on white #ffffff yields approximately 3.0:1.
     Even though this is a heading and may appear large, bold headings at
     common web sizes (e.g. 20px bold) may not qualify as WCAG "large text"
     depending on rendering, and 3.0:1 fails even the large-text 4.5:1 threshold -->
<h2 style='color: #4A90D9; background-color: #ffffff;'>
  Welcome to Our Services
</h2>

Farbige Überschrift auf Markenhintergrund – korrekt

<!-- Passes 1.4.6: dark navy #1A3A5C on white #ffffff yields approximately 12.6:1.
     Exceeds the 7:1 requirement for normal text and comfortably surpasses
     the 4.5:1 large-text requirement. Brand identity is preserved through
     the use of a darker shade within the same hue family. -->
<h2 style='color: #1A3A5C; background-color: #ffffff;'>
  Welcome to Our Services
</h2>

Text über einem Verlaufshintergrund – falsch

<!-- Fails 1.4.6: The gradient transitions from a dark color that provides
     adequate contrast on the left to a light color that provides insufficient
     contrast on the right. Text spanning the full width will fail at some point. -->
<div style='background: linear-gradient(to right, #1a1a1a, #cccccc); padding: 20px;'>
  <p style='color: #ffffff;'>Create your account today and get started.</p>
</div>

Text über einem Verlaufshintergrund – korrekt

<!-- Passes 1.4.6: A semi-transparent dark overlay behind the text ensures
     that foreground text maintains at least 7:1 contrast regardless of
     the underlying gradient value at any point beneath the text block. -->
<div style='background: linear-gradient(to right, #1a1a1a, #cccccc); padding: 20px;'>
  <p style='color: #ffffff; background-color: rgba(0,0,0,0.75); padding: 8px 12px; display: inline-block;'>
    Create your account today and get started.
  </p>
</div>

Platzhaltertext in Formulareingabe – falsch

<!-- Fails 1.4.6: default browser placeholder styling is typically around
     #aaaaaa on white, yielding approximately 2.32:1. If placeholder text
     conveys meaningful information (e.g. format hints), it must meet contrast requirements. -->
<input type='text' placeholder='DD/MM/YYYY' style='background: #ffffff;'>

Platzhaltertext in Formulareingabe – korrekt

<!-- Passes 1.4.6: Override the default placeholder color to achieve 7:1 contrast.
     Also adds a visible label as best practice, since placeholders disappear on input. -->
<label for='dob'>Date of Birth</label>
<input type='text' id='dob' placeholder='DD/MM/YYYY'
  style='background: #ffffff; color: #000000;'>
<style>
  input::placeholder {
    color: #595959; /* approximately 7.0:1 on white — meets AAA */
  }
</style>

Häufige Fehler

  • Sich ausschließlich auf AA-konforme Farbkombinationen verlassen, ohne AAA-Schwellen zu prüfen: Viele Designer verwenden das verbreitete Mittelgrau #767676 auf Weiß, das 1.4.3 mit etwa 4,54:1 besteht, aber 1.4.6 mit deutlichem Abstand verfehlt. Prüfen Sie immer gegen das Ziel 7:1, nicht nur 4,5:1.
  • Annehmen, dass Ausnahmen für großen Text zu breit gelten: Die Ausnahme für großen Text (4,5:1 statt 7:1) gilt nur für Text, der mindestens 18pt (24px) bei normaler Schriftstärke oder mindestens 14pt (18,67px) bei fetter Schrift ist. Text mit 20px bei normaler Schriftstärke qualifiziert sich nicht und muss weiterhin 7:1 erreichen.
  • Kontrast in interaktiven Zuständen ignorieren: Eine hellere Farbe bei Hover anwenden, um eine visuelle Affordanz zu schaffen, ohne zu prüfen, ob der Hover-Zustand weiterhin 7:1 erreicht. Beispielsweise kann das Abdunkeln eines Button-Hintergrunds bei Hover bei gleichbleibendem Weiß im Text weiterhin bestehen, aber das Aufhellen des Textes bei Hover führt häufig zu Fehlern.
  • CSS-Custom-Property-Ketten übersehen: Eine Textfarbe als var(--color-primary) definieren, wobei --color-primary global gesetzt, aber lokal im Komponenten-Scope überschrieben wird, ohne den Kontrast erneut zu prüfen. Die effektiv gerenderte Farbe kann vom globalen Token-Wert abweichen und in bestimmten Komponenten-Kontexten zu einem fehlerhaften Verhältnis führen.
  • Die Ausnahme für deaktivierte Zustände als Freibrief für das Design behandeln: Die Ausnahme für inaktive UI als Rechtfertigung nutzen, deaktivierte Elemente mit 1:1-Kontrast (unsichtbarer Text) zu gestalten, sodass Nutzerinnen und Nutzer nicht erkennen können, dass ein Feld überhaupt existiert. Deaktivierte Elemente sollten weiterhin visuell wahrnehmbar sein, auch wenn sie von der 7:1-Anforderung ausgenommen sind.
  • Text über Bildern oder Videos nicht testen: Text direkt über einem Hero-Bild oder Video-Hintergrund platzieren und den Kontrast nur gegen die durchschnittliche Farbe prüfen, statt gegen den hellsten Bildbereich, den der Text überdeckt. Das minimale Kontrastverhältnis muss für jedes Pixel unter dem Text gelten, nicht im Durchschnitt.
  • Kontrastkorrekturen nur an Desktop-Breakpoints anwenden: Responsive Designs, die an mobilen Breakpoints andere Hintergrundfarben verwenden – zum Beispiel der Wechsel von einem weißen Desktop-Hintergrund zu einem hellbeigen Kartenhintergrund – können auf kleineren Bildschirmgrößen neue Kontrastfehler einführen, die bei Desktop-Tests nicht vorhanden waren.
  • Kontrast des Fokusindikator-Textes vergessen: Wenn ein benutzerdefinierter Fokusring oder Fokuszustand sowohl den Hintergrund als auch die Textfarbe eines fokussierten Elements ändert, muss die neue Text-zu-Hintergrund-Kombination im Fokuszustand das Verhältnis von 7:1 unabhängig vom Standardzustand erfüllen.
  • Annehmen, dass die Logo-Ausnahme auf angrenzenden beschreibenden Text ausgeweitet werden kann: Einen Slogan oder eine Produktbeschreibung im selben typografischen Block wie ein Markenlogo platzieren und die Logo-Ausnahme für den gesamten Block beanspruchen. Die Ausnahme gilt strikt für Text, der integraler Bestandteil des Logos selbst ist, nicht für nahegelegenen Fließtext.
  • Kontrast nach Überschreiben durch CSS-Frameworks nicht validieren: Eine Drittanbieter-Komponentenbibliothek oder ein CSS-Framework importieren, das Textfarben mit Werten unter 7:1 zurücksetzt oder überschreibt, und diese Defaults ohne Audit ausliefern. Framework-Defaults sind fast nie auf AAA-Kontraststandards kalibriert.

Bezug zu den Barrierefreiheitsvorschriften der Türkei

Die Präsidialverfügung 2025/10 der Türkei, veröffentlicht im Amtsblatt Nr. 32933 am 21. Juni 2025, legt verbindliche Anforderungen an die digitale Barrierefreiheit für eine breite Palette von Institutionen und Organisationen fest, die in der Türkei tätig sind. Die Verfügung schreibt die Konformität mit WCAG 2.2 auf Stufe AA als Basisstandard vor. Zu den erfassten Einrichtungsarten gehören öffentliche Institutionen und Behörden, E‑Commerce-Plattformen, Banken und Finanzdienstleister, Krankenhäuser und Gesundheitseinrichtungen, Telekommunikationsunternehmen mit 200.000 oder mehr Abonnenten, Reisebüros, private Transportunternehmen und Privatschulen, die vom Bildungsministerium (MoNE) autorisiert sind.

WCAG 1.4.6 Kontrast (erweitert) ist ein Kriterium der Stufe AAA und daher keine zwingende Anforderung nach der Präsidialverfügung. Organisationen, die nur die Konformität der Stufe AA – den gesetzlich vorgeschriebenen Basisstandard – erreichen, verstoßen nicht gegen die Verfügung, wenn sie die Anforderung des erweiterten Kontrasts von 7:1 nicht erfüllen, sofern sie die AA-Schwelle von 4,5:1 für normalen Text gemäß Kriterium 1.4.3 einhalten.

Die Erreichung der AAA-Konformität beim Kontrast stellt jedoch ein bedeutendes Bekenntnis zu inklusivem Design dar, das weit über die minimale rechtliche Compliance hinausgeht. Für öffentliche Institutionen, die die weitreichendste Verpflichtung haben, allen Bürgerinnen und Bürgern unabhängig vom Behinderungsstatus zu dienen, signalisiert die freiwillige Übernahme des erweiterten Kontraststandards ein echtes Engagement für universellen Zugang. Gesundheitseinrichtungen und Krankenhäuser – Bereiche, in denen Patientinnen und Patienten möglicherweise bereits unter körperlichem oder kognitivem Stress stehen oder in herausfordernden Bedingungen wie heller klinischer Beleuchtung mit digitalen Systemen interagieren – haben einen besonders starken praktischen Grund, die minimale Kontrastschwelle zu übertreffen. Ebenso sind Banken und Finanzdienstleister, deren Kundschaft zunehmend ältere Menschen umfasst, gut positioniert, von der Glaubwürdigkeit und dem Vertrauen der Nutzerinnen und Nutzer zu profitieren, das die Einhaltung des AAA-Kontrasts vermittelt.

Organisationen, die eine ISO-30071-1-Zertifizierung, eine Angleichung an die europäische EN 301 549 oder ein internationales Beschaffungsverfahren anstreben, in dem der Reifegrad der Barrierefreiheit bewertet wird, werden feststellen, dass die Konformität mit dem AAA-Kontrast ihre Position stärkt. Da sich die Durchsetzung digitaler Barrierefreiheit weltweit und speziell in der Türkei weiterentwickelt, sind Kriterien, die derzeit auf Stufe AAA angesiedelt sind, in der Vergangenheit in aufeinanderfolgenden regulatorischen Aktualisierungen tendenziell in den Pflichtbereich übergegangen. Die frühzeitige Einführung des erweiterten Kontrasts positioniert Organisationen vor wahrscheinlichen zukünftigen Anforderungen und reduziert die Kosten späterer Nachbesserungen.

Für Organisationen, die das Accsible-Overlay-SDK verwenden, können die Kontrasteinstellungswerkzeuge der Plattform den Nutzenden helfen, auf Widget-Ebene Hochkontrastmodi anzuwenden und so eine kompensierende Ebene bereitstellen, die die Lücke zwischen den Kontrastwerten des veröffentlichten Designs und den individuellen Bedürfnissen der Nutzenden überbrückt. Dies ersetzt nicht die Erfüllung des Kriteriums auf Quellcode-Ebene, bietet aber eine sinnvolle Laufzeitunterstützung für Nutzende, die erhöhten Kontrast benötigen und Websites besuchen, die noch keine vollständige AAA-Konformität erreicht haben.