Da jeg skitserede layoutet for en model-webshop med kaffe i 2014, gav det mening at beskrive header, forside, kategori og produktdetalje næsten som byggeklodser: logo til venstre, kurv til højre, filtre her, købsknap dér.
Folks grundlæggende forventninger har ikke ændret sig meget. Det har konteksten: De fleste designs skal fungere på mobilen, tilbuddene er mere komplekse, og hvert ekstra script konkurrerer om hastighed og opmærksomhed. Derfor anbefaler jeg ikke længere at kopiere et layout blindt. Jeg anbefaler at gennemgå kundens opgaver.
Headeren skal orientere, ikke vise alle muligheder
I headeren leder folk efter brand, navigation, søgning, konto og kurv. De behøver ikke alle have samme tyngde. Prioriteten ændrer sig med sortimentet og købsfasen.
- Logoet fører hjem og har et forståeligt tekstnavn.
- Søgning er let at finde, når folk kender et produkt eller en parameter.
- Kurven viser sin status og forsvinder ikke, efter en vare er tilføjet.
- Kontakt eller hjælp kan findes uden at konkurrere med købet.
- Menuen fungerer med berøring, tastatur og uden præcis musestyring.
En skuffemenu kan hjælpe et bredt sortiment. Med ti kategorier er den ofte bare en imponerende forhindring. Google anbefaler at gøre kategorier og produkter tilgængelige gennem almindelige navigationslinks; søgning alene viser måske ikke hele sortimentet til robotter. Principperne er beskrevet i dokumentationen om webshopstruktur.
Forsiden skal fordele trafikken, ikke fortælle hele sortimentet
På forsiden skal jeg hurtigt kunne forstå, hvad butikken sælger, hvem den er til, og hvor jeg skal fortsætte. I stedet for en automatisk slider foretrækker jeg én tydelig prioritet og flere stabile indgange til de vigtigste købssituationer.
Bestsellere kan hjælpe, ligesom sæsonkategorier, rådgivning eller en grund til at have tillid til butikken. Hver blok skal have en opgave. »Så siden ikke er tom« er ikke en opgave.
En kategori hjælper med at indsnævre valget
En kategori er ikke SEO-tekst, der er klistret over et produktgitter. Den er et beslutningsværktøj. Navnet og den korte introduktion definerer tilbuddet, filtre indsnævrer det, og sortering hjælper med kundens situation.
- Navngiv filtre med kundernes sprog, ikke med interne databasefelter.
- Vis aktive valg efter filtrering, og gør dem lette at fjerne.
- Gør vigtige underkategorier synlige som links, ikke kun som scriptværdier.
- Vis de listedata, der er nødvendige for sammenligning; læg resten i detaljen.
- Et tomt resultat bør tilbyde en vej tilbage, ikke en blindgyde.
Brødkrummer hjælper folk med at forstå deres placering i sortimentet og kan hjælpe søgemaskiner med at forstå hierarkiet. Hvis du bruger strukturerede data, skal du følge Googles aktuelle dokumentation om brødkrummer.
Produktdetaljen skal besvare spørgsmål før og efter knappen
En synlig »Læg i kurv«-knap er fundamentet, ikke hele detaljen. Før beslutningen har folk brug for navn, pris, variant, tilgængelighed, levering, returnering, fotografier og information, der passer til købsrisikoen.
For kaffe er oprindelse, smag, ristning, vægt og tilberedning vigtige. For en boremaskine er specifikationer, kompatibilitet og service vigtigere. Der findes ingen universel rækkefølge. Der findes ét universelt spørgsmål: Hvad skal kunden vide for at købe den rigtige variant og ikke returnere den senere?
Anmeldelser bør være troværdige og handle om det konkrete produkt. Anbefalede varer bør understøtte valget, ikke lede nogen væk fra et næsten afsluttet køb. En social knap på en produktdetalje er stadig ikke en prioritet. Vi burde være kommet videre fra tiden, hvor en like-knap var svaret på alt.
Kurv og checkout skal fjerne overraskelser
Kurven skal gøre det muligt at ændre antal og variant samt fjerne varer. Vis totalpris, levering og leveringsdato så tidligt som muligt, ikke efter tredje trin og registrering.
Gæste-checkout er ofte et fornuftigt standardvalg. Hvis en konto giver reel værdi, så tilbyd den efter ordren. Formularer har brug for korrekte labels, autofuldførelse og fejl, der forklarer, hvad der skal rettes. Trykfelter skal være store nok; det aktuelle kriterium er beskrevet i WCAG 2.2 under Target Size.
Mål opgaver, ikke knappens farve
A/B-test kan hjælpe, når en virksomhed har tilstrækkelig trafik, én hypotese og en afgørende måling. Ugentlige bannerændringer uden et tilstrækkeligt datagrundlag er en legeplads, ikke en pålidelig konklusion.
Jeg følger brugen af søgning og filtre, handlinger med »Læg i kurv«, formularfejl, frafald ved hvert trin, returneringer og spørgsmål til support. Jeg supplerer tallene med observationer af mennesker og deres spørgsmål. Analytics viser hvor; et menneske forklarer ofte hvorfor.
Grundlaget for måling findes i Google Analytics 4. Jeg gennemgår performancekontroller i Sådan gør du en hjemmeside hurtigere.
En webshop behøver ikke være original i forhold til, hvor kurven er. Den skal være overbevisende om, hvorfor man skal købe dette produkt her.
For argumenter på produkt- og salgssider kan du fortsætte med Vigtige elementer på en salgsside. Det komplette fundament for hjemmesiden findes i Sådan starter du et webprojekt.