Seth Godin kaller Call-To-Actions for bananer. Og brukerne dine, er apekatter. Målet for apekatten er å finne bananen på under 3 sekunder – før de gir opp og drar sin vei. Oppmerksomhetstiden til apekattene går stadig nedover, så nå begynner hvert nanosekund å bli kritisk.

Som webdesigner og UX’er er det få dager man ikke tenker på, peker på, eller snakker om Call-To-Actions (CTA). Vi slenger uttrykket rundt oss som akevitt på julaften, og mesker oss i den varme følelsen som kommer når man har fått bekreftet en økning i klikkrate. Men denne følelsen blir fort revet bort om man en dag får en sjokkerende tilbakemelding: «Antall klikk er 12,2% under gjennomsnittet», «Antall klikk er redusert med 3%», «Klikkraten er under ønsket målsetning». En kan ikke forvente gull og grønne skoger hver gang, innholdet bestemmer fremdeles utfallet også. Men, det er en rekke ting du kan gjøre for å sørge for at knappen din blir «flinkeste gutten i klassen». Her er en oppfriskning av gammel men god musikk, og kanskje noe nytt.

Hva er en Call-To-Action?

Kort fortalt er en CTA en lenke, og manifesterer seg som regel som en knapp med tekst. Målet med en CTA er å få brukeren til å klikke videre til et salg eller skjema osv. En god CTA gjør det enkelt for brukerne å klikke, og gir dem gode grunner for å gjøre det også. Disse klikkene kan resultere i økt salg og profitt, og det er nettopp dette som gjør dem så viktig. Men en god CTA strømlinjeformer også nettstedet ditt, og gjør ferden gjennom sidene til en behagelig reise. Når man skal lage en god CTA, er det viktig å tenke på følgende:

 

1. Prioritering

Uansett hva du gjør, må du sørge for at hver enkeltside på et nettsted kun ha ett primærmål. Det er alltid ett gjøremål som er viktigere enn de andre. Finn ut hva det er og fokuser på det. Det må være tydelig, og nærmest hoppe i fanget til brukeren. Mesteparten av verdiene i et nettsted er bygd opp av disse gjøremålene, eller «Red-Routes», og det er du som designer som bestemmer veien. CTA-knapper er en fin måte å fjerne friksjon som bremser brukerens fremdrift på nettstedet, og de gjør det ved å tiltrekke seg oppmerksomhet.

 

2. Ordlyd

En CTA på en dårlig designet landingsside er ofte det eneste som kommuniserer med brukeren hva han/hun skal foreta seg. Ofte krever en CTA en del etterarbeid av brukeren. Det ligger gjerne litt tyngre prosesser, skjema osv. bak fasaden på disse fine knappene. Men det finnes ord som trigger salg og handling.

 

Som et minimum bør man prøve å formulere fordelene ved klikk. Brukerne er nesten alltid interessert i å FÅ noe.

 

Ikke bruk generiske beskrivelser på handlinger som er et direkte resultat av hva som skjer når du trykker på en knapp, f.eks. Send inn eller Send forespørsel sier ingen ting om hva brukeren får igjen for det. Man må huske å kommunisere fordelen ved å trykke på knappen.

 

Vi vet at nysjerrighet trigger klikk, og er en faktor som krever minimal forpliktelse fra brukeren.

 

Det lønner seg altså å være mer spesifikk i forhold til hva brukeren faktisk oppnår ved å klikke. Et eksempel kan være å kutte ut handlingsbaserte ord, og heller belønne med resultatet. Bestill brosjyre forklarer hva man må igjennom for å få en brosjyre, imens Få brosjyre går rett på resultat og ikke prosess. Ren A/B-testing har vist at å bytte ut ordet Bestill til øker konverteringsraten med 38% .

Det kan være et behov for å minimere brukerforpliktelsen ved hvert steg – vi vet jo at brukere vegrer seg for å gi fra seg for mye informasjon, penger eller tid. Et eksempel er å få brukeren til å prøve produktet før kjøp, der hvor det er mulig. Split-testing viser at oppfordringen Prøv nå v.s. Kjøp nå senker terskel for klikk såpass mye at man oppnådde 47% flere konverteringer. (Try now or Buy now) På denne måten senker man skuldrene på brukeren og tar bort bekymringen fra klikket. Man beroliger brukeren for å få klikk.

