A/B splittest med Visual Website Optimizer + 10 ting du kan teste

501 Total
visninger
Hent tjeklisten med de 10 optimeringsforslag her

I dag vil jeg fortælle om A/B Splittest, hvordan du kommer godt i gang, og jeg vil give dig 10 ting, du kan teste ved hjælp Visual Website Optimizer.

Velkommen til OnlinePartners TV. Kender du det med, at du sidder og nørkler med dit website, og pludselig bliver du i tvivl om, hvilken overskrift du skal skrive her, er den her produkttekst god nok, eller hvor skal det her banner være på forsiden. Ved hjælp af en A/B Splittest kan du træffe den rigtige beslutning for dit website baseret på data i stedet for gætterier.

En A/B Splittest fungerer ved, at du viser halvdelen af dine brugere en version af din hjemmeside og den anden halvdel en anden version af dine hjemmeside, eksempelvis med to forskellige overskrifter, og så måler du på, hvilken version, der klarer sig bedst. Målet kan eksempelvis være salg i en webshop eller henvendelser fra potentielle kunder i et konsulentbureau. Det lyder måske enormt kompliceret at sætte op, men faktisk er det rigtig nemt i dag med moderne værktøjer. Et af disse værktøjer er Visual Website Optimizer, som jeg har valgt at vise dig i dag. Det er brugervenligt og nemt at gå til, og især hvis du har bare en lille forståelse for HTML og CSS, men selv hvis du ikke har, så se med alligevel – det er nemmere, end du tror. Nu vil jeg vise dig, hvordan du gør.

Det vi ser her er dashboardet, og det første, du skal gøre, når du starter en ny splittest, er at vælge en af disse forskellige testtyper, der er i Visual Website Optimizer. Den første er A/B Splittesten, som er den, vi skal bruge i dag, og der laver man to forskellige versioner af sit website via det her værktøj og bruger programmet til at justere forskellige elementer på websitet. Den næste er Split URL Test, og her kan du i din backend, hvis du har mulighed for det, lave to forskellige versioner af dit website, som du selv laver på din backend, og så skal de her to forskellige URL’er, og så det eneste, som Visual Website Optimizer egentlig gør, er at sende halvdelen af trafikken ind på det ene URL og den anden halvdel ind på det anden URL.


Den næste er Multivariate Test, og her kan du ændre forskellige elementer på websitet på én gang – det vil sige, du kan ændre en overskrift og måske farven af en knap, og så prøver Visual Website Optimizer selv at lave alle mulige forskellige versioner af de her kombinationer, så du måske får 10 forskellige kombinationsmuligheder, som den så vil stå og teste igennem, og så kan du få at vide, hvilke elemeter, der virker bedst sammen. Det kan være, at en rød knap fungerer bedst i en overskrift, hvor du skriver “billigt” eller en blå knap sammen med noget, hvor du skriver “god kvalitet”.

Nu er siden blevet loadet ind i programmet, og umiddelbart når man sidder og kigger, så ligner det jo bare en almindelig hjemmeside, men, som du måske kan se, så når jeg holder musen over nogle ting, så kommer der sådan en blå ramme omkring. Hvis jeg gerne vil ændre noget, så klikker jeg egentlig bare det på element, jeg gerne vil ændre. Jeg kunne prøve at ændre den her overskrift først, så jeg klikker på den, og så kommer der en menu frem med forskellige ting, jeg kan gøre. Lad os prøve at tage den her ‘Change text’. Så står der så ‘Toast of the dark side’, og det gør vi så, at vi kan prøve at skrive ‘Awesome toaster of the dark side’ i stedet for. Jeg trykker done, og hvis du lægger mærke til det her, så den nye tekst faktisk ændret på sitet, og det er med det samme design bibeholdt og alting. Hvis du kigger hernede, så ligger den som variation 1, og så ligger control’en heroppe. Hvis jeg klikker på control’en, så er det, som det var før, og så kan jeg klikke hernede, hvor vi så har den nye variant.

Lad os prøve at ændre en ting til. Normalt skal man helst ikke ændre flere ting i en test, når man laver en klassisk A/B Splittest, fordi så ved man ikke, hvilket element, der har virket, men lad os prøve at gøre det her for demonstrationens skyld. Købsknappen hernede er orange, og måske det kunne være, at det ville være bedre med en anden farve, så jeg klikker på den igen, vælger ‘Style’, og herinde er så de forskellige indstillinger, og hvis man ved lidt om CSS, så kan man godt genkende, hvordan det her ser ud. Jeg trykker nede på ‘Background’, og så kan man så se den orange farve hernede, og så er der faktisk bare sådan en smart farvevælger. Nu prøver jeg så at vælge, at den skal være lysegrøn i stedet for. Jeg trykker ‘Done’, og nu kan jeg se, at den i min variant er blevet lysegrøn, mens den i control’en stadig er orange.

