Bruna vond de checkoutfrictie die zijn funneldata niet kon laten zien

Over Bruna

Bruna is een Nederlandse boekhandel. Bruna verkoopt rechtstreeks online en heeft een landelijk netwerk van fysieke winkels, en is onderdeel van Audax. Daardoor heeft de website een dubbele rol: het is een direct verkoopkanaal en een belangrijk leadkanaal voor de winkels. De drive-to-store-strategie van Audax komt op meerdere momenten in de klantreis terug, dus elke wijziging in de checkout raakt zowel de online conversie als het winkelbezoek.

Stap twee van de Bruna-checkout, waar kopers kiezen tussen thuisbezorging en gratis afhalen in een Bruna-winkel. Dit project was een samenwerking van drie partijen. NeoSEM, het bestaande online marketingbureau van Bruna, vertaalde de inzichten naar concrete optimalisaties en voerde die door. Exatom leverde de formulieranalyse, de gedragsdata op veldniveau en relevante benchmarks. Audax zette als moederbedrijf de drive-to-store-context neer waarin de wijzigingen moesten passen.

De uitdaging

Bruna en NeoSEM hadden toegang tot funneldata op stapniveau. Ze zagen in welke stap bezoekers afhaakten in de checkout of de accountregistratie, maar niet waarom. Frictie op veldniveau was volledig onzichtbaar.

Bruna zag welke checkoutstap kopers kostte, maar niet welk veld de oorzaak was.

• Alleen funneldata. In projecten als dit was NeoSEM normaal gesproken beperkt tot de funneldata die beschikbaar was.
• Twee flows in scope. De checkout en de CRM-gedreven accountregistratie hadden allebei direct invloed op omzet en klantwaarde.
• Elke wijziging twee keer gewogen. Omdat de website ook winkelbezoek oplevert, kon geen enkele optimalisatie alleen op online conversie worden beoordeeld.

Het doel was structurele conversiegroei in de checkout en het aanmaken van een account, door de frictie in beide te vinden en weg te nemen.

De oplossing

Het project liep in twee fases. In de kick-off spraken Exatom en Bruna de scope af, de prioriteiten, wie wat zou doen en de afhankelijkheden daartussen.

Daarna gingen de Exatom-tags live. De meting is volledig cookieless en privacy-first: er worden geen persoonsgegevens opgeslagen en er is geen toestemming via een cookiebanner nodig. Daardoor waren de data compleet en niet vertekend door bezoekers die toestemming weigerden, wat juist in een checkout het zwaarst weegt. Vanaf dat moment legde elk invoerveld interacties, fouten, correcties, autofill-gedrag en bestede tijd vast, zonder dat een sessie of bezoeker individueel herkenbaar was. Validatieregels, HTML-attributen zoals type en autocomplete, en foutmeldingen werden automatisch van de pagina uitgelezen.

Voordat de analyse begon, valideerde het team de data en bevestigde het dat elk event correct werd geregistreerd. Zo had het een betrouwbare dataset om de analyse op te baseren.

In de analysefase werkte NeoSEM in Exatom met vijf maatstaven per veld: foutpercentage, correctiepercentage, autofillpercentage, gemiddeld conversiepercentage en tijd tot conversie. De benchmarks van Exatom hielpen om de verbeterkansen te onderbouwen en de prioriteiten te bepalen.

Hoe Exatom Bruna helpt

Autofill herstellen met de juiste HTML-attributen

Formulieranalyse leest de HTML-attributen van elk veld uit, en een aantal velden had de verkeerde. Waar de juiste autocomplete-waarde ontbreekt, kan de browser het veld niet automatisch invullen.

De data lieten zien wat dat kostte: een lager autofillpercentage en een langere tijd tot conversie. Bezoekers moesten alles zelf typen, vaker typen, zichzelf vaker corrigeren en de context van elk veld zelf uitzoeken. Dat verhoogt de cognitieve belasting en daarmee de kans dat een bezoeker vertrekt. De attributen werden gecorrigeerd, voor een hoger autofillpercentage en een kortere tijd tot conversie.

Een verplicht veld verwijderen dat niemand gebruikte

In zowel de checkout als de accountregistratie moesten bezoekers een aanhef invullen. Het was een verplicht veld, weergegeven als keuzerondjes, en bezoekers zagen het vaak over het hoofd. Het bleek de grootste bron van foutmeldingen in de eerste stap.

De informatie had voor marketing gebruikt kunnen worden, maar dat gebeurde niet. Dus koos het team ervoor het veld helemaal te verwijderen.

