Test navigasjonen før dere designer nettsiden

Kategori: Webdesign og UX

En pen meny er ikke nødvendigvis en god meny. Den kan se ryddig ut og likevel sende besøkende i feil retning. Problemet oppstår ofte fordi strukturen blir bestemt i møterommet, med interne avdelinger, fagbegreper og etablerte produktnavn som utgangspunkt.

Før typografi, farger og komponenter låses, bør dere derfor teste om mennesker faktisk forstår hvor de skal gå. Det krever ikke en ferdig nettside eller et omfattende analyseprosjekt. En enkel navigasjonstest kan gjennomføres med en foreløpig sidestruktur, noen realistiske oppgaver og et lite utvalg personer som ligner kundene deres.

Målet er ikke å finne den perfekte menyen. Målet er å avdekke tvil, misforståelser og blindveier mens de fortsatt er billige å rette.

Start med oppgaver, ikke menypunkter

En navigasjonstest bør ta utgangspunkt i det brukeren prøver å oppnå. Ikke spør om noen liker menyen eller synes strukturen virker oversiktlig. Slike spørsmål gir ofte høflige og lite handlingsrettede svar.

Lag heller konkrete situasjoner:

• Du vurderer å kjøpe tjenesten, men vil vite hva som er inkludert. Hvor går du?
• Du er eksisterende kunde og trenger hjelp med en feil. Hva velger du?
• Du vil finne ut om leverandøren har erfaring fra din bransje. Hvor leter du?
• Du ønsker et prisanslag før du tar kontakt. Hva gjør du?
• Du har mottatt en faktura og lurer på hvem du skal kontakte.

Oppgavene bør dekke både nye og eksisterende kunder. Mange bedriftsnettsteder prioriterer salg så sterkt at service, support, dokumentasjon og praktisk kontaktinformasjon blir vanskelig å finne. Det skaper unødvendige henvendelser og en svakere opplevelse etter kjøpet.

Lag et enkelt utkast til sidestruktur

Skriv opp hovednivået og de viktigste undersidene uten å designe dem. Strukturen kan vises som en liste med innrykk eller som en enkel klikkbar skisse. Fjern bilder, farger og dekorative elementer. Da tester dere informasjonsarkitekturen uten at visuell utforming påvirker valgene.

Et utkast kan for eksempel inneholde:

• Tjenester
• Bransjer
• Kundehistorier
• Fagstoff
• Om selskapet
• Kontakt

Dette kan se forståelig ut for virksomheten, men flere spørsmål gjenstår. Ligger priser under Tjenester eller Kontakt? Forventer kundene å finne support under Kontakt? Er Bransjer relevant for alle, eller fører det bare til ekstra valg? Betyr Fagstoff det samme for brukeren som for markedsavdelingen?

Testen skal gjøre slike antakelser synlige.

Be deltakeren forklare valget

Gi én oppgave om gangen og be deltakeren velge hvor vedkommende ville startet. Følg opp med korte spørsmål:

• Hva forventer du å finne her?
• Var det et annet valg du vurderte?
• Er noen av ordene uklare?
• Hva ville du gjort hvis innholdet ikke lå der?

Unngå å forklare menyen eller forsvare begrepene. Hvis en deltaker tolker et ord annerledes enn dere hadde tenkt, er det et funn. Det hjelper ikke at ordet er korrekt i organisasjonens interne språk.

Noter førstevalget, eventuell nøling og alternativet deltakeren vurderte. Det er særlig nyttig å finne oppgaver der flere fordeler seg mellom to menypunkter. Det kan bety at kategoriene overlapper, eller at navnene ikke forklarer forskjellen tydelig nok.

Se etter mønstre, ikke enkeltmeninger

Én deltaker kan ha uvanlige forventninger. Flere som gjør den samme feilen, peker derimot mot et strukturelt problem. Samle derfor funnene etter oppgave og se etter gjentakelser.

Typiske problemer er:

• Flere menypunkter virker like relevante for samme oppgave.
• Et viktig innholdsområde ligger under et navn brukerne ikke forstår.
• Deltakerne leter etter en side som ikke finnes.
• En intern produktinndeling stemmer dårlig med kundens behov.
• Kontakt brukes som reservevalg fordi resten av menyen er uklar.
• Viktige oppgaver krever at brukeren kjenner virksomheten fra før.

Ikke løs alle problemer ved å legge til flere valg. En større meny kan gjøre tvilen enda større. Vurder først om kategorier kan slås sammen, om navn kan konkretiseres, eller om én tydelig inngang kan lede videre til flere relaterte behov.

Test menynavnene som innholdsdesign

Menypunkter er små tekster med stor betydning. De må være korte, men samtidig presise nok til å skape riktig forventning. Her bør tydelighet veie tyngre enn særpreg.