En anden ting, vi kan prøve at teste, er at fjerne elementer på websitet. Hernede har vi nogle ’social’ knapper, og jeg trykker variant igen for at få den grønne variant af knappen frem igen. Nogle gange kan det faktisk være en god idé ikke at have alt for mange ‘del-på-facebok- lignende funktioner på sin webshop, fordi det tager fokus væk fra, at folk egentlig skal købe ens produkter. Det kan i hvert fald være værd at teste. Nu klikker vi her og får boksen frem med de forskellige valgmuligheder, og så kan man faktisk bare vælge ’Remove’. Nu er det helt væk i varianten, men stadig på min control.

Du kan også vælge størrelsen af elementer på websitet. Lad os prøve at tage prisen. Jeg kunne tænke mig, at det var fysisk større, så det var nemmere at se, hvad tingene koster. Jeg klikker på prisen og vælger ‘Style’. Igen har vi mine forskellige CSS-indstillinger her, og jeg klikker på font size, ændrer det til 60 pixel i stedet for og trykker ’Done’. Sådan der. Nu er der i hvert fald ikke nogen tvivl om, hvad Darth Vader toasteren koster.

Nu har vi lavet to forskellige versioner af vores website. Vi har vores ‘Control’ og vores ‘Variation’, så nu skal vi finde ud af, hvilken en der virker bedst. For at gøre det bliver vi nødt til at lave et mål, og på en webshop giver det mest mening at måle, hvor meget man har solgt. Hvis den variant med den grønne købsknap eksempelvis sælger mere end den med den orange købsknap, så er det forholdsvist simpelt, fordi så bør man nok have den grønne købsknap på sit website. Så jeg klikker på næste hernede, og så skal vi definere, hvordan programmet her skal finde ud af, at den, der har fået den ene variant, har lavet et køb i vores webshop. Hvis du kender lidt til Google Analytics og målsporingen der, så virker det faktisk lidt på samme måde her. Så vi tager, at vi gerne vil måle, at folk går ind på et særligt URL, og så tager vi ‘URL Contains’, og så jeg valgt, at det skal være ‘order/thankyou.html’, og det vil så være kvitteringssiden for tak for din ordre. Hvis du eksempelvis er et konsulentbureau, kan det være, at dit mål skal være, at folk de ringer til dig, så er du nødt til at have en eller anden form for calltracking på dit website, men det kan godt være, at du har en kontaktformular, som folk skal udfylde, og der fungerer det meget på samme måde. Du vælger egentlig bare kvitteringen for ‘Tak, vi har modtaget din henvendelse. Vi svarer inden for et par dage’.

Nu mangler vi egentlig bare at få defineret de sidste par indstillinger, så jeg klikker næste hernede igen, og så har vi selve indstillingerne på kampagnen. Lad os prøve at kalde den ‘Orange købsknap’. Så kan vi finde ud af ude i vores oversigt, hvilken kampagne vi er i gang med nu. Vi klikker hernede på ‘Integrer med tredjepartsprodukter’, og så er det i øvrigt en rigtig god idé at sende dataene til Google Analytics, fordi så for man mulighed for bedre at kunne segmentere, hvordan forskellige brugere, der har fået de forskellige versioner, har opført sig. Desuden så klikker vi også hernede på avancerede indstillinger, og så er det faktisk altid en god idé at sætte noget skema på, fordi med Visual Website Optimizer betaler du for en vis pulje af visninger, og for at din månedlige kvota ikke bare skal blive brugt, fordi du lavede en fejl på en tekst eksempelvis, så er det en god idé at sætte et loft på, så den stopper, når den har nået et x-antal besøgende. Jeg tager altså ‘Run till X visitors’, og så alt efter hvor meget trafik man har på ens website, og hvor stor ens pakke hos Visual Website Optimizer er, så sætter man loftet her, og lad os sætte det til 10.000 visninger – og så er det egentlig bare at klikke ‘Finish’ hernede.

Nu er vi næsten klar til at starte vores kampagne. Man kunne selvfølgelig bare trykke ‘Start now’, men der er nogle ting, vi lige skal have styr på først. Vi skal sørge for at vores trackingcode her er installeret på alle undersider på dit website, og det fungerer meget ligesom Google Analytics. Det er en lille stump kode, du sætter ind i header’en på dit website, og der er det ret vigtigt, at du husker, at den her trackingcode også skal være på dine konverteringssider som fx tak-siden, som vi definerede tidligere. Lige nu her står de alle sammen som røde, fordi koden ikke er installeret, siden det jo ikke er vores website, vi leger med, men de her vil simpelthen blive grønne, når du har installeret koden rigtigt. Der kan godt lige gå lidt tid, før den opdaterer, hvis du har lidt problemer med at få det til at spille. Lige nu tester vi egentlig kun på ét produkt, som er den her Darth Vader toaster, og jeg kunne måske godt tænke mig at teste, at den kørte på alle vores produkter på webshoppen, så den går ind og laver de her ændringer, gør købsknappen grøn osv., på alle mine produkter. Herovre i højre side kan man se de forskellige indstillinger, man har defineret, og nu klikker vi på blyanten, som fører os ind i ‘Settings’. Vi klikker på URL, og som du kan se, så står der det ene URL her på toasteren, men så klikker vi oppe på ‘Advanced mode’, og så kan vi vælge URL-matches i stedet for og så sige ‘URL Contains’ eksempelvis, fordi det kommer lidt an på, hvordan ens webshop er bygget op. Nu ved jeg, at på den her webshop hedder de alle sammen, alle produkterne ligger i den her mappe, der hedder /product/. Det, jeg gør nu, er, at jeg har fjernet resten af URL’et og sagt ‘URL Contains’, og nu vil Visual Website Optimizer automatisk påføre de her ændringsregler på alle undersider af dit website, der har /product/ i URL’et.

