Geef placeholders voldoende kleurcontrast

Ook het kleurcontrast van de tekst van placeholders ten opzichte van de achtergrondkleur moet 4,5:1 of hoger zijn.

Let op: sommige browsers geven een placeholder lichter weer dan in de CSS is bepaald. Dit wordt verder uitgelegd bij de richtlijn Zorg voor een goed kleurcontrast van de placeholdertekst.

Doen

Maak de placeholder goed leesbaar door voldoende contrast.

Dit voorbeeld heeft een contrast van 6.28:1.

<input placeholder="Zoeken"/>

Niet doen

Maak de placeholder slecht zichtbaar door te laag contrast.

Dit voorbeeld heeft een contrast van 3.54:1.

<input placeholder="Zoeken"/>

Over deze richtlijnen

Deze richtlijnen worden onderhouden door het NL Design System en zijn op dit moment in beta.

We willen graag van de community horen of ze werkbaar en nuttig zijn. Heb je vragen, aanvullingen of opmerkingen? Deel je mening op GitHub met je suggesties.