Validatie: controleren of het klopt voordat het verstuurd wordt
Iemand vult je contactformulier in, klikt op verzenden en krijgt een rode balk bovenaan zijn scherm. Er is iets misgegaan, staat er. Welk veld het betreft, staat er niet bij. Hij scrolt terug, gokt, probeert het opnieuw en haakt bij de derde poging af.
Dat is geen technisch probleem. Alles werkt precies zoals het is gebouwd.
Het is een ontwerpprobleem, en het kost je aanvragen die al bijna binnen waren.
Goede controle voelt niet als controle. Je bezoeker merkt alleen dat het invullen soepel gaat.
Controleren of wat er wordt ingevuld ook klopt.
Wat is validatie?
Validatie is de controle van velden in een formulier. Je kijkt of het ingevulde antwoord bruikbaar is voordat het wordt verstuurd.
Staat er een e-mailadres zonder apenstaartje, dan klopt er iets niet. Datzelfde geldt voor een telefoonnummer met letters erin.
Waarom je het doet
Voor twee partijen tegelijk. Je bezoeker krijgt geen foutmelding achteraf, en jij krijgt geen onbruikbare aanvraag binnen.
Een aanvraag zonder werkend mailadres is verloren werk. Je kunt niet reageren en die klant denkt dat je hem negeert.
Waar het misgaat
Vier klassieke fouten
De melding verschijnt pas na het verzenden.
De melding staat bovenaan en niet bij het veld.
Er staat alleen dat er iets fout is, niet wat.
Alle ingevulde velden worden leeggegooid.
Die laatste is onvergeeflijk. Iemand die zes velden invulde en opnieuw moet beginnen, komt niet terug.
Wat wel werkt
Bij het direct terugkoppelen controleer je een veld zodra iemand het verlaat. Niet tijdens het typen, want dan schreeuw je terwijl hij bezig is.
Zet de melding direct onder het veld zelf. Meer daarover lees je bij usability.
Een goede foutmelding
Noem het veld en de oplossing. Niet: ongeldige invoer, maar: vul een adres in met een apenstaartje erin.
Bij het tonen van foutmeldingen gebruik je gewone taal. Je bezoeker is geen programmeur.
Gebruik niet alleen kleur
Een rood randje zegt niets aan iemand die kleurenblind is. Zet er een pictogram en tekst bij.
Zorg bovendien dat voorleessoftware de melding oppikt, zie accessibility.
Verplichte velden
Zo weinig mogelijk. Elk verplichte velden is een drempel en elke drempel kost aanvragen.
Voor een eerste contact heb je een naam, een mailadres en een vraag nodig. De rest kun je later vragen.
Een extra veld omdat het intern handig sorteert, kost je aanvragen. Vraag dat gerust in je antwoordmail, zie CRO.
Wat ik zie gebeuren
Bedrijven maken bedrijfsnaam, postcode en telefoonnummer verplicht omdat het intern handig sorteert.
Dat kost je bezoekers. Vraag die gegevens in je antwoordmail, zie conversie.
Browser of server
Controle in de browser is snel en gebruiksvriendelijk. Controle op de server is de enige die je echt beschermt.
Het eerste kan namelijk worden omzeild. Je hebt ze dus allebei nodig, zie frontend.
En de spam
Gebruik liever geen puzzel met verwrongen letters. Die kosten echte bezoekers meer dan ze spam tegenhouden.
Een onzichtbaar veld dat alleen door robots wordt ingevuld, werkt beter. Bij het formulier versturen merkt je bezoeker daar niets van.
Een tijdcontrole helpt ook
Een formulier dat binnen twee seconden wordt verstuurd, is niet door een mens ingevuld. Dat filter je er zo uit.
Begin met de onzichtbare oplossingen. Elke zichtbare hindernis kost je aanvragen, en dat is meestal duurder dan wat spam.
Gooi nooit ingevulde velden leeg
Iemand die zes velden invulde en opnieuw moet beginnen, komt niet terug. Dat is de duurste fout van allemaal.
Bewaar dus altijd wat er al stond. Alleen het foute veld hoeft aandacht.
Waarom je twee controles nodig hebt
De controle in je browser kan worden omzeild. Iemand stuurt dan gegevens rechtstreeks naar je server.
Die eerste is er voor je bezoeker, de tweede voor je beveiliging. Vraag je bouwer of allebei zijn ingericht, zeker bij een formulier dat gegevens doorstuurt.
Meer vragen over Validatie
Dit zijn de vragen die ik hierover het vaakst krijg. Ik werk ze los uit.
Wat is validatie?
Hoe schrijf je een goede foutmelding?
Wanneer maak je een veld verplicht?
Wat is het verschil tussen controle in de browser en op de server?
Waarom komt mijn formulier soms leeg binnen?
Hoe voorkom je spam in je formulier?
Wat is validatie?
Noem het veld en de oplossing. Niet: ongeldige invoer, maar: vul een adres in met een apenstaartje erin.
Gebruik gewone taal, want je bezoeker is geen programmeur. Foutcodes horen in je logbestand en niet op je scherm.
Zet de melding direct onder het veld zelf. Een rode balk bovenaan een lang formulier helpt niemand.
Gebruik daarnaast niet alleen kleur. Een rood randje zegt niets aan iemand die kleurenblind is.
Zet er dus een pictogram en tekst bij. Zorg bovendien dat voorleessoftware de melding oppikt, anders bestaat hij wel maar hoort niemand hem.
Zet je melding altijd onder het veld waar het misging. Een balk bovenaan een lang formulier helpt niemand.
Gebruik niet alleen kleur, want een rood randje zegt niets aan iemand die kleurenblind is. Zet er tekst bij. Gebruik gewone taal en geen foutcodes. Je bezoeker is geen programmeur en hoeft niets op te zoeken. Zet er een pictogram bij zodat de melding ook zonder kleur duidelijk is.
Hoe schrijf je een goede foutmelding?
Validatie is de controle van velden in een formulier. Je kijkt of het ingevulde antwoord bruikbaar is voordat het wordt verstuurd.
Staat er een e-mailadres zonder apenstaartje, dan klopt er iets niet. Datzelfde geldt voor een telefoonnummer met letters erin.
Je doet het voor twee partijen tegelijk. Je bezoeker krijgt geen foutmelding achteraf, en jij krijgt geen onbruikbare aanvraag binnen.
Een aanvraag zonder werkend mailadres is verloren werk. Je kunt niet reageren en die klant denkt dat je hem negeert.
Goede controle voelt niet als controle. Je bezoeker merkt alleen dat het invullen soepel gaat, en dat is precies de bedoeling.
Vul je eigen formulier een keer verkeerd in en kijk wat er gebeurt. Dat is een test van twee minuten.
Krijg je een vage melding of raak je je ingevulde gegevens kwijt, dan weet je waar je moet beginnen. Een aanvraag zonder werkend mailadres is verloren werk. Je kunt niet reageren en die klant denkt dat je hem negeert.
Wanneer maak je een veld verplicht?
Zo min mogelijk. Elk verplicht veld is een drempel en elke drempel kost aanvragen.
Voor een eerste contact heb je een naam, een mailadres en een vraag nodig. De rest kun je later vragen.
Wat ik in de praktijk zie: bedrijven maken bedrijfsnaam, postcode en telefoonnummer verplicht omdat het intern handig sorteert.
Dat kost je bezoekers. Vraag die gegevens gewoon in je antwoordmail.
Stel jezelf bij elk veld de vraag voor wie het er staat. Is het voor je bezoeker of voor je eigen administratie? Dat tweede komt vaker voor dan je denkt.
Loop je formulier na en schrap elk verplicht veld dat niet nodig is voor een eerste reactie.
Naam, mailadres en een vraag is genoeg. De rest vraag je in je antwoordmail, en dan heb je al contact. Stel jezelf bij elk veld de vraag voor wie het er staat. Is het voor je bezoeker of voor je eigen administratie?
Wat is het verschil tussen controle in de browser en op de server?
Controle in de browser gebeurt direct, terwijl iemand invult. Dat is snel en gebruiksvriendelijk.
Controle op de server gebeurt na het verzenden. Dat is trager maar het is de enige die je echt beschermt.
De controle in de browser kan namelijk worden omzeild. Iemand met kwade bedoelingen stuurt gegevens rechtstreeks naar je server.
Je hebt ze dus allebei nodig, en om verschillende redenen.
Dat hoef je zelf niet in te richten, maar het is wel een vraag die je aan je bouwer kunt stellen. Zeker als je een formulier hebt dat gegevens opslaat of doorstuurt naar een ander systeem.
Vraag je bouwer of allebei zijn ingericht. Dat is een concrete vraag met een concreet antwoord.
Zeker bij een formulier dat gegevens opslaat of doorstuurt naar een ander systeem. Daar is de servercontrole je enige echte bescherming. De controle in je browser is er voor je bezoeker, die op je server voor je beveiliging. Ze vervangen elkaar niet.
Hoe voorkom je spam in je formulier?
Niet met een puzzel met verwrongen letters. Die kosten je meer echte bezoekers dan ze spam tegenhouden.
Een onzichtbaar veld dat alleen door robots wordt ingevuld, werkt beter. Je bezoeker merkt daar niets van.
Daarnaast helpt een simpele tijdcontrole. Een formulier dat binnen twee seconden wordt verstuurd, is niet door een mens ingevuld.
Een extra vraag als hoeveel is drie plus vier werkt ook, al is dat voor sommige mensen alsnog een drempel.
Begin met de onzichtbare oplossingen. Werkt dat niet, dan pas iets zichtbaars. Elke zichtbare hindernis kost je aanvragen, en dat is meestal duurder dan wat spam.
Begin met onzichtbare maatregelen en houd puzzels met verwrongen letters achter de hand.
Elke zichtbare hindernis kost je echte aanvragen. Dat is meestal duurder dan het opruimen van wat spam. Een onzichtbaar veld dat alleen robots invullen, werkt beter dan een puzzel. Je bezoeker merkt er niets van. Voeg desnoods een tijdcontrole toe: een formulier dat in twee seconden binnenkomt, is geen mens.
Krijg je formulieren binnen die je niet kunt beantwoorden, of haken mensen af bij het invullen? Stuur me de link via het formulier hieronder. Ik loop je velden na, test de foutmeldingen en kijk wat er verplicht zou moeten zijn. Vermeld je plaats, dan weet ik meteen waar je zit.
Waar kan ik je mee helpen?
Ook bekend als: Controle, veldcontrole, formuliervalidatie