Don't make me think

av Ola Winsnes

11. juni 2008
Publisert i Brukervennlighet

Dette er et sammendrag av Steve Krugs bok Don’t Make Me ThinkDon't make think – A common sense approach to Web Usability. Boken er obligatorisk lesning for alle som driver med internettmarkedsføring, brukervennlighet og webutvikling.

1. “Don’t make me think”

Hvis du bare skal huske en regel om brukervennlighet, la det være denne: “Don’t make me think”. Det betyr at så langt det er menneskelig mulig skal en nettside være selvforklarende.

En besøkende skal bruke minimal tankekraft for å skjønne hva siden “er”, og hvordan den skal brukes. Nettstedet skal være så selvforklarende at selv naboen din, uten noen interesse for sidens innhold og med minimal kunnskap om internett, kan si: “Å, det er en___”

Hva får oss til å tenke?

  • Egendefinerte og vanskelige navn (på kategorier, linker og andre features)
  • Linker og knapper som ikke er opplagt klikkbare
  • (Dårlig navigasjon)
  • Kompliserte søkemåter, f.eks om vi blir tvunget til å søke i en spesiell sjanger.

En besøkende på siden din skal slippe å bruke tid på å tenke:

  • Hvor er jeg?
  • Hvor skal jeg begynne?
  • Hvor har de gjort av ____?
  • Hva er det viktigste på denne siden?
  • Hvorfor kaller de det for det?

Et tips er å merke seg tingene på nettstedet som får deg selv til å tenke. Etterhvert vil du lære å kjenne igjen utfordringene slik at du kan unngå dem på sidene du jobber med.

2. Hvordan bruker vi egentlig internett

Vi designer sider i den tro at de som besøker sidene vil bruke tid på å lese den nøye utformede teksten, finne ut hvordan alt er organisert og klikke seg gjennom alle sidene. I virkeligheten er vi heldige om de besøkende i det hele tatt titter på sidene og skanner noe av teksten der.

Om vi skal klare å designe effektive nettsider, må vi lære å leve med noen fakta om hvordan Internett blir brukt i virkeligheten.

  • Vi leser ikke sider, vi skanner dem på jakt etter noe som interesserer oss.
  • Vi gjør ikke optimale valg, vi velger det første og beste.
  • Vi finner ikke ut hvordan ting fungerer, vi prøver og feiler til vi finner en måte.

Dette er kanskje et mindre oppmuntrende bilde av hvordan internett blir brukt. Så hva skal man gjøre?

