Kleurcontrast

Een hoog contrast van tekst ten opzichte van de achtergrond zorgt ervoor dat kleurenblinden en slechtzienden de tekst makkelijk kunnen lezen. Veel mensen lezen ook op een mobiel toestel (smartphone of tablet) met een klein scherm onder slechte lichtomstandigheden. Contrast is voor iedereen belangrijk.

Volledige kleurenblindheid (waarbij men enkel grijswaarden ziet, letterlijk kleurenblind) is zeldzaam, veel kleurenblinden lijden aan een gestoord kleurenzicht. Het oog neemt kleuren waar op basis van de basiskleuren rood, groen en blauw. Als één of meerdere van deze waarnemingen niet of niet goed werkt, heb je een afwijkend kleurenzicht. Maar liefst 1 op de 12 mannen is kleurenblind, tegenover 1 op de 250 vrouwen.

Vanwege de vele soorten kleurstoornissen, vermijd u best volgende kleurencombinaties:

  • rood - groen
  • zwart - rood
  • wit - geel
  • groen - blauw

Kleurcontrasten kunt u objectief controleren met de gratis Colour Contrast Analyzer. Met behulp van een pipet duidt u een voor- en een achtergrondkleur op het scherm aan. De contrastratio die u zo verkrijgt, moet minstens 4,5:1 zijn voor standaardtekst. Voor grote tekst (18 punten normaal of 14 vet) is een contrastratio van 3:1 voldoende.

Voorbeelden

Colour Contrast Analyzer

Als voorbeeld een paragraaf die wel en niet slaagt voor de waarde 4,5:1.

Niet goed: het woord AnySurfer staat in blauw, contrast met zwarte achtergrond is 3.0:1

Goed: het woord AnySurfer staat in oranje, contrast met zwarte achtergrond is 8.4:1

screenshot van Colour Contrast Analyzer

Links in tekst

In onderstaande screenshot zien we rode links in doorlopende zwarte tekst.

paragraaf op internetjournalistiek met rode links in doorlopende zwarte tekst

Dezelfde paragraaf in grijswaarden, zo ziet het er uit voor mensen die het verschil niet zien tussen zwart en rood.

zelfde paragraaf in grijswaarden waardoor links niet te onderscheiden zijn

Kleurrijke achtergrond

Een kleurrijke achtergrond, heeft verschillende contrasten als gevolg. Pas op en zorg ervoor dat de contrast ratio bij elke combinatie voldoende is.

Witte tekst op meerdere kleuren

In grijswaarden slaagt bijna geen enkele kleur voor de contrast ratio.

Witte tekst op meerdere grijswaarden

Testmethode

Duid met het pipet van de Colour Contrast Analyzer een voor- en achtergrondkleur aan. Of geef rechtstreeks een hexadecimale waarde in (wit is bijvoorbeeld #FFFFFF). Kies onder 'Algorithm' voor 'Luminosity' om het het contrastratio te berekenen. Als u het keuzevakje 'Show contrast results for colour blindness' aankruist, ziet u het contrast voor verschillende types van kleurenblindheid.