Der Prüfschritt ist anwendbar, wenn informationstragende grafische Bedienelemente oder informationstragende Grafiken vorhanden sind.

Wie wird geprüft

Prüfen, ob für informationstragende Grafiken oder Bedienelemente in allen verfügbaren Interaktionszuständen (Aktivierung, Fokussierung) zu den angrenzenden Farben ein Kontrastverhältnis von 3:1 vorliegt.

Die Anforderung gilt nicht für

  • Bedienelemente, die aktuell nicht zur Verfügung stehen und „ausgegraut“ dargestellt sind
  • Symbole, die mit ausreichendem Kontrast beschriftet sind
  • Symbole, bei denen eine bestimmte Farbgestaltung wesentlich ist, z. B. für Logos und Bilder

Testvorgehen

  • Die APP im Standard-Hellmodus verwenden.
  • Screenshots erstellen und an einen Rechner übermitteln.
  • Screenshots mit Hilfe eines Kontrastanalyse-Programms untersuchen.
  • Alternativ können Kontraste mit Hilfe von Analyse-Tools (bspw. Accessibility Scanner oder axe for Android) untersucht werden. Gefundene Probleme müssen unbedingt nachverifiziert werden.
  • Sollten die geforderten Kontrastwerte im Hellmodus nicht erreicht werden, muss die Prüfung erneut im Dunkelmodus durchgeführt werden. Sollten die geforderten Kontrastwerte auch im Dunkelmodus nicht erreicht werden, muss die Prüfung erneut im erhöhtem Kontrastmodus durchgeführt werden. Sofern ein Modus vollumfänglich die geforderten Werte erreicht, gilt der Prüfschritt als erfüllt.

Teil-Automatisiertes Testvorgehen

Zum Messen von Kontrasten stehen mittlerweile für das Betriebssystem Android verschiedene Analyse-Tools von Drittanbietern zur Verfügung (Stand Mai 2021). Auf die Qualität der Ergebnisse wird hier nicht detailliert eingegangen.

  • Accessibility Scanner
  • Axe for Android
  • Microsoft Accessibility Insights

Beispiele

  • Tasten oder Eingabefelder sind durch einen Rahmen identifizierbar, der deutlich sichtbar ist.
  • Bedienelemente besitzen einen ausreichenden Kontrast zum Hintergrund oder einen deutlichen Rahmen.

Beispiele sind bei W3C zu finden: Understanding Success Criterion 1.4.11: Non-text Contrast

Anforderung (Beschreibung)

Die visuelle Darstellung der folgenden Elemente hat ein Kontrastverhältnis von mindestens 3:1 zu benachbarten Farben:

  • Komponenten der Benutzeroberfläche
    Visuelle Informationen, die erforderlich sind, um Komponenten und Zustände der Benutzeroberfläche zu identifizieren, mit Ausnahme inaktiver Komponenten oder wenn das Erscheinungsbild der Komponente vom Useragenten bestimmt und vom Autor nicht geändert wird.
  • Grafische Objekte
    Teile von Grafiken sind erforderlich, um den Inhalt zu verstehen, es sei denn, eine bestimmte Präsentation von Grafiken ist für die übermittelten Informationen wesentlich.

Warum wird das geprüft

Nutzer mit einer Sehbehinderung benötigen ausreichende Kontraste, um grafische Bedienelemente oder deren Zustände wahrnehmen zu können.

Einordnung (Abgrenzung)

Der Kontrast von Texten ist Bestandteil von Prüfschritt 1.4.3.

Verweise (Referenzen)

  • EN 301549 v3.2.1 Kapitel 11.1.4.11 Non-text contrast
  • WCAG v2.1 Kapitel 1.4.11 Non-text contrast