Steve Krug sammenligner måten vi bruker nettet på med måten vi leser plakatreklame langs veien. Vi suser forbi og får kun med oss det som er interessant og enkelt. Derfor er hans råd: “If Your audience is going to act like you`re designing billboards, then design great billboards.”

3. Design for skanning, ikke lesing.

Med den forståelse du nå har av ditt publikum, er det fem viktige ting du kan gjøre for å sørge for at de ser og forstår så mye som mulig av dine nettsider.

  • Lag en klar og konsistent visuell struktur på sidene
  • Utnytt konvensjoner.
  • Del siden inn i klart definerte områder.
  • Gjør det opplagt hva som er klikkbart
  • Minimaliser “støy”

4. Tankeløse valg

Webdesignere og brukervennlighetseksperter har brukt mye tid til å finne ut om det er en fordel at folk finner informasjon med få “klikk”. Konklusjonen til Krug er at antall klikk ikke betyr noe, så lenge hvert klikk ikke krever at man tenker!

5. Kutt bort unøvendig informasjon

“Kutt bort halvparten av alle ord på hver side. Deretter, kutt bort halvparten av det som er igjen.”

Dette er en overdrivelse, men det er for å poengtere viktigheten av nettopp dette. Utrolig mye av informasjonen som produseres i dag fylles opp med unødvendige ord for å få frem det egentlige budskapet.

Resultatet av å kutte bort unødvendige ord er:

  • Mindre støy på siden.
  • Nyttig innhold blir enklere å finne.
  • Siden blir kortere, så brukerne får sett mer av siden uten å scrolle.

Noen konkrete tips i for å skrive gode tekster på internett er:

Si mindre: Kutt bort alt overflødig

Bruk den omvendte pyramide: Den klassiske måten å bygge opp en tekst på er å bygge opp med innformasjon og avslutte med en konklusjon. På nettet anbefales det å snu pyramiden og gå rett på det esensielle og eventuell bakrunnstoff senere.

Putt det viktigste innholdet først: Plasser det viktigste innholdet øverst på siden så det kommer innenfor skjermbildet uten å måtte scrolle.

Bruk klare overskrifter: En god overskrift kan bety alt for om en tekst bli lest eller ikke. Vekk lesernes oppmerksomhet.

Vurder målet til dem som skal lese teksten: Ikke vær kryptisk, forklar leserne konkret hvordan de skal nå sine mål på siden. Eks:“last ned pdf her”

Bruk “aktiv stemme”: Man kan skrive i aktiv eller passiv form; “Last opp ny kontaktinformasjon” er aktiv mens “ny kontaktinformasjon kan bli lastet opp” er passiv. Bruk aktiv form.

“Gladsnakk” må dø:Hvis du er usikker på hva “gladsnakk” er, kan du gjøre en liten test: Det er alt du leser hvor du samtidig kan høre en liten stemme i bakgrunnen som sier; “Bla, Bla, Bla, Bla, Bla…..”Ingen som besøker nettsiden din er interessert i dette, derfor må det fjernes.

Instruksjoner må dø. Brukerne vil prøve seg frem til de eventuelt finner en løsning som fungerer. Ingen leser instruksjoner. Ditt mål er å gjøre ting så selvforklarende at det ikke er behov for instruksjoner.

6. Gateskilt og brødsmuler

Mennesker som ikke finner frem på siden din vil ikke bruke den. Du er derfor avhengig av å ha et klart, enkelt og konsistent navigasjonsdesign.

Steve Krug trekker paralellen mellom leting i en butikk og leting på nett. Butikken har skilting og merking på samme måte som nettsteder, og vi følger gjerne denne skiltingen for å finne frem. Eventuelt spør vi en butikkansatt. På nett vil dette være søkefunksjonen.

Butikk-metaforen er vel kanskje ikke like aktuell for oss nordmenn. Våre butikker er mindre og vi liker jo å gå og lete litt.

Men vi liker enda bedre å finne fram, derfor er det viktig å lage gode gateskilt og gjerne gi brukerne noen brødsmuler for å lokke dem inn. Gi brukerne gode valg på hovedsiden og fornuftige undervalg når de har trykket seg videre.

Vi mennesker er forskjellige og noen foretrekker å søke fremfor å klikke på linker. Det er derfor viktig at begge også søkefunksjonen er gjennomtenkt og effektiv.

I tillegg til at navigasjonsdesignet hjelper oss å finne det vi leter etter kan det hjelpe oss med å holde orden på hvor vi befinner oss på en side. Andre viktige effekter av et godt navigasjonsdesign er:

  • Det forteller hva som finnes på siden.
  • Det forklarer hvordan man skal bruke siden.
  • Det gir oss tillit til dem som har bygget siden.

Bruk designkonvensjoner

Når ting er så innprentet at vi tar dens form og plassering for gitt, kalles det en konvensjon og en nettside er full av dem. Selv om det ofte er fristende å tenke nytt og annerledes er det ofte en fordel å utnytte disse konvensjonene. Plasser ting der de hører hjemme på nettsiden.

Side som utnytter webdesign konvensjoner med plassering av ting på siden.

Søk

Om ikke siden er veldig liten og bra organisert burde alle nettsider ha en søkefunksjon. Denne burde bestå av en søkeboks, en knapp og ordet søk. Ikke gjør det vanskeligere enn det.

Sidenavn

Når man klikker på en link på en side skal navnet på siden man kommer til stemmer overens med ordet man klikket på.

“Du er her”

Man skal til enhver tid ha full kontroll over hvor man befinner seg på siden. dette gjøres best ved å ha et vell fungerende navigasjonsdesign som uthever hvor du befinner deg, sammen med brødsmuler som burde plasseres øverst på hver side.

Eksempel på nettstedsti

Bruk etiketter

Bruk av etiketter er et smart navigasjonsdesign fordi:

  • Det er selvforklarende
  • De er lette å se
  • De er pene
  • De lager psykisk “plass” på siden

Nettsted navigasjonstabber

7. Design av hovedsiden

Hovedsiden eller “The Home Page” – har en rekke oppgaver:

  • Forklare identitet og misjon
  • Vise side hierarki
  • Mulighet for søk
  • Inneholde nysgjerrighetsvekkere
  • Oppdatert innhold
  • Snarveier
  • Registrering
  • Vise oss det vi leter etter/og ikke leter etter
  • Vise hvor man skal starte
  • Etablere troverdighet

Et godt hjelpemiddel for å forklare sidens identitet og misjon er en bra velkomsttekst kombinert med en kort og presis tekst under sidens logo.

Etter man har fått klart frem sidens identitet og misjon er det viktig å vise brukeren hvor han skal starte om han ønsker å:

  • Søke
  • Surfe
  • Finne det beste på siden

Husk at “Back” knappen er den mest brukte funksjonen i nettleseren og at Hovedsiden skal være en trygg havn når brukeren har klikket seg vill og kommet et sted hun ikke ønsker å være.

8. Unngå synsing

9. Gjør enkle brukervennlighetstester.

Om du ønsker å ha en bra nettside er du avhengig av testing. Etter du har arbeidet på nettstedet en stund blir du gjerne blind for forbedringer og trenger andres syn og meninger.

Brukervennlighetstesting eller “Usability testing” vil si at du observerer noen som prøver å bruke siden din og noter hvor de møter vanskeligheter. Fiks problemene og test igjen. Dette trenger ikke nødvendigvis være ekstremt kostbart, og husk at det er 100 prosent bedre å teste en gang enn å ikke teste.

Det er viktig at du å teste tidlig i prosessen, så det ikke går så langt at ting er vanskelig å rette opp. Kjør derfor heller små tester underveis i prosessen istedenfor en stor rett før lansering.

Rekrutter noen med noe internettkunnskap – helst noen som er i målgruppen for nettstedet – og før dem gjennom prosessen med en intervjuguide. Ta gjerne opp skjermbilde og lyd med et videokamera. Du kan også bruke en skjerm-recorder.

Deretter går du igjennom materialet og retter opp feil. Vær kritisk, ikke ta alle påstander om siden din for feil som må rettes opp. Du vil merke at det vil komme opp feil som er opplagte selv om du ikke har sett antydninger til dem før.

10. Brukervennlighet er vanlig høflighet

Under utvikling. Kan noen skrive et sammendrag?

11. Tilgjengelighet og teknikk

Under utvikling. Kan noen skrive et sammendrag?

12. Hjelp! Sjefen vil at jeg skal ha….

Under utvikling. Les boken selv.

Vil du lese boken?

Noen som har lyst til å lese hele boken? Sitter her med 5 eksemplarer og de fem første som sender en mail får et eksemplar. (OPPDATERT: 18.06.2008: 5 bøker er nå sendt ut)

10 kommentarer til "Don't make me think"

  1. 1
    19:00, 11. juni 2008

    Linkforslaget “last ned pdf her” kan kuttes, og deretter kuttes til halvparten… :-)
    “last ned” er unødvendig fordi linkens bruksegenskaper (den er understreket antar jeg…) antyder for brukeren at den er klikkbar. Det er feil å si laste ned, ettersom målet er å lese den, om man laster den ned, åpner den, viser den osv er opp til øyet som ser. “her” kan kuttes. Hvor ellers skal man klikke? Og “PDF” bør for ordens skyld erstattes med dokumentets navn.

    Jeg er uenig i at flapper/arkfaner/tabs er god navigasjon. Analogien er korrekt brukt dersom de brukes til å bytte modus slik som f.eks Wikipedia. Les innhold eller rediger er to modus på samme side som kontrolleres av flapper (Etiketter kan være noe misvisende, det høres ut som det er oversatt fra label, som brukes om felttitler i skjemaer.)
    En korrekt måte å navigere mellom ulike seksjoner ville være f.eks knapper eller en gruppe linker.

  2. 2
    Andreas Ringdal
    19:25, 11. juni 2008

    En annen bok som er verdt å få med seg er “Sketching user experiences” av Bill Buxton.

    Den går mindre på selve brukergrensesnittet og mer på prosessen frem dit.

    http://www.amazon.com/Sketching-User-Experiences-Interactive-Technologies/dp/0123740371

    Andreas

  3. 3
    23:57, 11. juni 2008

    Personlig foretrekker jeg at det står PDF, Word e.l når det linkes til dokumenter som ikke er html. Er det flere en meg som blir lettere irritert når et word dokument på mange MB begynner å laste ned fordi man trykker på en link på leting etter mer informasjon?

  4. 4
    00:19, 12. juni 2008

    Interessant og lærerik artikkel, men hva i alle dager menes med “gladsnakk”?

  5. 5
    Winsnes
    07:45, 12. juni 2008

    “Gode opplevelser oppstår når forventninger innfris. Innfrir vi forventningene etterlever vi samtidig vår visjon om å skape gode opplevelser for våre kunder.
    Bertel O. Steen er Norges eldste og nest største bilkonsern med en omsetning på 9,849 milliarder i 2007.”

    Merket du den lille stemmen som sa: bla bla bla inne i hodet ditt når du leste dette?
    Om svaret er ja, kan du regne med at det er “gladsnakk” og burde fjernes. Ingen leser det.

  6. 6
    Andreas Ringdal
    11:51, 13. juni 2008

    “Personlig foretrekker jeg at det står PDF, Word e.l når det linkes til dokumenter som ikke er html. ”

    Enig, men om linken legges på en del av teskten i en “normal setning” så foretrekker jeg at man legger til som “(pdf) ” fremfor å beskrive i teksten at det er et pdf dokument.

    andreas

  7. 7
    12:19, 17. juni 2008

    Absolutt en bok å lese, selv om det er noe som er logisk, så er det uansett fint å ha et sted å referere til i diskusjoner med andre. :)

  8. 8
    Jostein Dahl Gjelsvik
    15:15, 19. juni 2008

    En bok som tar for seg konseptuell forståelse – essensiell for alle som er opptatt av web usability.

  9. [...] Krugs mantra: Don’t make me think! er kanskje det viktigste å ha med seg når en designer [...]

  10. [...] Kunstens oppgave er å inspirere og få deg til å tenke, mens (web)design handler om å kommunisere og oppfordre til handling. Eller som Steve Krug sier – om å “Don’t make me think“! [...]

Legg igjen et svar

Din e-post vil ikke bli publisert. Obligatoriske felt er merket med *

*

Kutt-isme – Læren om å kutte ut alt som tar fokus bort fra hovedmålet.

Kuttisme.no er en fagblogg om søkemotor- markedsføring, e-postmarkedsføring, brukervennlighet, konverteringsrate, webutvikling og webanalyse.