Noen ganger kan det også lønne seg å ha en bisetning på, under, eller ved CTA-knapper.

 

Som et ekstra krydder kan man legge til eller lignende tidsrelaterte ord som gir brukeren et inntrykk av det haster. Det er stor forskjell på Donér og Donér nå. Uten ordet får man ikke noe inntrykk av at dette er viktig, og kortmappen hviler trygt i lommen. Legger man til Donér nå – få gratis t-skjorte, så gir man brukeren enda et incentiv for klikk. Ikke bare haster det, jeg får faktisk noe ved å klikke.

Et sekundært valg tett inntil ønsket primærhandling kan være en fin måte å få brukeren dit man vil med å gi dem et litt mindre “farlig” valg som et alternativ.

 

Ofte kan det være greit å plassere en sekundærhandling i umiddelbar nærhet av primær-CTA. Denne kan gjerne være enda mer lavterskel enn primær-CTA, slik at en fanger opp de brukerne som vegrer seg for den, og velger det litt mindre «farlige» valget. Vil ikke brukeren ha en banan, gi ham et kirsebær. På denne måten kan du bruke litt mer tid på å overtale dem på å velge bananen til slutt.

Du må kunne kommunisere følgende for å få brukeren til å klikke på din CTA:

  1. Brukerne må få informasjonen de trenger før de klikker
  2. Brukerne må ha CTA lett tilgjengelig
  3. Brukerne må ønske seg det som befinner seg på andre siden av CTA

 

3. Design

Det er mange meninger som sirkulerer rundt hva som er den beste utforming for en CTA. Nå er det ikke slik at den finnes én ultimat CTA som løser alle verdensproblemer, men det forholder seg faktisk slik at enkelte farger og former konverterer bedre enn andre. Det finnes derimot mange andre ting man også må ta hensyn til når man skal utforme en optimal CTA på et nettsted. Plassering, størrelse, marg, og kontrast er vel så viktig for å oppnå best effekt. Og dette finnes det ikke ett svar på. Men det finnes noen do’s-and-dont’s her også:

 

Farger er den mest påfallende faktoren ved en CTA, og foruten om den klassiske blå tekstlenken ($80 millioner fargen), er det er ikke til å stikke under en stol at knapper i orange/rødt konverterer bedre på et generelt plan. Rødt er den eneste fargen som faktisk øker hjerteraten ved å stimulere hypofysen, men er også en farge som ofte forbindes med fare, gjeld og negativitet. Oransje har vist seg å være det nærmeste man kommer en «optimal» CTA-farge, da den kombinerer aggressiviteten til rødt og munterheten til gult, og kommer som regel seirende ut i split-testing (Eks: Red buttons) Den største gevinsten får man uansett dersom man tar i bruk komplementærfarger som står i kontrast til resten av nettstedet. Eks: Er profilen på nettstedet oransje fra før, er gjerne grønt den beste CTA-fargen.

Forskning som studerer optimalisering av landings-sider foreslår at man plasserer CTA langs stien øynene følger instinktivt når man kommer på en ny side. En selvfølge er imidlertid å plassere CTA «above the fold» på nettstedet, ellers hopper apekatten videre før du får blinket. Et godt utgangspunkt er å plassere den i øvre høyre kant av siden, f.eks i headeren eller ved siden av et produkt. På et generelt plan må plasseringen være tydelig og lett å finne.

Som designer må du sørge for å balansere avstanden mellom konkurrerende elementer og støttende faktorer for å skape en logisk kobling.

Whitespace, eller marger, er en annen effektiv måte å fremheve CTA på. Mye marg kan fremheve CTA og sørge for at den ikke forstyrres av andre masende elementer på siden. Som designer må du sørge for å balansere avstanden mellom konkurrerende elementer og støttende faktorer for å skape en logisk kobling. Dersom CTA krever en kort introduksjonstekst eller beskrivelse (som oftest gjør de det), sørg for at dette kommer tett nok inntil CTA-knappen slik at brukeren naturlig grupperer disse sammen.

Som en hovedregel er det greit å huske at CTA må skille seg ut fra resten av innholdet. Enten det er bakgrunnsfargen, tekstfargen, størrelsen eller plasseringen, så må knappen lett identifiseres som det naturlige neste steget for brukeren å ta.

Happy hunting!