Lær at opsætte den optimale megamenu ift. SEO

Dette indlæg er skrevet i samarbejde med Thomas Skov Iversen fra NemProgrammerig.dk.

Mange danske websites vælger i stigende grad at bygge deres primær navigation op omkring en megamenu. Det gør de da dette er en nem og brugervenlig måde at indarbejde mange menupunkter på siden. Dette betyder at navigationen ikke virker stor og overflødig.

Inden du begynder at implementere en megamenu på din side, er det vigtigt at du tænker dig om ift. SEO. Hvis megamenuen ikke kan crawles ordentligt kan det have negativ indflydelse på sidens rankings.

Hvad er en megamenu egentlig?

Inden vi kigger på, hvordan man bedst muligt implementerer en megamenu, så er det måske en god idé lige at vise, hvad en megamenu egentlig er med et par eksempler.

Den traditionelle menu

Vi har vist alle på et eller andet tidspunkt stødt ind i en menu som den på billedet nedenfor:

Menuen er fundet på billig-webhosting.dk og er en standard Bootstrap menu, hvor menupunkterne ligger som perler på en snor under hovedmenupunktet. Det er ikke svært at se, at denne menu hurtigt kan blive et problem, hvis man vil have ret meget mere end 12 menupunkter i undermenuen. Allerede nu vil mange faktisk mene, at menuen som vist ovenfor, er for lang og uoverskuelig.

Megamenu

For at gøre menuer mere overskuelig og muliggøre flere menupunkter kan du i stedet lave en megamenu. Det har profil-rejser.dk f.eks. gjort på deres side som vist i eksemplet nedenfor:

Denne menu anvender hele sidens bredde, og kan nemt indeholde rigtig mange menupunkter, uden at det bliver uoverskueligt. Som i eksemplet ovenfor kan menuen tilmed inddeles i overskrifter med menupunkter under hver overskrift for endnu bedre brugervenlighed.

Hvad så med SEO?

Vi kan hurtigt blive enige om, at en megamenu har en masse UI mæssige fordele, men for at den også fungerer godt i forhold til SEO, er der en række grundlæggende ting, som skal være i orden. For det første skal menuen nemt kunne læses (crawles) af Google. Det nytter ikke noget at lave en fancy menu som renderes med JavaScript eller Flash ved tryk på hovedmenupunktet. Eller en menu, hvor menupunkterne hentes ud ”on the fly” via eksempelvis et Ajax-kald alt efter, hvilket menupunkt man trykker på.

Det anbefales, at links i menuen altid er til stedet i kildekoden og ikke indsættes via JavaScript. Google er smart nok til at læse JavaScript, men brug i stedet rå HTML og CSS til at lave menuen for at være på den sikre side. Husk desuden altid at smide et <nav> element omkring din menu.

Selvom du nu har masser af menuplads at boltre dig på, så er det vigtigt, at du ikke smider menupunkter ind, blot fordi der er plads til dem. Hvis du har arbejdet en lille smule med SEO, så ved du nemlig også, at den værdi der kommer fra dine indgående links, også kaldet ”linkjuice”, skal fordeles videre til undersider på din side. Hvilke sider der får noget af linkjuicen bestemmes blandt andet ud fra din menustruktur, da den hjælper Google til at forstå, hvilke sider der er centrale på siden.

Det er derfor vigtigt, at du vælger dine menupunkter med omhu, så du ikke giver linkjuice videre til en masse sider, der kun er lagt i megamenuen, fordi der var plads til dem, og ikke fordi de var vigtige for din side.

Er din side en større og autoritær side, vil den sandsynligvis godt kunne bære adskillige menupunkter i megamenu og stadig ranke højt på de fleste, men er din side ny og uden en god linkprofil, vil der sandsynligvis ikke være nok ”linkjuice” til at kunne bære alle undersiderne, og du vil derfor opleve, at du i stedet for at ranke godt med et par af siderne i din menu, kommer til at ranke middelmådigt på dem alle.

Udover den nøje udvælgelse af menupunkter så er rækkefølgen på menupunkterne også vigtig. Google giver mere værdi til de menupunkter der først indlæses når GoogleBot kommer til siden. Derfor er det også vigtigt, at du placerer de vigtigste menupunkter først i megamenuen, således at GoogleBot finder disse som det første.

Hvis du følger ovenstående råd, og laver en menu, som nemt kan læses af Google og som kun indeholder relevante og vigtige links i den rette rækkefølge, så er du godt på vej til en succesfuld implementering af din egen megamenu.