Skal menyen stå på toppen eller til venstre?

Hvor skal du ha navigasjonslenkene på nettstedet ditt? Du vet, menyen over de viktigste delene av nettstedet.

Vel, det finnes en del forskning som sier at det spiller ikke noen stor rolle. Jeg ville likevel satset på å legge hovednavigasjonen på toppen, og eventuell lokalnavigasjon til venstre.

Det viktigste er likevel å designe menyen slik at den har tydelige kategorier.

Samme hvor, egentlig

Flere uavhengige registreringer av øyenbevegelser til lesere og målinger av hvor lang tid de bruker på å lese finner at det går like bra med menyen til høyre som til venstre eller på toppen.

Steve Outing og Lara Ruel, som utførte Poynter Institutes Eyetrack III-studie fra 2004 fant at vannrette menyer ble mest lest på hjemmesider, mens loddrette venstremenyer ble mest lest på undersider. De understreker imidlertid at disse resultatene ikke kan generalisereres, men konkluderer med at vannrette menyer synes å fungere bra.

Allerede året før fant James Kalback og Tim Bosenick (Journal of Digital Information, 2003) at topp, venstre og høyre var like gode plasseringer for menyer. J.D. McCarthy, M.A. Sasse og J. Riegelsberger kom til samme konklusjon i en studie publisert i People and Computers i 2004.

Alex J DeWitt (Journal of Usability Studies, 2010) finner også det samme, men legger til at om en loddrett meny er så høy at brukerene må rulle (scrolle) opp og ned, vil de bruke lengre tid. Grafisk utforming av menyene har mer å si for brukervennligheten enn plassering, mener DeWitt.

Alistair Sutcliffe og Aballah Namoun (Behaviour & Information Technology, 2012) peker på fire faktorer som synes å påvirke hvor brukeren ser, og som i noen grad konkurrerer:

  1. brukeren ser etter det han eller hun leter etter
  2. toppen og til venstre er mest sett på
  3. layouten leder øyet
  4. sterke farger, bilder og bevegelse trekker øyet til seg

Lista vil neppe overraske noen som har jobbet med grafisk design, og nå vil psykologene være enige, ettersom det er bekreftet av øyebevegelsesstudier i et laboratorium.

Argumenter for vannrette menyer

I en artikkel i Smashing Magazine fra 2010 argumenterer Louis Lazaris for at navigasjon skal være vannrett fordi:

  1. Siden det er begrenset hvor mange lenker som får plass ved siden av hverandre blir designeren nødt til å organisere nettstedet logisk.
  2. Vannrette linjer tar opp lite av plassen på skjermen, så det blir mer plass til det leseren er interessert i.
  3. Vi er vant til å lese vannrett.
  4. Om du skal ha undermenyer til punktene er rullegardinmenyer bedre enn fly-ut-menyer

I tillegg tolker han et par tidlige øyenbevgelsesstudier (Poynter, Nielsen) til at vi ikke leser menyer til venstre, men det mener jeg er å overtolke resultatene i studiene.

Steve Krug, som har skrevet bestselgeren Don’t Make Me Think (New Rider, 2000) om brukervennlighet på nettet peker på at enhver liten forsinkelse vil irritere lesere, så det er lurt å gjøre slik de er vant til. Og det de er vant til, sier Krug, er å ha hoveddelene av nettstedet i en vannrett rekke på toppen av siden, og underdelene i en rad under der.  Lokal navigasjon, altså valgene inne i den delen du er i, settes som en loddrett søyle til venstre (s. 61).

Dette er det samme som Outing og Ruel fant (2004). Outing og Ruel peker på at vannrette menyer står nær overskriften, og derfor tolket som overordnede, mens venstremenyer står nær brødteksten, og oppleves mer som noe som hører sammen med den enkelte artikkelen.

Det er altså en logisk sammenheng mellom punkt 2 (toppen og venstre er mest poulær) og punkt 3 (layouten leder øyet) i Sutcliffe og Namouns liste over faktorer.

Husk å sortere menyen

Viktigere enn hvor du plasserer menyen er det nok at den er lett å forstå.

For det første må punktene i menyen ha gode navn, som både gjør det tydelig hva som finnes på sidene de peker til, og hvordan de er forskjellige fra hverandre.

For det andre blir menyer uoversiktlige om det blir for mange punkter. Da må de deles inn i logiske grupper. Jakob Nielsen diskuterer dette i to artikler, en om hvordan store menyer ofte fungerer godt, og en annen med eksempler på mislykkede menyer.

En grundigere forklaring på dette finner du i Donald Normans The Design of Everyday Things fra 1986. Her diskuterer Norman hvorfor gjenstander som stereoanlegg, vekkerklokker og videospillere ofte blir nær umulige å bruke: De har mange funksjoner og like mange knapper, og alle knappene ser like ut og står like langt fra hverandre. Da må brukeren lære seg knappene så godt at hun husker funksjonen hver eneste gang hun skal bruke det, og det tar lang tid. Norman kaller dette «kunnskap i hodet». Alternativet er «kunnskap i verden», og det er en utforming og plassering som forklarer deg hvordan noe skal brukes. Hans eksempel er kontrollene i en bil eller et fly. Det er hundrevis av kontroller, men de ser forskjellige ut og er plassert i logiske grupper.

I programmene i Microsoft Office er alle verktøyene sortert i grupper (kalt ribbons) fra og med Office 2007. Ved å velge gruppe får du (forhåpentlig) se de kontrollene du behøver for det du skal gjøre, uten å bli forstyrret av alt mulig annet. I Word for Mac 2011 heter gruppene «Home», «Layout», «Document Elements», «Tables», «Charts», «SmartArt» og «Review».

Adobes designprogrammer har innført en lignende deling i «arbeidsplasser» (workspaces). Hver arbeidsplass har et sett kontroller og vinduer som hører til.

I 2008 fant Jakob Nielsen at denne måten å dele inn kontrollene på ble stadig mer vanlig i ulike programmer.

Legg igjen en kommentar

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