Nu er vi klar til starte testen, så jeg trykker save og på startknappen heroppe, når trackingcoden selvfølgelig virker. Nu skulle testen gerne virke. Prøv at åbne det i en alternativ browser, prøv at få en kollega til at åbne websitet, og se om du kan se de her to forskellige versioner, der gerne skulle køre nu.

Nu har du fået en grundlæggende intro til, hvordan du kan bruge Visual Website Optimizer til at træffe bedre beslutninger for dit website og optimere det så, at du tjener flest mulige penge hjem på dine besøgende. For at hjælpe dig godt i gang vil jeg her give dig 10 tips til ting, du kan overveje at teste og optimere på dit website.

Du kan med fordel teste:

1. Dine knapper
– Skal de være grønne eller orange, og hvor store skal de være?

2. Overskrifter på dit website
– Skal der stå ‘Billige produkter’ eller ‘Produkter af høj kvalitet’

3. Call to actions
– Test, om det virker bedst, at der står ‘Få et uforpligtende tilbud’ eller ‘Bestil mere (info)’

4. Størrelsen på de vigtige elementer på din side
– Især priser. Hvor tydeligt skal de fremgå?

5. Linjeskift og luft mellem elementer
– Bliver siden mere eller mindre overskuelig med lidt ekstra white space?

6. Dit check-out flow
– Skal du have one-step check-out eller en købsproces i flere trin?

7. Placering af vigtige elementer på siden
– Skal et banner stå til højre eller venstre i skærmbilledet eksempelvis?

8. Din USP’er
– Hvilke fordele ved at handle hos dig skal du nævne på siden for at få den besøgende til netop at vælge din shop frem for alle dine konkurrenters?

9. Billeder og andre grafiske elementer
– Prøv at skifte billederne ud på dine vigtige landingssider og se, om det gør en forskel.

10. Fjern distraktioner på dit website
– Har du noget, der tager opmærksomheden væk fra dine primære call to actions, så prøv at skjule dem.

Det var 10 ting, men generelt kan du teste langt det meste, du er i tvivl om angående dit website. Nu har du en idé om, hvordan du kommer igang med en A/B Splittest, og hvad du kan teste, men inden du for alvor går i gang, er der lige nogle ting, du skal overveje. Det første er, om du har trafik nok. Du skal meget gerne have et klart svar på, hvilken variant, der er vinderen, og det kan du kun få inden for en rimelig tid, hvis du har mange besøgende på dit website og dets undersider. Oftest skal du gerne have 1000 salg for at få et statistisk validt svar på, hvilken version, der virker bedst. Hvis det tager dig et halvt år at få 1000 salg, så er Splittesten nok ikke noget, du bør bruge din tid på lige nu. Invester i stedet din energi i at få mere trafik til dit website med SEO, AdWords og nyhedsbreve. En anden ting, du bør overveje, er, om du har is nok i maven til at lade en test køre, der umiddelbart ser ud til at koste dig penge. Det sker ofte, at din testvariant, som du forventede ville være fantastisk, klarer sig dårligt i starten, og det ser ud til at koste dig 20% af dit salg til de besøgende, der får vist denne testvariant. Dette tal er bare på ingen måde statistisk signifikant, og vi ser ofte, at en vindende testvariant klarer sig dårligt i starten, men når datamængden stiger, så har det måske vendt sig, og nu vinder testvarianten og giver 20% mere i salg. Derfor skal du meget gerne lade din test køre, ind til du har sikkerhed på mindst 98%. Hvad den statistiske sikkerhed er, kan du nemt se inde i afrapporteringen for Visual Website Optimizer. Med det i baghovedet skulle du nu gerne være klar til at foretage din første Splittest og dermed meget gerne finde optimeringer til din hjemmeside, der skaffer dig flere penge i kassen

Det var så min introduktion til A/B Splittest samt 10 ting, du kan prøve at teste. Husk du kan hente en checkliste med mine forslag via linket under videoen. Har du spørgsmål eller feedback, hører jeg meget gerne fra dig, så brug endelig kommentarfeltet.

Tak, fordi du så med.

Værter: Morten Nevado
Dato: 04.02.16
Læs mereSkriv en kommentar

Et svar til “A/B splittest med Visual Website Optimizer + 10 ting du kan teste

Skriv et svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *

Tip a friend
Felter markeret med en * skal udfyldes

NYESTE VIDEOER

Morten Nevado
I DENNE VIDEO
Morten Nevado