Contrast

Voor vrijwel elke gebruiker is het fijn als een website over voldoende contrast beschikt. De teksten zijn hierdoor goed leesbaar, links komen duidelijk naar voren en ook als je lekker in het zonnetje zit, kun je de webpagina nog goed lezen en zien waar de knoppen staan.

Het verschil in kleur van bijvoorbeeld tekst en achtergrond, noemt men de contrastratio. In de WCAG zijn afspraken gemaakt wat de minimale contrastratio moet zijn. 

Tekstueel contrast

  • Voor normale tekst (in alinea's) is de afspraak dat de contrastratio minimaal 4,5:1 moet zijn
  • Voor grote tekst (vaak koppen) is de afspraak dat de contrastratio minimaal 3,0:1 moet zijn.

Het gaat vaak fout als tekst over een foto geplaatst wordt. Dit gebeurt nogal eens in de header van de pagina. Probeer dit te ontwijken en plaats als het niet anders kan een rand rond de tekst. Dan blijft het contrast gelijk, ook als de achterliggende afbeelding wijzigt.

Niet -tekstueel contrast

Denk hierbij aan symbolen, kaders om invoervelden, rondjes bij radiobuttons, focusranden. De contrastratio moet minimaal 3,0:1 zijn.

Er zijn online veel tools te vinden die de contrastratio kunnen berekenen, bijvoorbeeld de Colour Contrast Anayliser.