Webdeveloper

Native HTML-componenten en kleurcontrast volgens WCAG 2.1

Moet je het kleurcontrast van native HTML-componenten zoals checkboxes en selects controleren? Uitleg over de WCAG 1.4.11 uitzondering.

Julia Tol 1 min leestijd

Native HTML-componenten en kleurcontrast volgens WCAG 2.1

Informatieve en interactieve interface-elementen zoals knoppen, selectievakken en schuifregelaars moeten voldoende contrast hebben zodat ze zichtbaar zijn voor alle bezoekers. In de praktijk roept dit vaak vragen op bij audits en code-reviews: moet ik het kleurcontrast van elk zichtbaar UI-element controleren en verbeteren?

Het korte antwoord is: nee, niet altijd.

De contrasteis geldt niet voor grafische elementen die volledig door de user agent worden geleverd, mits ze niet zijn aangepast door de auteur.

See the Pen 1.4.11 exceptions by Julia Tol (@Julia-Tol-wcag) on CodePen.

Voorbeelden waarbij contrast verplicht is:

  • Een checkbox gebouwd met <div> en CSS
  • Een <select> waarbij de pijl is vervangen door een SVG
  • Een slider waarvan de thumb en track custom zijn gestyled
  • Eigen focus-indicator
1 4 11

Related Posts

Accessible name: wat moet je weten

Bij Proper Access beginnen we al onze trainingen voor webdevelopers met iets dat simpel lijkt, maar reuze belangrijk is. Als ik je als ontwikkelaar een tip mag geven: begrijp hoe de toegankelijke naam (accessible name) van een interactief element werkt. Het is de basis van digitale toegankelijkheid – en het punt waar het vaakst iets misgaat.

Julia Tol 3 min leestijd

Tools om contrast te checken

De TPGi Color Contrast Checker is een gratis tool om te controleren of de kleuren op je website genoeg contrast hebben volgens de WCAG-richtlijnen.

Julia Tol 2 min leestijd

Instructie: hoe test ik kleurcontrast?

Kleurcontrast is een van de meest voorkomende toegankelijkheidsproblemen die we tegenkomen in audits. Lichtgrijze tekst op een witte achtergrond, pastelkleurige knoppen, subtiele placeholdertekst – het ziet er misschien strak uit, maar voor honderdduizenden mensen met een visuele beperking is het simpelweg niet te lezen.

Julia Tol 3 min leestijd