Voorletters accepteren in het voornaamveld

Ook een eenvoudig naamveld zorgde voor problemen. Bezoekers typten regelmatig alleen hun voorletter in het voornaamveld, maar de validatie eiste minimaal twee tekens. Eén voorletter leverde een foutmelding op, wat de cognitieve belasting verhoogde en tot drop-off leidde.

De fix was het minimum te verlagen, zodat een voorletter wordt geaccepteerd.

Het giswerk weghalen uit het veld voor kortingscode en cadeaukaart

Het veld voor kortingscode en cadeaukaart bleek complex. Eén flow ondersteunt meerdere kaarttypes met heel verschillende regels: numerieke kaarten met een vaste lengte, alfanumerieke codes met een variabele opbouw en in sommige gevallen een verplichte pincode. Al die complexiteit kwam bij de koper terecht. Zonder duidelijke structuur, automatische opmaak of validatie per kaarttype moesten kopers zelf uitzoeken welk formaat werd verwacht.

De data lieten een verhoogd foutpercentage, correctiepercentage en tijd tot conversie zien op dit veld. Het gebeurde precies op het moment dat een koper al had besloten te kopen, waardoor een ondersteunend veld een conversierisico werd. Het veld werd opnieuw opgebouwd met validatie per kaarttype, automatische opmaak en duidelijkere foutmeldingen.

De betaalknop op mobiel in beeld brengen

Op mobiel herhaalt de laatste checkoutstap eerst de ordergegevens. In combinatie met heatmaps concludeerde het team dat te weinig bezoekers de knop “Bestellen en betalen” meteen zagen.

NeoSEM ontwierp een lay-out met de knop hoger in beeld en rolde die als experiment uit in zijn testplatform. Het doel was een hoger startpercentage op de laatste checkoutstap en uiteindelijk meer aankopen.

De resultaten

• Een hoger autofillpercentage en een kortere tijd tot conversie, door de HTML-attributen te corrigeren zodat browsers de velden weer kunnen invullen.
• De grootste bron van foutmeldingen in stap één verdwenen, omdat het veld voor de aanhef, dat geen marketingfunctie had, werd verwijderd.
• Duidelijkere regels op twee velden, dankzij een validatie van de voornaam die voorletters accepteert en een veld voor kortingscode en cadeaukaart met validatie en opmaak per kaarttype.
• Een mobiel experiment op de laatste stap, dat een betaalknop hoger in beeld test om het startpercentage van de laatste checkoutstap te verhogen.

De case laat zien dat checkoutconversie niet alleen in de grote stappen verloren gaat. Vaak lekt ze weg via kleine, technische details in afzonderlijke velden. Met Exatom werd frictie zichtbaar die traditionele funneldata structureel niet laat zien. Het resultaat waren scherpere beslissingen, gerichte experimenten en optimalisaties die cognitieve belasting en bezoekersgedrag direct aanpakken, met aantoonbaar hogere conversie als uitkomst.

Bij Bruna hebben we Exatom ingezet om frictie in de checkout en de accountregistratie precies aan te wijzen. Niet op sessieniveau, maar op veldniveau. Daardoor werd meteen duidelijk waar gebruikers vastliepen, aarzelden of onnodige fouten maakten. Die inzichten waren concreet genoeg om er direct mee aan de slag te gaan. Exatom sluit perfect aan bij hoe wij CRO aanpakken: datagedreven, praktisch en gericht op meetbare resultaten.

Klaas Bongers
E-commerce Manager, Bruna.nl

Wat volgt

Dezelfde tag die de velden meet, legt ook form session replays vast, dus de volgende vraag kan worden beantwoord door te kijken wat bezoekers op een veld doen, niet alleen door te tellen. Voor het cadeaukaartveld zouden Smart Nudges het verwachte formaat kunnen uitleggen op het moment dat een koper aarzelt, en Autofixes zouden ongeldige invoer kunnen blokkeren voordat de validatie die afwijst, zonder developer. Dit zijn suggesties, geen implementaties.

Andere retailers gingen deze route al eerder. Brooks Running EMEA schaalde zijn veldfixes op over heel Europa, en INNO verhoogde de voltooiing van de laatste stap met één Smart Nudge. Eureka, de AI CRO-assistent van Exatom, maakt van dezelfde velddata een geprioriteerde lijst met fixes. Ontdek waar conversie weglekt in je eigen checkout of formulieren: vraag een demo aan of bekijk de prijzen.