Ord som Løsninger, Ressurser, Innsikt og Kompetanse kan fungere, men bare dersom målgruppen forstår hva som finnes bak dem. Et mer konkret navn som Tjenester, Kundehistorier, Guider eller Kurs kan være enklere å tolke.

Det betyr ikke at alle nettsteder skal bruke de samme standardordene. Navnet bør speile innholdet og oppgaven. Hvis et menypunkt heter Produkter, må siden faktisk gi en nyttig oversikt over produktene. Hvis det heter Hjelp og support, bør brukeren ikke møte en generell kontaktside uten veiledning.

Kontroller også om begrepene fungerer for personer som ikke kjenner bransjens forkortelser og faguttrykk. Klarspråk er både et tilgjengelighetstiltak og et konverteringstiltak: Flere forstår hva de kan velge, og færre forlater siden fordi neste steg virker usikkert.

Gå fra struktur til førsteside

Når hovedstrukturen fungerer, kan dere teste et enkelt sideutkast. Vis en skisse av forsiden eller en sentral tjenesteside og gi deltakeren en oppgave. Be vedkommende peke på det første stedet hen ville klikket.

En slik førstklikktest avdekker om navigasjon, overskrifter og handlingsknapper trekker i samme retning. Dersom oppgaven er å be om et pristilbud, men deltakeren først åpner Om oss, kan årsaken være at den primære handlingen er for vag eller lite synlig. Dersom flere klikker på et bilde som ikke er klikkbart, bør designet enten gjøre bildet interaktivt eller fjerne signalet om at det kan brukes.

Test også mobilvisningen. En struktur som fungerer i en bred toppmeny, kan bli tung når alle nivåene legges i en smal mobilmeny. Viktige oppgaver bør ikke bli begravd under flere åpne- og lukketrinn.

Bruk typografi og visuell identitet til å støtte valgene

Når strukturen er forståelig uten grafisk pynt, kan den visuelle utformingen forsterke hierarkiet. Typografi bør vise forskjellen mellom sidetittel, seksjonsoverskrift, brødtekst, lenke og knapp. Brukeren skal kunne skanne siden og forstå rekkefølgen uten å lese alt.

Visuell identitet skal ikke gjøre navigasjonen vanskeligere. Svak kontrast, svært tynne skrifter, tekst over urolige bilder og knapper som ligner dekor er vanlige eksempler på at uttrykket får forrang foran funksjonen.

Kontroller særlig at:

• tekst og interaktive elementer har tydelig kontrast
• lenker kan kjennes igjen uten at farge er eneste signal
• aktivt menypunkt er synlig
• tastaturfokus er lett å se
• tekst tåler forstørring uten at innhold forsvinner
• klikkflater er store nok og har tilstrekkelig avstand

Tilgjengelighet bør testes sammen med designet, ikke legges på til slutt. En meny som er logisk visuelt, må også fungere med tastatur, skjermleser og forstørret tekst.

Koble funnene til konvertering

God navigasjon handler ikke bare om at brukeren finner riktig side. Veien videre må også være tydelig når siden er nådd. En tjenesteside bør for eksempel hjelpe brukeren med å forstå hvem tjenesten passer for, hva den omfatter, hvilke avklaringer som kreves og hva neste steg er.

Velg en hovedhandling som passer til brukerens modenhet. Be om tilbud kan være riktig når tjenesten er konkret og kjøpsklar. Bestill en avklaring kan fungere bedre når behovet må vurderes først. En generell Les mer-knapp gir derimot lite informasjon om hva som skjer etter klikket.

Ikke mål navigasjonen bare etter hvor mange som klikker på en knapp. Se også etter om brukerne kommer til riktig innhold, om de må gå tilbake flere ganger, og om henvendelsene gjelder det siden faktisk tilbyr. Flere irrelevante forespørsler er ikke nødvendigvis en forbedring.

Avslutt med en beslutningsliste

Etter testen bør funnene oversettes til konkrete endringer. Unngå en generell konklusjon om at menyen må bli tydeligere. Skriv heller hva som skal endres og hvorfor.

1. Behold menypunkter som forstås likt av målgruppen.
2. Gi uklare kategorier mer konkrete navn.
3. Flytt innhold som gjentatte ganger blir lett etter på feil sted.
4. Fjern eller slå sammen valg som konkurrerer om samme oppgave.
5. Lag manglende sider for viktige brukerbehov.
6. Test mobilmeny, tastaturnavigasjon og forstørret tekst.
7. Gjenta førstklikktesten når sideutkastet er oppdatert.

Dette gir designere og utviklere et bedre beslutningsgrunnlag enn personlige preferanser. Samtidig reduserer det risikoen for å bruke tid på en visuelt gjennomarbeidet løsning som kundene ikke finner frem i.

Den viktigste testen skjer før nettsiden ser ferdig ut: Kan en person med et reelt behov forstå hvor reisen starter? Hvis svaret er uklart, bør strukturen forbedres før den pakkes inn i typografi, farger og visuell identitet.