Gedaan met laden. U bevindt zich op: Gebruik van placeholders Formulieren

Gebruik van placeholders

De documentatie van het Design System is nog in bèta en wordt stapsgewijs aangevuld.

Over het algemeen, raden we het gebruik van placeholders in inputvelden af. 

Waarom worden placeholders afgeraden?

Over het algemeen worden placeholders als onhandig beschouwd. Hier zijn enkele redenen:

  1. Zichtbaarheid van lege velden: Velden zonder placeholders (dus lege velden) vallen beter op, waardoor gebruikers gemakkelijker kunnen zien welke velden nog ingevuld moeten worden.

  2. Verlies van hints: Wanneer de placeholdertekst verdwijnt, verdwijnt ook de hint voor de gebruiker. Dit vertrouwt te veel op het kortetermijngeheugen van de gebruiker.

  3. Problemen voor keyboardgebruikers: Wanneer de placeholdertekst verdwijnt bij focus op het inputveld, kan dit vervelend zijn voor gebruikers die via de tab-toets door het formulier navigeren. De hint is dan niet meer zichtbaar net wanneer ze het veld willen invullen.

  4. Verwarring met ingevulde content: Gebruikers kunnen placeholders verwarren met al ingevulde gegevens, wat tot fouten kan leiden.

  5. Handmatig verwijderen: Het kan zijn dat gebruikers de placeholdertekst eerst handmatig moeten verwijderen, wat extra moeite kost.

Bron: Placeholders in Form Fields Are Harmful(opent in nieuw venster)

Vuistregel

Gebruik labels en annotaties optimaal, zodat het gebruik van een placeholder niet nodig is.

Wanneer kan men wel een placeholder gebruiken?

Placeholders kunnen nuttig zijn in velden die gebruikmaken van een inputpattern of inputmask, omdat deze al visueel kunnen aangeven hoe de invoer eruit moet zien.

Voorbeelden zijn:

  • Rijksregisternummer

  • Rekeningnummer

  • Nummer van een credit card

  • Datum

Alsnog zou je een voorbeeld van het gewenste type input kunnen meegeven als annotation.

Don't
  • Gebruik zeker geen placeholders ter vervanging van labels!
  • Gebruik geen placeholders om in elk veld al een voorbeeld mee te geven, dit kan de indruk geven dat alles al ingevuld is, en bemoeilijkt het invullen van het veld ook.
Do

Benut het label en de annotation bovenaan het inputveld zo goed mogelijk, zodat placeholders niet meer hoeven.