Hvordan laver man en navigationslinje?
Læs hvordan du opretter en navigationslinje på din hjemmeside og gør det nemt for dine besøgende at navigere rundt på sitet
Måden hvorpå du designer din navigationslinje er vigtig. Designet og brugervenligheden er tæt forbundet med slutbrugeroplevelsen. Hvis du designer en smart navigationsbar, der er nem at bruge, så vil dine besøgende få en god oplevelse. Hvis en bruger til gengæld har svært ved at finde rundt i topmenuen, så kan det hurtigt resultere i at personen forlader din hjemmeside og måske aldrig vender tilbage.
Den moderne internetbrugers tålmodighed er yderst begrænset, og derfor er det vigtigt, at de kan finde sider, de leder efter. Hvis en bruger straks forlader dit website, fordi navigationen virker uoverskuelig eller ulogisk, så vil det også slå igennem i din Google Analytics oversigt under afvisningsfrekvens og konverteringsfrekvenser.
Opbygningen af din hjemmesides navigationslinje giver dig mulighed for at prioritere det indhold, som du gerne vil have dine besøgende til at læse. Du kan opbygge navigationsbaren, så de vigtigste sider ligger tilgængelige øverst til venstre og have en struktur, hvor de mindre vigtige sider bliver vist længst nede til højre i navigationsmenuen.
I denne artikel vil vi gennemgå, hvordan du får opbygget den bedste navigationslinje, og vi vil præsentere dig for alle de vigtige elementer, der bør indgå i en navigationsmenu.
Hvad er en navigationslinje?
Formålet med en navigationslinje er at hjælpe dine brugere til uden besvær at kunne navigere rundt på din hjemmeside. En navigationslinje er normalt placeret øverst på hjemmesiden som en topmenu. På en mobiltelefon placeres navigationsbjælken normalt øverst til venstre og ligner typisk en hamburger eller som den også omtales – en hamburger menu.
Navigationsmenuen består af interne links; dvs. links til alle de sider, som dine besøgende gerne skulle læse.
Eksempler på navigationbar
Hvis vi bruger one.com’s hjemmeside, som eksempel kan du se, at navigationslinjen er placeret øverst. Du kan også se, at vi i navigationslinjen har medtaget alle de produkter, som vi sælger. Derudover har vi også tilføjet nogle vigtige links, der gør det let for kunderne at vælge produkter samt at komme i kontakt med os.
De mest almindelige kategorier, som implementeres i en navigationslinje, er:
Om os
Kontakt
Produkter
FAQ
Men som vist med vores eksempel på one.com kan du helt selv vælge, hvordan din navigationslinje skal se ud, og hvilke punkter, som du ønsker at medtage.
Hvorfor er en navigationsmenu vigtig?
En navigationsmenu er vigtig, fordi den for brugerne er med til at lette søgningen i hjemmesiden indhold. Hvis der ikke fandtes en navigationsmenu på hjemmesiden, hvordan skulle brugerne så kunne finde alt dit vigtige indhold på sitet? Det er både naturligt og logisk via forsiden at linke til bestemte undersider, men det vil formentligt ikke være muligt at linke til alt indhold uden at der findes en navigationsmenu.
Ved at implementere en navigationsmenu gør du det let for brugerne at klikke sig rundt på sitet. Og rent faktisk opnår du det, at dine brugere bliver længere tid på dit website og højst sandsynligt klikker sig rundt til flere undersider, hvor du fremviser dine produkter eller ydelser.
Disse punkter bør du have med navigationslinjen
Der er helt sikkert nogle ting, der skal overvejes, når du designer din navigationsmenu, og der findes nogle elementer, der er ekstra vigtige for at din hjemmeside fungerer optimalt. Som tidligere nævnt vil en hjemmeside uden en velfungerende navigationsmenu, som oftest føre til en dårlig brugeroplevelse. Og resultat vil blive, at de besøgende sendes væk igen, inden de har haft lejlighed til at se, hvad der findes af spændende indhold på sitet.
Indhold og design af din navigationmenu
Indholdet på din hjemmeside afspejler, hvilken type forretning du driver, og navigationsmenuen virker som en vejviser, der sender brugerne i den rigtige retning, alt afhængig af, hvad de er på udkig efter. Når du er færdig med at oprette indhold på din hjemmeside, og har grundstrukturen på plads, så er det tid til at beslutte, hvad du synes, der skal inkluderes i din navigationsmenu. Der er ingen facitliste; det hele afhænger af dine prioriteter. Du bør dog begrænse dine kreative udfoldelser, når det gælder udformningen af navigationsmenuen og holde dig til nogle overordnede kategorier, der er enkle og lette at forstå for brugerne.
For eksempel kan det være tilstrækkeligt for et serviceselskab at have navigationen placeret i menuen øverst på siden. Den samme stil vil dog nemt kunne komme til at fremstå uoverskueligt for en e-handelshjemmeside, hvor de øverste produktkategorier skal guide brugeren i den rigtige retning for at kunne finde det, de leder efter.
Et eksempel på en god navigationsmenu finder man hos Samsung. På trods af de relativt mange forskellige produkter, der findes på siden, så er navigationslinjen holdt i en stram og enkelt struktur med blot fire produktkategorier, som vises ude til venstre på siden. Mens andre relevante emner, som eksempelvis virksomhedens historie, vises ovre til højre. Ved at vælge denne opbygning har Samsung signaleret, hvad de mener der er vigtigst, og hvad der trods alt må betegnes som sekundært, når det handler om at sælge produkter.
– Hypertekst
Sørg for, at dit indhold og dine hypertekst er differentieret. Dine brugere skal tydeligt kunne se forskellen mellem hypertekst og faktisk tekst på en side.
– Farver
Sørg også for, at din navigationslinje skiller sig ud fra det øvrige grafiske udtryk på siden. Det er vigtigt, at der er forskel på dit hovedindhold (Forsiden) og din navigationsmenu. Differentieringen kan du skabe ved hjælp af farver, skrifttyper og andre typer af grafiske elementer.
Brug links i stedet for knapper i din navigationslinje
I dag bruger flere og flere hjemmesider links i navigationslinjen i stedet for knapper. Tidligere benyttede mange hjemmesider knapper, men de er ikke specielt søgemaskinevenlige. Derudover er de mindre at få øje på, hvilket kan gøre det vanskeligt for personer, der er synshandicappede.
Gem derfor brugen af knapper til dit indhold, der kalder på en ’Call to action’.
Skjul dit søgefelt
En ny tendens går i retning af, at flere og flere hjemmesider skjuler søgefeltet, indtil det er nødvendigt at det bliver vist. Det skyldes, at mange ønsker at reducere den visuelle kompleksitet, og på mange hjemmesider er det slet ikke nødvendigt at få den vist, da den ofte kun bliver brugt meget lidt.
Sticky navigationslinje
En såkaldt ’sticky’ navigationslinje kan være en god ide at implementere. Hvis du vil se et eksempel på, hvordan det fungerer, kan du tjekke vores hjemmeside, one.com. Her vil du lægge mærke til, at når du ruller ned i denne artikel, så følger one.com-navigationslinjen med ned ad siden.
En ’sticky’ navigationslinje giver brugerne mulighed for at hoppe til forskellige sektioner uden at have besværet med at skulle rulle op øverst på siden for at komme videre. Du kan også vælge at indsætte et link med teksten ‘Gå til toppen af siden’, som følger med, når der scrolles ned ad siden. Den løsning kan anvendes, hvis ikke du ønsker, at navigationslinjen skal følge med og dække for en del af skærmens indhold.
Overvej også at have en footer
Sidefoden på din hjemmeside kan også fungere som en form for navigationslinje. I sidefoden (footeren) kan du tilføje ekstra information (links), som du ikke ville have med i navigationsmenuen eller blot ikke havde plads til. En sidefod kan også bruges til at gentage vigtige oplysninger. Når brugeren har nået slutningen af siden, kan de bare klikke på det næste punkt (link), der er angivet i sidefoden for at komme videre til mere af dit spændende indhold.
