Hoe vaak hebben we een website bezocht waar we niets konden lezen, of een app gebruikt met een verschrikkelijke kleurencombinatie? Vanuit het oogpunt van toegankelijkheid kan het kiezen van een verkeerd palet of contrastverhouding elk idee van zichtbaarheid verpesten, maar de website OddContrast helpt ons de juiste waarden te vinden, gebaseerd op versie 2 van de WCAG-standaard.
Als we ons baseren op de definitie van de WCAG-standaard in versie 2 (ook wel Pautas de Accesibilidad para el Contenido Web genoemd), is 'contraste' een maat voor het verschil in 'waargenomen helderheid' tussen twee kleuren, uitgedrukt als een verhouding of ratio. Zo heeft bijvoorbeeld rode tekst (#ff0000) op een witte achtergrond (#ffffff) een verhouding van 4:1. Als we de tekst naar blauw (#0000ff) veranderen, springt de verhouding naar 8,59:1 en is deze beter leesbaar. Ten slotte heeft de standaard van zwarte tekst op een witte achtergrond een verhouding van 21:1. Het interessantste? De verhouding blijft intact als we de kleuren omkeren.
Waarom is dit belangrijk? Omdat er vaak kleurencombinaties worden toegepast met een zeer slechte verhouding, waardoor de tekst onleesbaar wordt. Als iemand die al gedwongen is geweest om het letterformaat op zijn computer te vergroten, begrijp ik meer dan ooit het belang van een goed contrast. En dat idee brengt ons bij OddContrast, een website die speciaal is ontworpen om contrastverhoudingen te berekenen voor websites, diensten en/of toegankelijkheidstoepassingen.
Optimaliseer het contrast van je projecten met OddContrast
Je hoeft niet veel te doen op de site om er maximaal gebruik van te maken: we kiezen een formaat dat de kleuren weergeeft (acht beschikbaar, waaronder HEX en sRGB), en we passen de schuifregelaars aan voor de hoofdkleur en de achtergrondkleur tot we een 'goedgekeurd' krijgen in de gevallen die ons interesseren. OddContrast definieert normale verhoudingen als 4,5:1 voor standaard tekst en 3:1 voor grote tekst, terwijl een geoptimaliseerd contrast respectievelijk 7:1 en 4,5:1 betreft. Aan de andere kant is grote tekst gelijk aan of groter dan 24px met een normaal gewicht, en gelijk aan of groter dan 19px in vet.
Tot slot beweert OddContrast niet de absolute waarheid in pacht te hebben. In feite hebben we niet eens in alle gevallen een goede verhouding nodig, maar het verschil tussen een slechte kleurencombinatie en een goede is opmerkelijk. Probeer het zelf!
Officiële website: Klik hier