Tien tips voor betere contactformulieren

Tien tips voor betere contactformulieren

Op de Hogeschool Utrecht hebben studenten onder begeleiding van Jaap van de Putte van 2 use it een onderzoek uitgevoerd naar de usability van contactformulieren op gemeentelijke websites. Het betreft hier een expert-review en geen klantonderzoek. In totaal zijn zeven gemeenten onderzocht. Het artikel met tips over betere webformulieren is te vinden op de site van 2 use it.

Bij de beoordeling van de formulieren hebben de onderzoekers twee vragen gesteld; Zijn de formulieren effectief en efficiënt (bereikt de gebruiker zijn doel en kan de gebruiker met een minimale inzet van tijd zijn taak afronden)? En: Welke adviezen kunnen gegeven worden?

Uit het onderzoek zijn een tiental praktische tips naar boven komen drijven, die hieronder kort genoemd worden:

  1. Gebruik geen Wissenknop of een equivalent daarvan Op alles sites stond een ‘wissen’ knop in het contactformulier, naast de ‘verzend’ knop. Deze knop dient geen enkel doel: niemand wil zijn input wissen.
  2. Valideer formulieren Het is wel zo handig dat een formulier volledig ingevuld wordt. Anders heb je er nog niets aan. Bij de gemeente Alphen was het bijvoorbeeld mogelijk om een leeg formulier in te sturen
  3. Plaats foutmelding in het formulier zelf Pop-ups, nieuwe velden, het levert alleen maar afleiding op. Gewoon in het formulier is het allerbeste, zie je gelijk wat er fout is gegaan.
  4. Geef een duidelijke foutmelding Foutmeldingen zijn op de gemeentesites nog wel eens ongespecificeerd. Dat is niet handig, want dan weet de gebruiker niet wat hij precies fout heeft gedaan en waar.
  5. Maak formulieren ‘sticky’ Een van de grootste ergernissen bij gebruikers is dat een ingevuld formulier wordt gewist. Maar daarom de fomulieren ‘sticky’: de invoer blijft plakken in de invoervelden.
  6. Vraag informatie op die nodig is, niet meer en niet minder Contactformulieren invullen kost tijd. Vraag daarom niet meer dan nodig is aan informatie. Elk veld dat moet worden ingevuld verhoogt de drempel en verlaagt de kans op een volledig ingevuld formulier.
  7. Zorg voor een prettige en rustige lay-out Zorg ervoor dat gebruikers zo weinig mogelijk worden afgeleid. Het is belangrijk dat het formulier een goede focus heeft.
  8. Plaats toelichtingen zoveel mogelijk in de pagina Een belangrijke richtlijn vanuit de literatuur over usability is dat informatie op zichtbaar is, zonder dat de gebruiker eerst de muis moet gebruiken.
  9. Gebruik radiobuttons in plaats van dropdownkeuzelijsten Radiobuttons hebben een hogere ‘usability’ dan dropdownkeuzelijsten (uitklaplijsten). Het verdient daarom de voorkeur radiobuttons te gebruiken.
  10. Rond het gesprek netjes af Met een contactformulier communiceer je met een gebruiker. Het is daarom handig om die communicatie ook op een nette manier te beëindigen als de gebruiker klaar is. Dat doe je door te zeggen dat het formulier ontvangen is, wat er met de informatie gedaan gaat worden en hoe lang dat gaat duren.

Maar: dit zijn ze nog niet allemaal. Hieronder nog een paar, die wat meer algemeen zijn:

  • Zorg dat het formulier werkt in verschillende soorten browsers
  • Zorg dat de beschrijving, het invoerveld en de eventuele beschrijving gekoppeld zijn (via label en id; geen enkele site gebruikt dit).
  • Zorg voor een privacy-melding (ontbreekt op alle gemeentesites).
  • Ga niet onnodig naar een beveiligde omgeving (https-verbinding).
  • Filter gegevens op de server zodat validaties minder nodig zijn.

Het betreft hier een onderzoek naar alleen gemeentelijke websites. En dat is natuurlijk een beperking. Maar goed, bijna iedere site heeft wel een contactformulier. Om goed contact met je klanten te onderhouden is het uiterst belangrijk dat het allemaal werkt. Gezien de veelheid aan tips, tricks en punten ter verbetering die hierboven beschreven staan lijkt het geen overbodige luxe om het contactformulier van je eigen site eens onder de loep te nemen. Misschien valt er nog wat te verbeteren…

 


