Succescriterium 1.4.1 Gebruik van kleur
Kleur wordt niet als het enige visuele middel gebruikt om informatie over te brengen, een actie aan te geven, tot een reactie op te roepen of een visueel element te onderscheiden.
Gebruik van kleur begrijpen (Engelstalig)
Gebruik kleur niet als enige manier om informatie over te brengen, een actie aan te geven, tot een reactie op te roepen of een visueel element te onderscheiden. Denk hierbij bijvoorbeeld aan:
- Informatie in een grafiek of tabel
- Links in tekst
- Foutmeldingen in een formulier
Mensen met een visuele beperking kunnen informatie die alleen met kleur worden aangegeven niet (of niet goed) onderscheiden. Zorg daarom dat je belangrijke informatie op meerdere manieren communiceert. Voeg bijvoorbeeld ook een icoon toe of zet er een duidelijke tekst bij.
Hoe pas je dit toe?
- Gebruik niet alleen kleur om informatie over te dragen.
- Gebruik niet alleen kleur om een actie aan te geven.
- Gebruik niet alleen kleur om tot een reactie op te roepen.
- Gebruik niet alleen kleur om een visueel element te onderscheiden.
Voor wie is dit belangrijk?
- Mensen die een schermlezer gebruiken.
- Mensen die een visuele beperking hebben.
Wie is verantwoordelijk?
- Redacteur
- Vormgever
Hoe toets je dit?
Benodigdheden
- Een contrast analyser, zoals Colour Contrast Analyser (CCA)
Testprocedure
Test 1: Kleur
- Verken de pagina met muis en toetsenbord
- Beweeg met de muis over elementen om hover-states te activeren
- Navigeer met de Tab-toets om focus-states te activeren
- Bepaal of kleur ergens informatie overdraagt of elementen onderscheidt:
- Onderdelen in een grafiek of diagram
- Status van knoppen of bedieningselementen
- Foutmeldingen in een formulier
- Links in een lopende tekst
- Gemarkeerde teksten
- Focusindicatoren
- Controleer voor elk element dat kleur gebruikt:
- Of de informatie ook op een andere manier wordt overgebracht
- Tekst (zoals “Verplicht”, “Fout”, “Geselecteerd”)
- Symbolen of iconen(zoals *, ✓, !)
- Onderstreping, vet of cursief
- Patronen
- Positionering
- Vorm of rand
- Of de informatie ook op een andere manier wordt overgebracht
- Controleer voor elk element dat alleen kleur gebruikt:
- Bij links in een lopende tekst:
- Of het contrast tussen de link en de omringende tekst minimaal 3:1 is
- Bij focusindicatoren:
- Of het contrast tussen de gefocuste en ongefocuste staat minimaal 3:1 is
- Bij kleurveranderingen om de status van een bedieningselement aan te geven:
- Of het contrast tussen de verschillende statussen minimaal 3:1 is
- Bij links in een lopende tekst:
Belangrijk om te weten
- Als de kleuren zelf een betekenis hebben (groen = goed, rood = fout), is een contrast van 3:1 tussen die kleuren niet voldoende. Er moet dan een extra indicator zijn!
Beoordeling
- Kleur moet niet als enige manier worden gebruikt om:
- Informatie over te brengen
- Een actie aan te geven
- Tot een reactie op te roepen
- Een visueel element te onderscheiden
- Links in een lopende tekst en de omringende tekst moeten een contrastverhouding van minimaal 3:1 hebben als er geen andere indicatoren aanwezig zijn
- Focusindicatoren die alleen met kleur werken moeten een contrastverhouding van minimaal 3:1 hebben tussen de gefocuste en ongefocuste staat
- Kleurveranderingen om de status van een bedieningselement aan te geven moeten een contrastverhouding van minimaal 3:1 hebben tussen de verschillende statussen