7 Forbedringer af din
Checkout Process
Christian Holst · christian@baymard.com · baymard.com

2 large scale usability research studier, 3 år
I dag kigger vi på et uddrag af disse research resultater

Omtale:
Kunder:

Checkout Processen

67.3% gns. abandonment rate
Selv små forberdringer er ‘big business’
en reduktion fra 67% til 65% abandonment rate er 60.000 extra per år for hver 1.000.000 i årlig omsætning

Seamless and simple (yet intelligent)
checkout process

Detaljerne (fokus i dag)
Er ikke ødelæggende individuelt, men “mange
bække små” ødelægger checkout oplevelsen.
Jo flere du får forkert jo mere vil dine kunder
opfatte din checkout som “langsom”,“kedelig” eller
“idiotisk”.
Basis
Tilbyd ‘Gæste’ checkout, vis fragt omkostninger i
kurven, forsendelses addresse = faktura address,
tydelige og konsekvente primær knapper, et
lineær checkout flow, etc.

7 checkout forbedringer
63 checkout forbedringer
+ 147 for mobil

7 Forbedringer af din
Checkout Process

1. Forstærk betalingsfelterne visuelt
89% gør det ikke

Brugere har lille teknisk viden om form felter,
SSL, og PCI.
1. Forstærk betalingsfelterne visuelt

Forstærk det visuelle udtryk af betalingskort felterne
via indramming, baggrunds farver, positionering af
“sikkerheds” ikoner, etc.
1. Forstærk betalingsfelterne visuelt

2. Påkræv ikke (tilsyneladende) ligegyldig info
61% gør det forkert

Kunderne føler du invaderer deres
privatsfære når du tvinger dem til at
indtaste “unødvendig” personlige data.
F.eks.‘* Required’ telefon nummer eller
fødselsdato uden yderliger forklaring.
2. Påkræv ikke (tilsyneladende) ligegyldig info

Forklar hvordan den personlige information vil
blive brugt, f.eks telefon og e-mail:
2. Påkræv ikke (tilsyneladende) ligegyldig info
Target.com: “for shipping-related questions”
Victoria’s Secret: tooltip

3. Beskriv form felter yderligere
92% gør det forkert

Hvad skal jeg taste?
‘Sikkerhedskode’, ‘Addresse linie 1’ og 2,
forkortelser,
Hvordan skal det skrives?
Telefon nummer, password, datoer, kort nummer
Hvor finder jeg det?
Sikkerhedskode, kupon/certifikater, ID numre
1/4 muligheder:
prøve sig frem, besøge din ‘Hjælp’ sektion, ringe
til din support, eller forlade din side.
3. Beskriv form felter yderligere
Størstedelen af test deltagerene havde problemer
med at forstå visse form felter og tilhørende label

Dynamisk: Twitter sign-up form
3. Beskriv form felter yderligere
Inline tekst: Coastal.com
Tooltip: Amazon

4. Brug ikke ‘Opdater’ knapper
72% gør det forkert

Når en ‘Opdater/Tilføj’ knap blev anvendt til
at opdatere kun en sektion af en checkout
form, gjorde test deltagerne en af følgende:
- Klikkede ikke på den, (selv hvis de udfyldte
de relevante felter)
- Misforstod den som den primære knap
(“Næste”)
4. Brug ikke ‘Opdater’ knapper

Vær opmærksom på enhver ‘Opdater’ knap (typisk
brugt til kuponer, gavekort, vare antal i kurven,
fragt udregnere)
Anvened i stedet Auto/Live opdatering of værdier
og sider fremfor opdaterings knapper.
4. Brug ikke ‘Opdater’ knapper

5. Flyt friktion til ‘Tak for Ordren’ siden
49% gør det ikke

Ringe udnyttelse af “tak for ordren” siden.
5. Flyt friktion til ‘Tak for Ordren’ siden

Flyt registrering til efter ordren. Genbrug alle
ordre data og spørg kun om password.
Anden “friktion” der kan flyttes til efter ordren er:
nyhedsbrev, kundeundersøgelser, mersalg, del på
social medier, m.v.
5. Flyt friktion til ‘Tak for Ordren’ siden

6. Ha’ intelligente standard valg
15% gør det forkert

6. Ha’ intelligente standard valg
Fjern friktion ved at lave åbenlyse valg (din
web statistik afslører hvad flertallet af dine
kunder vælger).

6. Ha’ intelligente standard valg
Fjern friktion ved at lave åbenlyse valg (din
web statistik afslører hvad flertallet af dine
kunder vælger).

6. Ha’ intelligente standard valg
HP.com: Størstedelen af kunderne
behøver ikke tage stillings til, eller
overhovedet forstå, komplicerede valg.

7. Giv mulighed for at ‘redigere’ når du
viser bruger inputs 40% gør det ikke

Ingen mulighed for at gå tilbage
for at ændre valg og data
7. Giv mulighed for at ‘redigere’ når du viser bruger inputs

Process trin som links
7. Giv mulighed for at ‘redigere’ når du viser bruger inputs

På mobil sites vil inline tekst links ofte
være bedre end process trin
7. Giv mulighed for at ‘redigere’ når du viser bruger inputs

1. Forstærk betalingsfelterne visuelt
2. Påkræv ikke (tilsyneladende) ligegyldig info
3. Beskriv form felter yderligere
4. Brug ikke ‘Opdater’ knapper
5. Flyt friktion til ‘Tak for Ordren’ siden
6. Ha’ intelligente standard valg
7. Giv mulighed for at ‘redigere’ når du viser bruger inputs

Ikke 2-3 ‘magic bullet solutions’ - men 10-30 mindre justeringer
(gns. 21 justeringer for top 100 US sites)
Ikke blot mængden af checkout trin, men hvad kunden skal gøre i hvert trin
(og hvordan du beder dem om det)
Seamless and simple (yet intelligent)
checkout process

7 Forbedringer af din
Checkout Process
Christian Holst · christian@baymard.com · baymard.com