Was wird geprüft?
Über Farben vermittelte Informationen sollen auch ohne Wahrnehmung der Farbe verfügbar sein, also zusätzlich durch andere Mittel (etwa Fettung oder Einrückung) hervorgehoben sein.
Warum wird das geprüft?
Ausschließlich über Farben vermittelte Informationen sind für blinde Nutzende nicht zugänglich. Auch farbfehlsichtige Nutzende, die unter Umständen mit eigenen Farbschemata arbeiten, können Farben nicht oder nur eingeschränkt identifizieren und unterscheiden.
Wie wird geprüft?
1. Anwendbarkeit des Prüfschritts
Der Prüfschritt ist immer anwendbar.
2. Prüfung
2.1 Vermittlung von Informationen über die Farbgebung
Prüfen, ob die Webseite Elemente enthält, die durch Farbgebung Informationen vermitteln. Beispiele dafür:
Überschriften werden farblich hervorgehoben
Ausgewählte Menueinträge werden in einer anderen Farbe dargestellt
Links im Fließtext werden in einer anderen Farbe dargestellt
Eine Grafik verwendet unterschiedliche Farben für die vergleichende Darstellung des Kursverlaufs verschiedener Aktien
Pflichtfelder in Formularen werden farblich gekennzeichnet (die gelb unterlegten Felder müssen immer ausgefüllt werden)
Solche Hervorhebungen sind positiv. Die Vermittlung wichtiger Informationen soll sich aber nicht ausschließlich auf einfache Farbänderungen stützen. Zu prüfen ist also, ob die Informationen zusätzlich noch auf einem anderen Weg vermittelt werden.
Beispiele für zusätzliche Vermittlung:
Überschriften sind zusätzlich eingerückt oder durch eine andere Schriftgröße hervorgehoben (das ist fast immer der Fall).
Ausgewählte Menueinträge haben einen Kontrastunterschied von mehr als 3:1 zur Farbe benachbarter Einträge oder sind durch Einrückung, Fettung, Unterstreichung, zusätzliche Elemente für die Hervorhebung, Änderung der Form des Menü-Eintrags oder dergleichen hervorgehoben.
Links im Fließtext sind nicht nur farblich abgesetzt, sondern durch ein weiteres visuelles Merkmal unterschieden: z.B. zusätzlich unterstrichen, gefettet oder kursiv, invertiert oder mit einer Markierung versehen. Ausnahme: Das Kontrastverhältnis zwischen Linkfarbe und umgebender Textfarbe ist 3:1 oder besser. In diesem Fall kann im Ausgangszustand auf die zusätzliche Hervorhebung verzichtet werden. Die Links müssen dann aber bei Fokuserhalt zusätzlich hervorgehoben werden.
Linien in Schaubildern sind zusätzlich gestrichelt oder durchgezogen, Flächen haben unterscheidbare Muster.
Pflichtfelder im Formular sind zusätzlich mit einem Stern mit Bedeutungserklärung am Formularbeginn) oder textlich ("Pflichtfeld") gekennzeichnet.
3. Hinweise
Es gibt verschiedene Arten, Information nicht nur über Farbe zu vermitteln:
Ein Menüeintrag ist farblich hervorgehoben, aber ein Breadcrumb nennt zusätzlich, welche Seite ausgewählt ist
Ein Menüeintrag ist farblich hervorgehoben, aber es gibt zusätzlich eine gleichlautende Überschrift, die dem Menüeintrag jeweils entspricht
Ein Icon wechselt die Farbe, aber es ändert sich außerdem die nachfolgende Beschriftung
ein Bedienelement ändert bei Fokussierung die Farbe, aber es kommt zusätzlich ein äußerer Rahmen hinzu, der ausreichend zum Hintergrund kontrastiert
Farbumkehr ausreichend kontrastreicher Elemente: Vorder- und Hintergrundfarbe eines Elements werden bei Fokussierung oder Aktivierung ausgetauscht
4. Bewertung
Nicht voll erfüllt
Fließtextlinks sind von ihrer Textumgebung nur durch abweichende Farbe mit einem Kontrastunterschied von unter 3:1 unterscheidbar.
Nicht erfüllt
Informationen (etwa richtig / falsch) werden lediglich über die Farbe (etwa grün=richtig, rot=falsch) vermittelt.
Einordnung des Prüfschritts
Abgrenzung zu anderen Prüfschritten
Abgrenzung zur Prüfung der Kontraste
In diesem Prüfschritt geht es nicht um die Prüfung der Kontraste zum Hintergrund. Dies ist Aufgabe der Prüfkriterien 9.1.4.3 "Kontraste von Texten ausreichend" und 9.1.4.11 "Kontraste von Grafiken und grafischen Bedienelementen ausreichend".
Für Fließtext-Links gilt ein deutlicher Kontrast (mindestens 3,0:1) der Linkfarbe zur Farbe des umgebenden Textes ausreichend, um diese Anforderung zu erfüllen. Es ist dann keine zusätzliche Hervorhebung nötig. Für die Erfüllung von 9.1.4.3 Kontraste von Texten ausreichend muss jedoch gewährleistet sein, dass die Linkfarbe zum Hintergrund 4,5:1 erfüllt.
Abgrenzung zum Prüfschritt 9.1.3.3. Ohne Bezug auf sensorische Merkmale nutzbar
In diesem Prüfschritt geht es nicht um die Prüfung von Verweisen auf Seiteninhalte mit Hilfe der Angabe von Farben. Die sinnesunabhängige Bereitstellung von Verweisen auf Seiteninhalte wird im Prüfschritt 9.1.3.3 "Ohne Bezug auf sensorische Merkmale nutzbar" geprüft.
Abgrenzung zur Prüfung des Markups
In diesem Prüfschritt wird die Auszeichnung von Elementen durch Markup nicht beachtet. Es geht also um die mehrgleisige Vermittlung von Informationen auf dem Bildschirm. Bei den Prüfkriterien zur richtigen Auszeichnung geht es dagegen darum, dass Informationen unabhängig von der Darstellung auf dem Bildschirm verfügbar sind oder dass der Benutzer die Darstellung auf dem Bildschirm anpassen kann.
Abgrenzung zu fehlenden Hervorhebungen
In diesem Prüfschritt 9.1.4.1 geht es um die Farbunabhängigkeit vorhandener Seitenelemente.
Eine negative Bewertung ist also beispielsweise angebracht, wenn Links im Text oder Menü-Elemente nur durch die Farbe (und nicht zusätzlich durch Unterstreichung, Fettung oder andere Markierung) gekennzeichnet sind. Wenn Links im Text überhaupt nicht gekennzeichnet sind, ist dies zwar nicht nutzerfreundlich, aber wird in diesem Prüfschritt nicht negativ bewertet.
Kennzeichnung der aktuellen Menüposition: Ein Webangebot, das die aktuelle Position überhaupt nicht anzeigt, verstößt nicht gegen diesen Prüfschritt 9.1.4.1.
Einordnung des Prüfschritts nach WCAG 2.1
Guidelines
Success criteria
1.4.1 Use of Color (Level A)
1.4.11 Non-text contrast (Level AA)
Techniques
General Techniques
Failures
Quellen
Use of Color: Understanding SC 1.4.1
The intent of this Success Criterion is to ensure that all users can access information that is conveyed by color differences, that is, by the use of color where each color has a meaning assigned to it. If the information is conveyed through color differences in an image (or other non-text format), the color may not be seen by users with color deficiencies. In this case, providing the information conveyed with color through another visual means ensures users who cannot see color can still perceive the information.
Color is an important asset in design of Web content, enhancing its aesthetic appeal, its usability, and its accessibility. However, some users have difficulty perceiving color. People with partial sight often experience limited color vision, and many older users do not see color well. In addition, people using text-only, limited-color or monochrome displays and browsers will be unable to access information that is presented only in color.
Examples of information conveyed by color differences: "required fields are red", "error is shown in red", and "Mary’s sales are in red, Tom’s are in blue". Examples of indications of an action include: using color to indicate that a link will open in a new window or that a database entry has been updated successfully. An example of prompting a response would be: using highlighting on form fields to indicate that a required field had been left blank.
Note: This should not in any way discourage the use of color on a page, or even color coding if it is redundant with other visual indication.
https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html
Fragen zu diesem Prüfschritt
Häufig werden besuchte Links in einer anderen Farbe dargestellt Fällt das auch unter diesen Prüfschritt?
Die Unterscheidung besuchter und nicht besuchter Links ist hilfreich. Der Benutzer kann gleich sehen, welche Seiten er schon besucht hat. Ideal wäre es daher, wenn besuchte Links zum Beispiel zusätzlich durch eine andere Unterstreichung markiert würden.
Aber die verfügbaren Gestaltungsmöglichkeiten sind begrenzt. Und zu viele unterschiedliche Kennzeichnungen von Links können auch Verwirrung stiften.
In diesem Prüfschritt des BITV-Tests wird die Kennzeichnung besuchter Links nicht berücksichtigt, sie ist für die Bewertung nicht relevant.