Delen



Er zijn 24 reacties op dit artikel

  • Ja maar tegenwoordig komt er ook een hoop spam binnen via een contactformulier. Daaraan moet tegenwoordig ook gedacht worden.

    geplaatst op
  • Aanvulling: 36 Checks & tips voor usability van formulieren.

    Uit het onderzoek zijn een tiental praktische tips naar boven komen drijven
    Hoe zijn deze tips in het onderzoek precies naar boven gekomen dan? Welke methode is gehanteerd?

    Daarnaast kan er voor een grote selectie volgens mij beter voor een select element gekozen worden in plaats van radiobuttons. Daarnaast zou ik niet willen valideren, liever alleen een telefoonummer dan iemand die afhaakt omdat hij iets in moet vullen wat hij niet wil.

    geplaatst op
  • Prima lijst. Het is een mooi geformuleerde samenvatting van (niet geheel nieuwe) punten.

    Aansluitend bij punt 4 en 8 zou ik nog willen wijzen op de mogelijkheid om deze te combineren. Soms blijkt uit een gemaakte fout dat een bezoeker meer hulp nodig heeft dan alleen de melding van een fout. In zo'n geval kan je behalve een duidelijke foutmelding een toelichting tonen die helder uiteenzet hoe het wel moet en eventueel waarom.

    In het geval dat bijvoorbeeld persoonlijke gegevens niet ingevuld zijn zou je kunnen toelichten waarom je die informatie wil weten. Deze benadering helpt mensen op weg en bouwt vertrouwen. Dat is altijd weer goed voor de conversie.

    Groet,
    Floris Nijdam,
    Advance

    geplaatst op
  • liever alleen een telefoonummer dan iemand die afhaakt omdat hij iets in moet vullen wat hij niet wil.

    Dat hangt er vanaf wat je minimaal moet weten om het een nuttig formulier te laten zijn. Als iemand aangeeft een reactie per mail te willen dan heb je weinig aan alleen een telefoonnummer.

    Irritant vind ik het wel als website bepaalt hoe ik mijn telefoonnummer moet invullen. 010-1234567, 0101234567 en (010) 1234567 zijn allemaal goed maar veel websites zijn het er niet mee eens. Hetzelfde voor bijvoorbeeld postcode: 1234AB en 1234 AB moeten kunnen. Vaak kom ik tegen dat je maar 6 tekens mag gebruiken.

    geplaatst op
  • Klopt Tobi. Als je graag in bepaalde formats de gegevens wilt ontvangen kun je de verschillen in schrijfwijzes beter op de server opvangen en daar omzetten naar het gewenste format. Zo kan bijvoorbeeld op de server alle spaties worden verwijderd en deze op de gewenste plekken weer worden toegevoegd.

    geplaatst op
  • Leuk artikel en veel bevestiging, zie ook een eerdere post op marketingfacts. En als aanvulling op punt 10 (rond het gesprek netjes af) wil ik hier aan toevoegen: doe aan up- en cross sell. Juist in deze fase zijn klanten nog warm.

    geplaatst op
  • Het zijn wel allemaal inkoppertjes. Niet echt spannend. Maar kan me goed voorstellen dat het nog vaak fout gaat.

    geplaatst op
  • Hoi Michel, De tips zijn vrij triviaal, maar op dit niveau gaat het nog vaak mis. Er is niet één formulier bij de onderzochte gemeentes die "foutloos" een test op deze tips doorstaat. Verder hebben we bewust gekozen om de tips heel concreet te formuleren, zodat de aanbevelingen begrijpelijk en goed uitvoerbaar zijn.

    geplaatst op
  • Mooi lijstje en vooral heel concreet. Wat ik zou willen toevoegen vanuit usability:

    1 Gebruik kleuren voor de call-to-actions(groen/ oranje/ rood) die belangrijk zijn of gebruik kleuren voor de verplichte velden

    2 (I) Infolayers met uitleg van de opties in het formulier en hoe te gebruiken

    3 Maximaal 7 vragen/ inputvelden per invoerscherm in verband met de scanbaarheid

    geplaatst op
  • Wel aardig om te lezen dat het toch zo vaak fout wordt gedaan, een simpel contact formuliertje. Wat ik idd ook vaak zie is dat je gewoon een leeg formulier kan verzenden en dat er dan netjes een bedankje wordt gegeven. Niet heel handig is dit :)
    Meeste punten hou ik wel rekening mee, alleen zet ik er tot nu toe altijd nog een wissen knop naast. Zit er standaard ingebakken denk ik. Zal em voortaan wel weglaten. Klinkt iig logisch dat mensen niet hun zojuist ingevoerde gegevens willen wissen...

    geplaatst op
  • "1 Gebruik kleuren voor de call-to-actions(groen/ oranje/ rood) die belangrijk zijn of gebruik kleuren voor de verplichte velden"

    Kleuren kunnen een mooie extra ondersteuning zijn, maar zeker gemeente sites moeten rekening houden met toegankelijkheid. Daar valt ook kleurenblindheid onder.

    Groet,
    Floris Nijdam
    Advance.

    geplaatst op
  • Toch wel goed om dit even te lezen.
    Het is nooit verkeerd om dit soort puntjes even na te lopen.

    geplaatst op
  • "1 Gebruik kleuren voor de call-to-actions(groen/ oranje/ rood) die belangrijk zijn of gebruik kleuren voor de verplichte velden"
    Inderdaad is het vanuit oogpunt van toegankelijkheid af te raden om informatie alleen met kleur over te brengen. Groen/rood is daarin met name als combinatie af te raden.

    "2 (I) Infolayers met uitleg van de opties in het formulier en hoe te gebruiken"
    Als de layers pas getoond worden bij mouse-over zou ik ze ook niet gebruiken (zie tip 8).

    "3 Maximaal 7 vragen/ inputvelden per invoerscherm in verband met de scanbaarheid"
    Het maximum van 7 wordt vaak gehanteerd omdat dat ongeveer de geheugenspanne is van ons korte termijn geheugen. Dit speelt echter geen rol op een website omdat je daar onbeperkt lang kunt kijken. Het maximum aantal invoervelden mag dus wel meer dan 7 zijn en is afhankelijk van meer factoren, bijvoorbeeld de complexiteit van een vraag en de wenselijkheid van tussentijds opslaan van je invoer.

    geplaatst op
  • Tja, ook bezig met contactformulieren voor een site in opdracht van de ambtenarij. Het mag niets kosten dus validatie e.d. hoeft allemaal niet. Ze scannen zelf de lege / foute mailtjes wel werd mij verteld. Als het maar niets zou kosten. Had ik al gezegd dat het niets mag kosten? Een contactformulier in al zijn eenvoud is in 15 minuten online. Een contactformulier in volle glorie is 2 uur werk. Maar goed, het mag niets kosten.

    geplaatst op
  • Personeelskosten zijn geen kosten tenslotte. Laat staan secundaire kosten als slechtere service.

    Over verplichte velden gesproken (die niet in het lijstje worden genoemd.) Volgens mij is de meestgebruikte (en meest begrepen) manier om die te markeren met een *.

    Heeft er trouwens iemand voorbeelden van hele goede formulieren? Ik ben wel benieuwd hoe anderen vinden hoe het wel moet.

    geplaatst op
  • Persooneelskosten zijn geen kosten idd, maar een resource. En die moet je opgebruiken. Vriend van mij is na een half jaar niets doen als gedetacheerd IT-er bij een ministerie maar aangenomen tegen een redelijk absurd salaris omdat de kosten te hoog werden maar ze hun resources nog wel wilden aanvullen.

    geplaatst op
  • Prima tips, maar jammer dat er niet specifiek aan gemeenten aandacht wordt besteed. De tips zijn algemeen, snap de focus op gemeenten dan ook niet. Zijn er geen specifieke gemeentelijke tips? :)

    Ben verder net als Andre benieuwd hoe het onderzoek is gedaan. Wat was de rol van de studenten? In de PDF (http://www.2useit.nl/downloads/10-tips-voor-betere-webformulieren-2useIT-20070705.pdf) staan wel wat concretere handreikingen trouwens.

    geplaatst op
  • De focus lag om een tweetal redenen op gemeenten. De eerste was praktisch: we zochten als testcase 7 websites van organisaties uit dezelfde branche. Zo konden de studenten ook onderling hun resultaten vergelijken (vorig jaar hebben we de zorgverzekeraars bekeken). De tweede reden was dat gemeenten allemaal sterk met e-dienstverlening (webintakesystemen) bezig zijn, dus wij waren benieuwd hoe juist zij het zouden doen op dit gebied. We hebben ook specifiek naar de toegankelijkheidsaspecten gekeken die spelen voor gemeenten (DrempelsVrij-richtlijnen, Stijlgids en vooral de Webrichtlijnen Overheid), maar dat bleek een brug te ver: in de basis waren er al teveel (usability-)problemen, die ons inziens belangrijker waren. En geen enkele site voldeed aan de Webrichtlijnen. Niet één formulier had bijvoorbeeld een goede koppeling tussen de tekst van een invoerveld en het invoerveld (met label en id). Hopelijk kunnen we ze volgend jaar gaan toetsen op de Webrichtlijnen.
    Over de rol van de studenten: zij kregen eerst enige theorie over formulieren en vervolgens zijn ze in groepen van 4 de formulieren van een gemeentesite gaan onderzoeken. De resultaten zijn door ons in uniforme rapporten verwerkt en aan de gemeenten verstuurd. Op basis van alle onderzoeksbevindingen zijn wij tot een top 10 gekomen.

    geplaatst op
  • >> Groen/rood is daarin met name als combinatie af te raden.
    Wel goed lezen ;)
    Het gaat hier om het call-to-action gebruik (zoals 'verder','opslaan','aanmelden,'verzenden') waarbij in de leer der Usability dit ook wel stoplicht of TV-kleuren wordt genoemd. Ook Windows en andere human interfaces kennen deze veel gebruikte en voor de user geconditioneerde kleuren. Het gaat dus om of groen, rood maar ook veel gebruikt: oranje. De stoplichtkleuren zijn de befaamde kleuren die ook http://www.drempelvrij.nl beheersen en de vroegere contrastkleuren van http://www.drempelsweg.nl/smartsite.dws?lettertype=&id=45

    Zie tevens dit usability-onderzoek uit 11/2006 waar met een knipoog naar Nielsen goede en werkbare tips worden gegeven. Onder andere het gebruik van iconen wordt goed aangehaald.

    In de lessen Online Marketeer en Internet Manager heb ik diverse gemeenten(Zwolle, Eindhoven, Veldhoven, Enschede, Leiden, Warmond) in de les gehad. Belangrijk om te weten is dat ze de wettelijke verplichting hebben om 60-70% van hun dienstverlening online te brengen. Ondanks dat hier geen echte sanctie op staat is er wel wat druk aanwezig bij de diverse organen.
    Tevens is er een visie gaande vanuit de hogere overheid dat de Accessibility bij de diverse lagere organen op orde moet zijn. Wil je ver gaan in de prior 1 en prior 2 dan kent ook een formulier nogal wat haken en ogen.

    De uitdaging bij de formulieren lijkt mij het volledig rekening houden met Accessibility-aspecten waarbij een gemeente een laag-opgeleide tot hoog-opgeleide en vooral multilanguage doelgroep kent. Het gebruik van info-buttons die in meerdere talen en op meerdere manieren uitleg geven(spraak) lijkt mij bij een gemeente onvermijdelijk.

    Wij hebben (zie (Sorry=reclame)AtMost even zoeken op project IKEA Intranet ) voor IKEA in de voorbereiding een test gedaan naar de lengte van categorie-en maar ook formulieren en elementen. Er moesten veel processen(bestellingen, sollicitaties, inkoopverwerking, beoordelingen onder andere) naar het web. Als je daar kanabiliseert met andere media als telefoon, papieren formulieren of persoonlijke aanvragen(net als bij de gemeente?) dat moet het web de noodzakelijke meerwaarde bieden. Ogenschijnlijk korte en snel in te vullen formulieren deden het aldaar in het vooronderzoek goed. Met termen als 'snel', 'gemakkelijk' en 'overzichtelijk' werd het in fase 1 goed ontvangen. In de fases erna is het bijschaven op basis van interactief gebruik een must. Bij IKEA zijn we bezig met icoon-conditionering aangezien we een gesloten doelgroep hebben met heavy-use en herhaalgebruik van de content en navigatie. Concreet: als je doelgroep breed is dan zal je moeten blijven bijschaven om de juiste niet-discriminerende concessie te bereiken. Een wet waar de gemeentes sterk mee te maken hebben.

    Zeker een goed onderzoek dat veel losmaakt maar wellicht een opening voor een nog bredere visie kijkende naar gemeente-doelgroep en de wettelijke verplichtingen.

    Er is nog veel werk te doen voor consultants.
    [url=http://www.onlinemarketeer.tv target=usability>Grtz. Patrick Petersen [/url]

    geplaatst op
  • Aan de ene kant opperde ik ook vaak dat een 'annuleren' knop onzin was .. Daar begin ik op terug te komen .. Hoe weet een argeloze internet gebruiker namelijk dat als hij toch liever niets in wil vullen, dat zijn gegevens niet 'in de computer zitten' als het formulier niet leeg gemaakt wordt? Het staat immers al op het beeld in de site .. (niet van toepassing bij sites voor tech/internet savvy personen natuurlijk, maar bij sites zoals de gemeente ....)

    Ik mis een punt, misschien wel de meest belangrijke: test 'live' de inhoud van het veld tijdens invoer op mogelijk foute invoer, of op zijn minst wanneer iemand naar een volgend veld gaat ..

    een pagina moeten her-laden (en vaak zelfs alle eerder ingevulde gegevens kwijt zijn) om te merken dat je niet naar de volgende stap gaat zoals verwacht is erg irritant .. 'U deed iets fout! En wel dit, dat en die! Doe het nu goed! Dank u'

    geplaatst op
  • Hoi Matthijs,
    "knop annuleren": ik denk dat de argeloze internetter meer last heeft van het feit dat hij per ongeluk op "Wissen" drukt, dan dat hij zich afvraagt hoe hij een (deels) ingevulde pagina weer kan verlaten. In het laatste geval bevestig je hem ook nog in zijn onjuiste gedachte, namelijk dat een deels ingevuld formulier al is opgeslagen. Het gebruik van de knop wordt ook afgeraden door de Webrichtlijnen Overheid.
    "test 'live' de inhoud van het veld": dit staat er in als aanbeveling 3, zij het impliciet. Wij hadden dit eerst wel opgenomen en een onderscheid gemaakt in validatie na versturen of tijdens invulling (via Ajax). In snelheid maakt dat weinig uit, het gebruiksgemak is wel iets beter, maar daar staat tegenover dat het meer programmeerwerk eist. Niet alleen de validatie met Ajax dient gemaakt te worden. Ook de validatie na versturen dient te werken. Voor user agents (browsers en zo) die geen Ajax kennen, moet de validatie ook werken. Wij hebben gekozen voor eenvoud in onze aanbevelingen: wij zijn al blij als de validatie in het formulier plaats vindt, met of zonder Ajax.
    En dat velden gewist worden na het herladen dat mag natuurlijk niet (aanbeveling 5).

    geplaatst op
  • Dag Patrick,
    "Wel goed lezen ;)": Ja, dat had ik wel. Ik schrijf dat enkel het gebruik van kleur om informatie over te brengen af te raden is (zie DrempelsVrij-richtlijnen). Maar zoals jij het uitlegt is dat zeker een aanvulling en een verbetering voor formulieren.
    Enkele links in je reactie werken niet; wellicht kan de moderator die nog aanpassen ??

    geplaatst op
  • Top! Eindelijk iemand die formulieren beschrijft waarvoor ze bedoeld zijn: "functioneel en duidelijk" met de nadruk op "Less is more" Hou het doelgericht, anders haakt je doelgroep af en dan is veel werk voor niets. Ga zo door.

    geplaatst op
  • In reactie op Tobi, vrijdag 6 juli 2007, 13:19:
    Een heel mooi formulier is het formulier van Wakoopa: zie http://wakoopa.com/account/signup. Dit werkt met Ajax. Ik denk dat dit soort Ajax-achtige oplossingen wel de toekomst hebben.

    geplaatst op

Plaats zelf een reactie

Log in zodat je (in het vervolg) nóg sneller kunt reageren

Vul jouw naam in.
Vul jouw e-mailadres in. Vul een geldig e-mailadres in.
Vul jouw reactie in.

Herhaal de tekens die je ziet in de afbeelding hieronder


Let op: je reactie blijft voor altijd staan. We verwijderen deze dus later niet als je op zoek bent naar een nieuwe werkgever (of schoonmoeder). Reacties die beledigend zijn of zelfpromotioneel daarentegen, verwijderen we maar al te graag. Door te reageren ga je akkoord met onze voorwaarden.