2. Kleur

Uitleg

Soms wordt op een website informatie door middel van kleur overgebracht. Een voorbeeld hiervan is een grafiek waarbij de lijnen informatie overbrengen en die met verschillende kleuren worden weergegeven. De legenda die bij de grafiek staat legt aan de hand van de kleur van de lijnen uit welke informatie in welke kleur lijn te vinden is.

Mensen die kleurenblind, slechtziend of blind zijn kunnen dan moeite hebben om deze verschillende informatie te onderscheiden. In het ergste geval kunnen ze de informatie helemaal niet opnemen en hebben ze dus een probleem.

Daarom luidt ijkpunt 2.1 als volgt: "Zorg ervoor dat alle informatie die met behulp van kleur wordt overgebracht ook beschikbaar is zonder kleur, bijvoorbeeld uit de context of uit de opmaak."

Een oplossing voor het probleem met de grafiek is bijvoorbeeld verschillende soorten lijnen te gebruiken naast de verschillende kleuren. De ene lijn is dan doorgetrokken, terwijl de andere lijn gestippeld is of met korte strepen wordt weergegeven. Op die manier is het onderscheid ook zonder kleur te maken.

Voorbeelden

Voorbeeld 1: een fout voorbeeld

In de eerste afbeelding hieronder is een voorbeeld te zien van een grafiek waarbij de informatie door middel van gekleurde lijnen wordt overgebracht. In de tweede afbeelding is dezelfde grafiek te zien in grijswaarden (dus zonder kleur). Zonder kleur is het heel moeilijk om nog te zien welke lijn welke informatie vertegenwoordigd. De informatie in deze grafiek is dus niet toegankelijk.

Voorbeeld 2: een goed voorbeeld

In de eerste afbeelding hieronder is een voorbeeld te zien van een grafiek waarbij de informatie zowel in kleur als in vorm wordt weergegeven. De temperatuur wordt met groen en met een rondje weergegeven, terwijl de Voorspelde temperatuur in het blauw en met een vierkantje wordt weergegeven. In de tweede afbeelding is dezelfde grafiek te zien in grijswaarden (zonder kleur) en het valt op dat de informatie nog steeds goed duidelijk wordt overgebracht door het verschil in vorm. Deze grafiek is dus goed toegankelijk.

Andere voorbeelden

Andere voorbeelden waar vaak problemen ontstaan met het overbrengen van informatie door middel van kleur zonder alternatief (in vorm of context) zijn formulieren en plattegronden.

Bij formulieren wordt vaak gebruik gemaakt van de kleur rood voor verplichte velden, of voor de kleur rood als verplichte velden vergeten zijn in te vullen. De tekst bij de formuliervelden wordt dan in het rood weergeven en is moeilijk tot niet onderscheidbaar van de andere tekst als mensen met een kleurstoornis (rood-groen stoornis bijv.) het formulier invullen. Ook voor mensen die blind zijn en helemaal geen kleur zien levert dit grote problemen op. Voor mensen die blind zijn moeten verplichte velden vanuit de context duidelijk zijn, bijvoorbeeld door een asterisk toe te voegen bij die onderdelen die verplicht zijn.

Hieronder is in de eerste afbeelding een inschrijfformulier te zien waarbij verplichte velden in het rood worden weergegeven. Daarnaast is dezelfde pagina te zien in hulpsoftware die blinde mensen gebruiken om websites te lezen. In de hulpsoftware is niet duidelijk welke velden verplicht zijn, omdat dat alleen met kleur is aangegeven. Mensen die blind zijn missen dus informatie. Hiermee is het formulier dus niet toegankelijk.

Voor plattegronden geldt vaak hetzelfde als voor grafieken. Onderscheidende informatie wordt in dezelfde vorm maar in verschillende kleuren weergegeven in de plattegrond. Zonder kleur is dan het onderscheid niet meer te maken. Naast kleur moet dus voor een alternatief gezorgd worden. In onderstaande afbeelding is een plattegrond te zien met daarin een aantal huisjes in verschillende kleuren. De legenda geeft aan dat de kleuren voor bepaalde locaties staan. In de afbeelding is ook voor een alternatief gezorgd, namelijk de locatienaam staat bij iedere huisjes. Deze plattegrond is dus toegankelijk.

Testen met de toolbar

Ga op zoek naar pagina's met grafieken, plattegronden, formulieren of andere onderdelen die werken met informatie in kleur. Bekijk deze pagina's vervolgens in grijstinten (toolbar 2c). Is alle informatie nu nog begrijpelijk of onderscheidbaar?
Herlaad de pagina en bekijk de pagina vervolgens ook eens door de ogen van iemand met een rood-groen stoornis (toolbar 2d). Is alle informatie nu nog begrijpelijk of onderscheidbaar?

Handmatig testen

Kaarten en plattegronden met een legenda kunnen ook handmatig getest worden (toolbar 2e). Wordt de informatie alleen met kleur overgebracht, of is de informatie ook duidelijk uit de vorm of uit de context?

Checklist

Op de checklist staan twee vragen over informatie in kleur. Beantwoord deze vragen met behulp van de resultaten van de tests die u met behulp van de toolbar hebt uitgevoerd.
Mocht u geen pagina's hebben gevonden waarin informatie door middel van kleur wordt overgebracht kunt u de vragen beantwoorden met 'nvt'. Mocht u pagina's hebben gevonden waarin informatie door middel van kleur wordt overgebracht zonder alternatief, kruis dan 'nee' aan. Als er wel een alternatief wordt geboden voor de informatie in kleur, bijvoorbeeld door middel van de vorm, dan kunt u de vraag met 'ja' beantwoorden.