Brugeren kom ikke for at kigge på din side
Det er en af de vigtigste ting, man kan glemme, når man designer en hjemmeside.
Virksomheden ser sin side som en helhed. Den ser logoet, overskriften, billederne, tilbuddet, salgsargumenterne, knapperne, referencerne, formularen, menuen og alle de oplysninger, som er blevet omhyggeligt forberedt.
Brugeren ser noget helt andet.
Når han ser siden, tænker han oftest ikke: „Mon ikke firmaet har designet sin informationsstruktur interessant?”. Han analyserer heller ikke bevidst hele layoutet.
Han har et konkret mål.
Han vil finde prisen. Tjekke, om virksomheden tilbyder en bestemt ydelse. Finde ud af, om man kan stole på leverandøren. Finde telefonnummeret. Sammenligne løsninger. Tjekke, om produktet passer til hans behov.
Og netop derfor ser brugeren ikke på siden, som dens skaber gør.
Hans opmærksomhed er selektiv. Han leder efter oplysninger, som kan hjælpe ham med at nå sit mål, og de øvrige elementer springer han ofte over. Brugsundersøgelser har i årevis vist, at brugere kan ignorere elementer, der bogstaveligt talt er på skærmen, hvis de ikke passer til deres aktuelle mål eller ligner reklameindhold.
Det fører til en meget vigtig konklusion: Det er ikke nok at placere information på siden. Man skal også designe de betingelser, hvorunder brugeren lægger mærke til den, forstår den og anser den for vigtig.
Hvorfor klikker vi overhovedet på noget?
Et klik er afslutningen på en kort beslutningsproces.
Brugeren skal først lægge mærke til elementet, derefter forstå, hvad der kan ske efter at have brugt det, vurdere, om det er værd at udføre handlingen, og afgøre, at omkostningen ved handlingen er acceptabel.
Man kan derfor forenkle denne proces: opmærksomhed → fortolkning → vurdering → beslutning → handling
Det betyder ikke, at hver bruger bevidst gennemgår fem trin i træk. Mange beslutninger er meget hurtige og automatiske. Netop derfor hænger design af brugergrænseflader så tæt sammen med psykologien bag perception og beslutningstagning.
Knappen „Køb nu” kan være helt tydelig, men hvis brugeren ikke ved præcis, hvad han køber, klikker han ikke.
Knappen „Send” kan teknisk set fungere helt fint, men hvis brugeren ikke ved, hvad der sker efter afsendelse af formularen, kan han blive afventende.
Linket „Læs mere” kan være æstetisk, men hvis det ikke er tydeligt, hvad brugeren får mere at vide om, er dets værdi langt mindre.
Derfor handler god UX ikke om at tvinge brugeren til at klikke.
Det handler om at designe vejen fra behov til handling på den rigtige måde.
Opmærksomhed er en begrænset ressource
Designere opfører sig ofte, som om brugeren havde et ubegrænset opmærksomhedsbudget...
- Hvert element virker vigtigt.
- Overskriften er vigtig.
- Tilbuddet er vigtigt.
- Certifikaterne er vigtige.
- Kundeanmeldelserne er vigtige.
- Billedet er vigtigt.
- Case studyet er vigtigt.
- Nyhedsbrevet er vigtigt.
- Kampagnen er vigtig.
- Kontakt er vigtig.
Problemet er, at hvis alt skal være det vigtigste, får brugeren ikke information om, hvad der er vigtigst lige nu.
Selektiv opmærksomhed er en naturlig mekanisme til at begrænse mængden af stimuli. Brugeren koncentrerer sig om den del af informationen, der er relateret til den aktuelle opgave, og kan ignorere resten. I brugstests har man observeret situationer, hvor brugere ikke lagde mærke til vigtige elementer i brugergrænsefladen netop fordi deres opmærksomhed var rettet et andet sted.
Derfor kan en side være fuld af information og samtidig give indtryk af, at der ikke er noget på den.
Ikke fordi brugeren er uopmærksom.
Men fordi hans opmærksomhed er selektiv.
„Men den knap er jo kæmpestor”
Det er et af de mest almindelige designargumenter.
„Men CTA'en er stor”.
„Den er i en stærk farve”.
„Vi har placeret den helt øverst”.
„Man kan ikke undgå at lægge mærke til den”.
Men „man kan ikke undgå at lægge mærke til den” betyder fra designerens perspektiv ikke „brugeren vil anse den for vigtig”.
Man kan øge et elements visuelle eksponering, men man kan ikke tvinge brugeren til at anse det for vigtigt.
Hvis brugeren leder efter prisen, og siden især fremhæver et kæmpestort marketingbudskab, kan han lade blikket glide forbi CTA'en, fordi hans opmærksomhed er rettet mod at løse et konkret problem.
Hvis han leder efter teknisk information, kan han ignorere billedet.
Hvis han vil kontakte virksomheden, kan han springe den udførlige beskrivelse af virksomhedens historie over.
Hvis han vil købe produktet, kan han springe halvdelen af teksten over og gå direkte efter prisen, varianter og leveringsbetingelser.
Synlighed er ikke det samme som betydning.
Hvorfor ignorerer vi ting, der ligner reklame?
Internettet har lært brugerne bestemte mønstre.
Hvis noget ligner en bannerannonce, befinder sig på et typisk reklameområde, er overdrevent animeret eller har en karakteristisk salgsfremmende stil, kan brugeren automatisk begrænse den opmærksomhed, der gives til dette element.
Dette fænomen kaldes banner blindness, altså bannerblindhed.
Det er vigtigt at bemærke, at det ikke kun gælder reklamer.
Et element kan indeholde virkelig værdifuld information, men hvis det visuelt ligner en reklame, kan brugeren behandle det som en reklame og springe det over.
Øjensporingsstudier fra Nielsen Norman Group bekræftede denne mekanisme i forskellige former for brugergrænseflader. Brugere har lært at ignorere områder og elementer, der associeres med reklamer, selv når de i det konkrete tilfælde indeholdt nyttigt indhold.
Det er en vigtig lektie for marketing.
Mere farve, større font og kraftigere fremhævelse betyder ikke altid mere opmærksomhed.
Nogle gange begynder et element netop på grund af overdreven eksponering at ligne noget, man bør springe over.
Brugeren læser ikke siden. Han skanner den som regel
En hjemmeside bliver meget sjældent læst fra start til slut som en bog.
Brugeren skanner først:
- Leder efter overskrifter.
- Fremhævede oplysninger.
- Priser.
- Produktnavne.
- Knapper.
- Navigationselementer.
- Ord relateret til hans problem.
Først når noget matcher hans behov, kan han bruge mere opmærksomhed på det.
Det betyder, at indholdsdesign ikke kun bør handle om at skrive en god tekst. Man skal også skabe en informationshierarki.
Hvis alle tekstfragmenter har nogenlunde samme størrelse, nogenlunde samme visuelle vægt og samme rytme, må brugeren selv udføre arbejdet med at afgøre, hvad der er vigtigt.
Jo mere af dette arbejde brugeren må udføre, desto større er risikoen for, at vedkommende opgiver.
Derfor besvarer et godt interface brugerens spørgsmål: “Hvad bør jeg være opmærksom på lige nu?”
Ikke ved at sige “se her”, men ved at skabe en passende informationsstruktur.
Førstehåndsindtrykket virker hurtigere, end du tror
Før brugeren læser detaljerne i tilbuddet, vurderer vedkommende siden som helhed:
- Ser den professionel ud?
- Virker den opdateret?
- Ligner den en side tilhørende en virksomhed, man kan stole på?
- Kan man se, hvad virksomheden beskæftiger sig med?
- Ser den sikker ud?
- Kan man finde ud af, hvor man skal klikke?
Det betyder, at sidens visuelle lag ikke kun er dekoration.
Det er en del af budskabet.
Et moderne design kan signalere teknologisk kompetence. En struktureret typografi kan antyde præcision. Gode billeder kan understøtte troværdighed. Et konsekvent brand kan øge genkendeligheden.
Men det virker også den anden vej.
Uaktuelle oplysninger, tilfældig typografi, inkonsekvente knapper, stockfotos, der ikke passer til branchen, eller sproglige fejl kan underminere troværdigheden, før brugeren har sat sig ind i det egentlige tilbud.
Derfor bør UX og branding ikke behandles som to helt adskilte områder.
Brugeren skelner ikke mellem dem som “design” og “marketing”.
Vedkommende opfatter dem som ét signal: “Kan jeg stole på denne virksomhed?”
Troværdighed påvirker viljen til at handle
Et klik behøver ikke at betyde et køb.
Det kan betyde at gå videre til tilbuddet, åbne en formular, downloade et dokument, starte produktkonfigurationen eller gå til næste trin.
I alle tilfælde tager brugeren en vis risiko:
- Bliver jeg ført derhen, hvor jeg forventer, når jeg klikker?
- Mister jeg data?
- Bliver formularen lang?
- Vil nogen begynde at ringe til mig?
- Bliver prisen skjult?
- Starter et køb, når jeg klikker?
- Sender siden mig ikke videre til et ukendt sted?
Det er netop derfor, mikrocopy er vigtigt.
“Send” siger ikke ret meget.
“Anmod om et gratis tilbud” siger meget mere.
“Tjek tilgængelighed” betyder noget andet end “Køb”.
“Start en gratis prøveperiode” mindsker andre bekymringer end “Opret en konto”.
God tekst ved handlingen reducerer usikkerhed.
Hvorfor øger enkelhed ofte sandsynligheden for handling?
Brugeren ønsker ikke at træffe unødvendige beslutninger.
Hvis vedkommende skal vælge mellem tre muligheder, kan det gøres hurtigt.
Hvis vedkommende skal vælge én ud af elleve, kræver det mere opmærksomhed at sammenligne dem.
Hvis hver mulighed desuden har forskellige vilkår, begrænsninger og konsekvenser, stiger den kognitive omkostning ved hele processen.
Derfor betyder forenkling af interfacet ikke kun “færre elementer”.
Det betyder også færre unødvendige beslutninger.
I adfærdsdesign henvises der ofte til BJ Foggs model, ifølge hvilken en adfærd opstår, når motivation, mulighed for at udføre handlingen og det rette signal er til stede samtidig. I praksis betyder det blandt andet, at selv et meget attraktivt budskab ikke er nok, hvis selve handlingen er for svær.
Hvis brugeren vil købe et produkt, men først skal:
- oprette en konto,
- bekræfte e-mail,
- indtaste en masse oplysninger,
- vælge en ekstra service,
- læse flere beskeder,
- gå igennem tre skærmbilleder,
- og først derefter se prisen,
så er problemet måske ikke manglende motivation.
Problemet kan være en for høj omkostning ved at udføre handlingen.
Et klik betyder ikke altid succes
Det er en meget vigtig sondring.
Man kan have en fremragende klikrate og samtidig et svagt forretningsmæssigt resultat.
Brugeren klikker på annoncen, men går straks tilbage igen.
Vedkommende klikker på knappen “Se tilbud”, men finder ikke det, der søges.
Formularen åbnes, men brugeren vil ikke oplyse telefonnummeret.
Brugeren går til indkøbskurven, men stoler ikke på betalingsmetoden.
Et klik er altså kun et af trinene i forløbet.
Derfor bør siden ikke optimeres udelukkende med fokus på antallet af klik.
Bedre spørgsmål er:
- Udførte brugeren den handling, vedkommende havde brug for?
- Kom vedkommende frem til det rigtige sted?
- Forstod vedkommende tilbuddet?
- Kom vedkommende videre?
- Opnåede vedkommende sit mål og samtidig sidens forretningsmål?
Det er særligt vigtigt i tilfælde af CTA’er, der udelukkende er designet til at øge CTR. Man kan skabe en knap, der tiltrækker stor opmærksomhed, men hvis løftet i CTA’en ikke svarer til det, brugeren får efter klik, kan en kortsigtet stigning i klik skade oplevelsen og tilliden.
Hvorfor scroller brugeren nogle gange, selvom de vigtigste informationer er øverst?
“Alt skal være above the fold” er en af de forenklede myter inden for webdesign.
Brugere scroller.
Problemet er altså ikke i sig selv at placere information længere nede på siden. Problemet er manglen på en grund til at gå derned.
Hvis den første del af siden klart kommunikerer:
- hvad produktet er,
- hvem det er til,
- hvilket problem det løser,
- hvad brugeren kan gøre bagefter,
kan de næste sektioner naturligt udbygge historien.
Brugeren kan have lyst til at se funktioner, troværdighedsbeviser, eksempler på implementeringer, svar på spørgsmål eller tekniske detaljer.
Hvis den første del af siden derimod er uklar, løser scrolling ikke problemet.
Brugeren ved ikke, om det er umagen værd at lede videre.
Forskning i opmærksomhed og scrolling viser, at brugere giver mere opmærksomhed til oplysninger i det oprindeligt synlige område, men det betyder ikke, at alt værdifuldt indhold skal ligge før første scroll. Nøglen er at skabe en passende hierarki og motivation til at fordybe sig yderligere i indholdet.
Hvorfor ignorerer vi nogle gange noget, der netop er blevet ændret?
Det er endnu en interessant mekanisme.
Designeren ved, at et vindue netop er dukket op.
Vedkommende ved, at knapens farve er blevet ændret.
Vedkommende ved, at en besked er dukket op på skærmen.
Vedkommende ved, at formularen er blevet opdateret.
Brugeren lægger måske ikke mærke til det.
Fænomenet hænger blandt andet sammen med change blindness, altså forandringsblindhed. Hvis ændringen sker uden for brugerens aktuelle opmærksomhedsfelt, eller den ikke kommunikeres tydeligt nok, kan den forblive ubemærket.
Det er særligt vigtigt i applikationer.
Hvis der efter en handling vises en lille besked i hjørnet af skærmen, kan brugeren overse den.
Hvis formularens tilstand ændrer sig, men ændringen er subtil, kan brugeren tro, at der ikke skete noget.
Hvis systemet har udført en vigtig handling, men feedbacken er for svag, kan brugeren klikke igen.
Som følge heraf opstår der fejl, dubletter af handlinger og frustration.
Grænsefladen skal kommunikere ændringen dér, hvor brugeren forventer den, og på en måde, der er tydelig nok til, at brugeren ikke skal lede efter den.
Brugeren bør ikke være nødt til at "lære" siden
En god grænseflade bruger eksisterende konventioner:
- Logoet fører normalt til forsiden.
- Menuen ligner en menu.
- Et link ligner et link.
- En knap ligner et interaktivt element.
- Indkøbskurven minder om en indkøbskurv.
- Søgefeltet ligner et søgefelt.
Det er ikke tilfældigt.
Brugeren kommer med erfaring fra andre sider og andre applikationer. Hvis grænsefladen opfører sig, som man forventer, kan brugeren bruge den viden.
Hvis designeren prøver at være "original" for enhver pris, kan det tvinge brugeren til at lære en ny måde at bruge systemet på.
Og alt ekstra, man skal lære, øger den kognitive belastning.
Originalitet giver mening, når den understøtter oplevelsen.
Ikke når den gør de grundlæggende opgaver sværere.
Hvad får egentlig et klik?
Der findes ikke ét universelt "magisk" element, som får alle brugere til at klikke.
Et klik er resultatet af en kombination af faktorer.
Relevans
Brugeren skal have en grund til at interessere sig for elementet.
"Se vores løsninger" kan være korrekt, men det er ikke særlig konkret.
"Se løsningen til webshops" er mere knyttet til et bestemt behov.
Forståelighed
Brugeren bør vide, hvad der sker efter et klik.
Jo større usikkerhed, jo større barriere.
Synlighed
Elementet skal være muligt at finde, men det betyder ikke, at det skal råbe med farver og animation.
Kontekst
Den samme knap kan fungere fremragende ét sted og dårligt et andet.
"Kontakt os" nederst på siden kan være det naturlige næste skridt.
Den samme knap uden nogen kontekst på første skærm kan være for tidlig.
Troværdighed
Brugeren skal have et tilstrækkeligt niveau af sikkerhed for, at klik ikke medfører en uønsket konsekvens.
Handlingens omkostning
Jo mere indsats det næste skridt kræver, desto vigtigere er motivationen og den værdi, der tilbydes brugeren.
Tidspunkt
Selv et godt CTA kan komme for tidligt.
Hvis brugeren lige har fået at vide, hvad produktet er, kan et øjeblikkeligt "Køb nu" være mindre effektivt end "Se, hvordan det virker".
Den største fejl: at designe til sig selv
Det er et af de mest almindelige problemer i digitale projekter.
- Teamet kender produktet.
- Kender alle funktionerne.
- Kender genvejene.
- Ved, hvor en given information findes.
- Ved, hvorfor virksomheden valgte en bestemt løsning.
- Ved, hvad hvert udtryk betyder.
Brugeren ved det ikke.
Derfor kan personen, der designer siden, opfatte et element som indlysende, mens brugeren slet ikke lægger mærke til det.
Det er netop derfor, brugervenlighedstests er så vigtige.
Det er ikke nok at spørge teamet: "Er det tydeligt, hvad man skal klikke på her?".
Teamet kender svaret.
Det er bedre at observere en person, der ikke kender designet, og se, hvad vedkommende faktisk gør.
I UX findes der et enkelt, men meget værdifuldt princip: brugerens adfærd er mere værdifuld end deres udsagn om, hvad de ville eller gerne vil gøre.
Hvordan designer man ud fra reel brugeradfærd?
1. Start med brugerens mål
Ikke med siden.
Ikke med menuen.
Ikke med brandbogen.
Start med at svare på spørgsmålet: hvorfor kom brugeren?
Et andet interface er nødvendigt for en person, der vil købe et produkt, et andet for en person, der søger dokumentation, og endnu et for en kunde, der bare vil finde telefonnummeret.
2. Definér hovedhandlingen entydigt
Ikke alle sider behøver fem ligeværdige CTA'er.
Overvej, hvilken handling der er vigtigst i den givne fase.
3. Design hierarki, ikke dekoration
Størrelse, kontrast, luft, typografi, placering og elementernes rækkefølge bør kommunikere betydning.
4. Prøv ikke at fremhæve alt
Hvis alt er rødt, er intet rødt.
Hvis alt er fedt, har intet særlig vægt.
Hvis hvert element er animeret, ved brugeren ikke, hvad der skal fokuseres på.
5. Reducér usikkerhed
Informér brugeren om, hvad der sker efter et klik.
Hvis handlingen fører til en formular, kan det kommunikeres tydeligt.
Hvis den starter en gratis proces, er det også værd at sige.
6. Test i stedet for at gætte
Bed en person, der ikke kender designet, om at udføre en konkret opgave.
Spørg ikke kun: "Kan du lide siden?".
Tjek:
- hvor de kigger,
- hvad de leder efter,
- hvad de klikker på,
- hvad de ignorerer,
- hvor de stopper op,
- hvad de fortolker anderledes, end designerne havde tænkt.
7. Mål adfærd
Analytics, sessionoptagelser, funnels, A/B-tests og fejl-data kan sige mere end meninger fra nogle få personer i teamet.
Men også her er kontekst nødvendig. Data viser, hvad der skete. Kvalitative undersøgelser hjælper med at forstå hvorfor.
Indikationer og kontraindikationer - hvornår har UX-psykologi størst betydning?
Digital psykologi er særligt nyttig der, hvor brugeren skal træffe en beslutning:
- webshop,
- kontaktformular,
- landing page,
- SaaS-applikation,
- B2B-system,
- registreringsproces,
- onboarding,
- mobilapp,
- betalingssystem,
- produktkonfigurator,
- en service, hvor det er nødvendigt at finde en bestemt information.
Det er især værd at analysere brugernes adfærd, når siden har meget trafik, men lav konvertering, brugere forlader formularer, ikke bruger vigtige funktioner eller regelmæssigt spørger efter information, som teoretisk allerede findes på siden.
Hvornår bør man ikke overdrive?
UX-psykologi er ikke et sæt tricks til at manipulere brugeren.
Den bør ikke bruges til at:
- skjule vigtige oplysninger,
- gøre det sværere at trække sig,
- designe vildledende CTA'er,
- tvinge samtykker igennem,
- skjule omkostninger,
- at skabe en falsk følelse af hastværk,
- at designe dark patterns.
Hvis brugeren klikker, fordi vedkommende er blevet vildledt, er det ikke god UX.
Det er bare en veloptimeret fælde.
Godt design hjælper brugeren med at udføre en handling, som er forståelig for vedkommende og i tråd med dennes intention.
Digital psykologi handler ikke om at manipulere mennesker
Det er en vigtig sondring.
Man kan bruge viden om menneskelig adfærd til at designe en enklere formular.
Man kan bruge den til at hjælpe brugeren med at finde information hurtigere.
Man kan forbedre sidens hierarki, så brugeren ikke behøver at lede efter det vigtigste element.
Man kan begrænse antallet af unødvendige beslutninger.
Man kan designe bedre fejlmeddelelser.
Man kan sikre, at brugeren ved, hvad der sker efter klik.
Det hele er brug af psykologi i design.
Manipulation begynder, når designet bruger brugerens begrænsninger imod vedkommende.
Grænsen er også vigtig for forretningen.
En virksomhed kan øge antallet af klik med et aggressivt CTA, men hvis brugeren efter nogle sådanne oplevelser begynder at opfatte brandet som påtrængende eller upålideligt, kan en kortsigtet konvertering ske på bekostning af et langsigtet tab af tillid.
Det vigtigste spørgsmål er ikke: „Vil brugeren klikke?”
Et bedre spørgsmål er: „Hvorfor skulle vedkommende klikke netop her, lige nu?”
Hvis svaret lyder: „Fordi knappen er stor”, så har vi et problem.
Hvis svaret lyder: „Fordi brugeren netop har fået den information, vedkommende havde brug for, forstår den næste fordel, ved hvad der sker efter klik, og omkostningen ved at udføre handlingen er acceptabel”, så begynder vi at tale om design af en oplevelse.
Et klik er ikke en tilfældig bevægelse med markøren.
Det er et resultat af, hvordan brugeren fortolker information, hvordan vedkommende vurderer situationen, og hvilken værdi vedkommende ser i at tage det næste skridt.
Derfor kæmper god UX ikke om brugerens opmærksomhed.
God UX hjælper brugeren med at rette opmærksomheden mod det, hvor den faktisk er nødvendig.
Og hvis siden kan gøre det uden råben, uden manipulation og uden fem blinkende „KØB NU”-knapper, så er det dér, den virkelig begynder at fungere godt.
Begrebsordbog
UX (User Experience) - hele brugerens oplevelse i forbindelse med brugen af et produkt, en tjeneste eller et system.
UI (User Interface) - lag af grænsefladen, som brugeren kommunikerer direkte med.
CTA (Call to Action) - et element, der opfordrer brugeren til at udføre en konkret handling, f.eks. køb, kontakt eller at starte en proces.
Selektiv opmærksomhed - mekanismen, hvor begrænset opmærksomhed styres mod udvalgte stimuli, mens andre samtidig udelades.
Banner blindness - tendensen til, at brugere ignorerer elementer, der ligner reklamer eller er placeret på steder, der forbindes med reklamer.
Change blindness - fænomenet, hvor ændringer, der sker uden for det aktuelle opmærksomhedsområde, ikke bemærkes.
Mikrocopy - korte beskeder, der støtter brugeren i interfacet, f.eks. tekster på knapper, i formularer, fejl og instruktioner.
Informationshierarki - måden elementer ordnes efter deres betydning og den rækkefølge, som brugeren bør opfatte dem i.
Dark patterns - designmønstre, der udnytter brugerens adfærd og begrænsninger på en måde, som får vedkommende til at handle i strid med den oprindelige intention eller gør det sværere at træffe et informeret valg.
Friction / friktion - den kognitive eller operationelle indsats, der kræves for at udføre en handling.
Til sidst
Et websted er ikke en firmapræsentation.
Det er et miljø, hvor mennesker træffer beslutninger.
Derfor bør design starte ikke med spørgsmålet: „Hvad vil vi vise?”
men med spørgsmålet: „Hvad forsøger brugeren at gøre her, og hvad har vedkommende brug for for at gøre det uden unødig indsats?”
Først set fra det perspektiv kan man meningsfuldt designe layout, indhold, CTA, navigation, formularer, budskaber, branding og hele brugerrejsen.
For brugeren klikker ikke, fordi virksomheden mener, at vedkommende bør klikke.
Vedkommende klikker, når vedkommende ser meningen med handlingen, forstår dens konsekvenser og vurderer, at det er værd at tage det næste skridt.
