Nedan följer några tips om alternativ för webbplatsnavigering som du kan använda för att förbättra din konverteringsgrad. Våra användbarhetstips hjälper dig att göra din huvudmeny – och hela din webbshop – mer användarvänlig.
Tips #1: Planera navigeringen på startsidan i förväg
Innan du börjar välja menyalternativ är det viktigt att planera varje funktion och varje innehållsdel på din webbplats. Du kan vanligtvis dela in funktioner och innehåll i huvudkategorier och underkategorier. Se till att du ger varje kategori tydliga och koncisa namn. Användare skummar i allmänhet bara snabbt igenom menyalternativen, så det är viktigt att de enkelt kan skilja dem åt och omedelbart förstå vad de är.
Tips #2: Placera de mest relevanta objekten först
De menyalternativ som är mest intressanta för dina användare bör alltid visas i början av huvudmenyn. Om du till exempel är en SaaS-leverantör är det en bra idé att börja menyn med alternativ som övertygar besökarna om att din lösning passar dem. Försök använda menyalternativ som dessa:
Om du driver en webbshop för ett modemärke bör din meny fokusera på dina produkter. Länkar till annat innehåll, som produktvägledning eller blogginlägg, bör ligga mot slutet av menyn. Generellt beror de bästa sätten att optimera konverteringen för din e-handel på vilken bransch du verkar i.
Tips #3: Använd en visuell struktur
En vanlig meny kan bara visa text i ett enkelt format. Megamenyer med rullgardinsfunktioner, å andra sidan, ger dig möjlighet att framhäva specifika menyalternativ. Till exempel kan du använda olika:
Textstorlekar
Textfärger
Typsnitt
Ikoner
Detta gör att du kan skapa mer struktur i innehållet i din rullgardinsmeny. Alla objekt behöver inte länka till en faktisk sida; vissa ord kan helt enkelt fungera som icke-klickbara rubriker för de olika klickbara underkategorierna.
Tips #4: Undvik att inkludera ytterligare funktioner
Inkludera inte komplexa interaktioner i dina rullgardinsmenyer, såsom nyhetsbrevsregistrering eller urvals- och sökfält, eftersom de ofta kan avskräcka användare. Det sista du vill är att huvudmenyn ska ha en rörig design. Dessutom förekommer sådana element ofta på flera platser på en webbplats. De får större effekt om du placerar dem på de sidor där de passar bäst.
Det kan dock vara mycket effektivt att inkludera en CTA-knapp i navigeringsfältet. Lägg till exempel till en knapp som låter dina kunder göra en bokning eller ett köp med ett enda klick. Kom bara ihåg att CTA:n ska placeras bredvid huvudmenyn och inte i själva rullgardinsmenyn.
Tips #5: Välj mellan hovring och klick
Många webbplatser använder rullgardinsmenyer som öppnas så snart användaren för muspekaren över menyalternativet. Om du funderar på att använda det här alternativet finns det några punkter att tänka på:
Allt i en blick: En megameny bör öppnas på en gång i stället för att öppnas gradvis, en underkategorinivå i taget.
Perfekt timing: Menyn bör inte vara alltför känslig. Du vill förhindra att den ”fladdrar” när användaren hovrar över den för snabbt. Samtidigt bör den inte reagera för långsamt. Vi rekommenderar en reaktionstid på 0,1 till 0,5 sekunder för optimal användbarhet. Det är också en bra idé att tillåta en kort paus innan menyn döljs, ifall användaren råkar föra muspekaren bort från menyn av misstag. En meny som är för känslig eller oberäknelig kommer att frustrera dina användare och få några av dem att ge upp och lämna webbplatsen helt.
MouseOut-programmering: När rullgardinsmenyn aktiveras flyttar kunderna markören från navigeringsfältet in i menyn. Om din webbplats inte är korrekt programmerad kommer den felaktigt att logga en MouseOut-händelse när musen lämnar navigeringsfältet, vilket gör att menyn stängs. Därför är det viktigt att ställa in menyn så att rullgardinsmenyn bara försvinner när musen lämnar både navigeringsfältet och själva rullgardinsmenyn.
Mobilversion: Hovring är inte möjlig på smartphones eller surfplattor. Om du vill använda en hovringsaktiverad rullgardinsmeny på din datorversion, kom ihåg att använda andra inställningar i mobilversionen.
Tips #6: Följ treklicksregeln
På de flesta webbplatser bör navigeringen följa treklicksregeln. Det betyder att dina användare ska kunna nå all information på webbplatsen inom högst tre klick. Detta är förstås bara en allmän riktlinje. Om du har en stor, mycket detaljerad webbplats är antalet klick inte lika viktigt så länge webbplatsen är välorganiserad. Det viktigaste är att dina kunder alltid känner att det är lätt att hitta rätt.
Tips #7: Använd flera menyer
För webbplatser med mycket information kan det vara användbart att lägga till fler än en meny. Du kan välja en rullgardinsmeny med dina produktkategorier som huvudmeny, samtidigt som du använder en separat meny i sidfoten som innehåller sekundära kategorier. Detta förhindrar att huvudmenyn blir för rörig. Titta på tabellen nedan för att se hur detta ser ut.
Tips #8: Utseendet spelar roll
En attraktiv menydesign bör behålla samma storlek, även när huvudmenyns alternativ innehåller olika många underkategorier. Om din webbplats innehåller en sökfunktion, se då till att rullgardinsmenyerna inte täcker den när de expanderas.
Du bör också inkludera en liten visuell indikator som visar om ett objekt i navigeringsfältet kommer att expandera till en rullgardinsmeny om användaren klickar eller hovrar över det. Placera till exempel en liten pil bredvid menynamnet: för rullgardinsmenyer bör pilen peka nedåt; för utfällningsmenyer bör den peka åt höger. Detta hjälper dina kunder att intuitivt förstå att de kan förvänta sig att hitta mer information.
