En netbutik skal frem for alt bruge enkle, eksplicitte og hierarkiske knapper: "Læg i indkøbskurv" på produktarket, "Fortsæt til betaling" i indkøbskurven, "Opdag samlingen" for at guide navigationen og "Spørg om råd", når support er virkelig nyttig. Den bedste knap er ikke den mest originale: det er den, der tydeligt angiver det næste trin.
Hvad er en handlingsknap egentlig til?
En handlingsknap, eller CTA, gør en hensigt til et konkret skridt. Det kan bevæge sig mod køb, åbne en samling, tilføje et produkt til vognen, anmode om oplysninger eller afslutte en ordre. Dens effektivitet afhænger lige så meget af dens placering og ordlyd som af dens farve.
Den mest nyttige regel er enkel: en skærm bør have indlysende prioritet. På et tilgængeligt produktark er hovedhandlingen generelt at tilføje til indkøbskurven. Linket til størrelsesguiden, deling eller tilføjelse til favoritter forbliver sekundært. I kurven bliver prioritet til betaling.
De væsentlige knapper i en online butik
Læg i indkøbskurv
Dette er produktarkets vigtigste CTA. Det bør forblive synligt efter valg af varianter og tydeligt angive, om der mangler en mulighed.
Fortsæt til betaling
I kurven fører denne knap utvetydigt til kassen. Undgå at få det til at se ud på samme måde som "Fortsæt med at handle".
Opdag kollektionen
På startsiden eller en redaktionel side retter den sig mod et præcist udvalg. En konkret titel er bedre end et vagt "Lær mere".
Spørg til råds
Nyttigt til tekniske, tilpasselige eller højinvolverende produkter. Det fuldender købet uden unødigt at udskifte hovedknappen.
Giv mig besked om returneringen
For et utilgængeligt produkt giver returen til lageradvarsel et ærligt næste skridt i stedet for at lade en købsknap være inaktiv.
Se min ordre
Efter køb skal sporingshandlinger være adskilt fra kommercielle CTA'er og præcist beskrive destinationen.
Hvilken knap skal man bruge afhængigt af siden?
Samme besøgende har ikke samme intention på velkomsten, en kollektion eller et produktblad. Hierarkiet skal derfor udvikle sig over kurset.
| Page | Hovedaktion | Sekundær handling mulig | For at undgå |
|---|---|---|---|
| Home | Oplev en bestemt kollektion eller tilbud | Se hvad der er nyt | Flere konkurrerende knapper i samme banner |
| Collection | Se produktet | Filtrer eller sorter | Et hurtigt køb uden tilstrækkelig information |
| Produktblad | Læg i indkøbskurv | Størrelsesguide eller råd | Sociale CTA'er mere synlige end køb |
| Kurv | Fortsæt til betaling | Fortsæt indkøb | En ekstern kampagne, der omdirigerer fra kassen |
| Blogartikel | Opdag det relevante produkt eller den relevante tjeneste | Læs en linket guide | En kommerciel knap, der ikke er relateret til emnet |
Hvordan skriver man formuleringer, der giver dig lyst til at klikke?
Teksten skal annoncere det umiddelbare resultat af klikket. Start med et handlingsverbum, hold det kort og undgå overdrevne løfter. "Se sommerkjoler" er mere informativ end "Klik her". "Modtag guiden" er mere præcis end "Send".
Design, kontrast og mobil: reglerne for at respektere
Reserver den mest synlige farve til prioritets-CTA og brug en mere diskret stil til sekundære handlinger. En knap skal kunne genkendes som et klikbart element, med et behageligt klikområde, læsbar tekst og synlig tilstand, når du svæver eller fokuserer.
På mobilen skal hovedknappen forblive let at nå uden at skjule vigtige oplysninger. En fuld bredde fungerer ofte godt, så længe du opretholder sidemargener og ikke stabler flere faste søjler. Kontroller også lange variationer, forstørrede tekster og oversættelser.
Fejl, der svækker opfordringer til handling
Farve alt
Hvis hver knap fanger øjet så meget, angiver ingen prioritet. Hold en dominerende farve til hovedhandlingen.
Skift ordforråd
"Køb", "Bestil" og "Tilføj" bør ikke tilfældigt betegne det samme trin. Konsistens er betryggende.
Skjul betingelser
En CTA bør ikke erstatte de oplysninger om prissætning, levering, tilgængelighed eller variation, der er nødvendige for beslutningen.
Optimer kun modtagelse
Produktarket og kurven er ofte tættere på konvertering. Deres hierarki fortjener prioriteret opmærksomhed.
For et bredere syn på rejsen, læs også sådan forbedres Shopify indkøbskurv og hvorfor besøgende forlader en butik uden at købe.
Hvilken service skal du vælge for at forbedre dine CTA'er?
Gratis mini-audit
Egnet, hvis du vil identificere nogle synlige prioriteter, før du overvejer en bredere intervention.
Optimering af produktblade
Vælg, hvornår problemet fokuserer på produktpræsentation, hierarki omkring køb og klarhed i oplysninger.
Shopify butik redesign
Relevant, hvis CTA'erne, navigationen, samlingerne, produktbladene og kurven skal harmoniseres sammen.
Personlig anmodning
Præsenter konteksten, de pågældende sider og de tekniske begrænsninger for at modtage en passende anbefaling.
Praktisk tjekliste før du udgiver dine knapper
- En enkelt hovedhandling dominerer hver skærm.
- Formuleringen beskriver netop næste skridt.
- Den vigtigste CTA står i kontrast til baggrunden uden at miste læsbarheden.
- Sekundære handlinger er visuelt mere diskrete.
- Knappen forbliver brugbar ved 375 px bredde.
- Variationer og fejl viser en klar instruktion.
- Kliket fører til den annoncerede destination.
- Tastatur og fokus giver dig mulighed for at bruge knappen.
- Pris, levering og tilgængelighed forbliver synlig før køb.
- Ruten testes fra reception til bekræftelse.
e-handel handling knap FAQs
Hvilken farve skal jeg bruge til en Tilføj til kurv-knap?
Brug en farve, der er tilstrækkeligt kontrasteret med produktarkmiljøet, og reserver den til hovedhandlingen. Der er ingen universelt vindende farve: konsistens med mærket og læsbarhed betyder mere.
Skal du skrive "Køb nu" eller "Læg i indkøbskurv"?
"Læg i indkøbskurv" svarer til den klassiske rute, som giver dig mulighed for at fortsætte med at handle. "Køb nu" er kun egnet, hvis klikket rent faktisk fører til en direkte købsrejse, og hvis denne acceleration er nyttig.
Hvor mange knapper kan der vises på et produktark?
Der kan være flere handlinger, men kun én skal dominere. Købet forbliver hoved; størrelsesguiden, råd, favoritter eller deling bør være sekundære og klart differentierede.
Er en fast knap nederst på skærmen anbefalet på mobil?
Det kan gøre det nemmere at lægge i indkøbskurv på et langt produktark, så længe du ikke skjuler indhold, variantvalg eller vigtige meddelelser. Det skal testes på flere skærmstørrelser.
Kan ikoner bruges uden tekst?
For almindelige handlinger som indkøbskurv eller søgning kan et ikon fungere, hvis dets betydning er indlysende, og tilgængelig formulering er tilvejebragt. For afgørende handling forbliver eksplicit tekst at foretrække.
Hvor skal man placere hovedknappen på et produktark?
Placer den i nærheden af den pris, de variationer og de oplysninger, der er nødvendige for beslutningen, i den hurtigt synlige del. Den skal fremgå efter de obligatoriske valg og før det meget detaljerede sekundære indhold.
Hvordan ved jeg, om en CTA skal ændres?
Analyser klik, frafald og brugerfeedback, og kontroller derefter først rejsens klarhed. Test en ændring ad gangen: ordlyd, kontrast, position eller hierarki for at forstå dens effekt.
Omdan dine knapper til klare trin undervejs
SiteQuiVend kan undersøge hierarkiet i dine CTA'er, dine produktblade og din købsrejse for at kunne guide dig mod målrettet optimering eller et mere globalt redesign, afhængigt af butikkens reelle tilstand.
