Zum Inhalt springen

Farbe und Kontrast standardkonform nutzen

Quiz Farbe und Kontrast standardkonform nutzen

Beispiel - Info:
  • Anspruch: vertiefen
  • Aufwand: 5 bis 15 Minuten
  • Zielgruppe: Entwicklung
Foto eines Bildschirms mit einer Liste von Web-Farben.

Ein trickiges Quiz für Web-Entwickler*innen und Entwickler*innen von App-Oberflächen. Alle Fragen des Quiz drehen sich um die beiden Anforderungen 1.4.1 und 1.4.11 der „Web Content Accessibility Guidelines (WCAG) 2.1“. Diese Anforderungen müssen beispielsweise von Angeboten, die die Barrierefreie-Informationstechnik-Verordnung (BITV) erfüllen müssen, eingehalten werden. Dadurch können unter anderem Menschen mit einer Sehbehinderung oder Farbfehlsichtigkeit die Inhalte barrierefrei wahrnehmen und bedienen. Die Anforderungen sind auch Teil der DIN EN 301 549.

Die beiden Anforderungen legen Mindestanforderungen an den Kontrast von Nicht-Text-Inhalten fest und regeln die barrierefreie Verwendung von Farbe.

In den WCAG 2.1 lautet das in der DIN EN 301 549 als „9.1.4.1 Benutzung von Farbe“ zu findende Erfolgskriterium:

Success Criterion 1.4.1 Use of Color (Level A)
Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.“

Und das eng damit verbundene Kriterium der DIN EN 301 549 „9.1.4.11 Nicht-Text-Kontrast“ lautet in den WCAG 2.1:

Success Criterion 1.4.11 Non-text Contrast (Level AA)
The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s):

  • User Interface Components: Visual information required to identify user interface components and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author;
  • Graphical Objects: Parts of graphics required to understand the content, except when a particular presentation of graphics is essential to the information being conveyed.“

Die 20 Fragen des Quiz mit den dazugehörigen Musterlösungen sind in englischer Sprache verfasst, aber dank der gut gestalteten Beispiele und gut erklärten korrekten Antworten leicht verständlich.

Testen Sie Ihr Wissen in diesem Quiz und lernen Sie spielerisch mehr über barrierefreies Design!