Navigációs link: teljes útmutató

Navigációs linknek a webhely állandó keretében megjelenő linkeket nevezzük: a főmenüt, a mega menüt, az oldalsávot, a kategórianavigációt és a mobilmenüt. Ezek szinte minden oldalon ott vannak, ezért ők határozzák meg, mely oldalak vannak közel a főoldalhoz, és mit tart a kereső a webhely fő témáinak. A jó navigáció kevés, egyértelmű menüponttal, HTML linkekkel és a pénzt hozó oldalak előtérbe helyezésével működik.

Alapfogalmak

Ez az útmutató a belső linkek egyetlen csoportjával foglalkozik: azokkal, amelyek nem a tartalom részei, hanem a sablon részei. A belső linkelés általános menetét, az auditot, a linktérképet és a linkek elhelyezésének lépéseit a belső linkelés gyakorlati útmutatója írja le, a témakör egészét pedig a belső linkelés összefoglaló oldala fogja össze. Itt csak azt bontjuk ki, ami a menükre, a kategórianavigációra és az oldalsávra jellemző, és ami a folyó szövegben elhelyezett linkeknél nem így működik.

A navigációs link lényege, hogy nem egy konkrét szövegkörnyezethez tartozik. Egy kontextuális link azért áll ott, ahol áll, mert az adott mondat témája a céloldalra utal; ennek szabályait a contextual link útmutató tárgyalja. A navigációs link ezzel szemben minden oldalon ugyanúgy megjelenik, függetlenül attól, hogy az oldal éppen miről szól. Ebből két következmény adódik: egyrészt nagyon sok belső linket ad a céloldalnak, másrészt kevés tematikus jelzést hordoz, mert nincs körülötte magyarázó szöveg.

A navigációs linkek fajtái

Típus	Hol jelenik meg?	Jellemző szerepe
Főmenü	Fejléc, minden oldalon	A webhely fő témái és a legfontosabb üzleti oldalak
Mega menü	A főmenüből lenyíló, több oszlopos panel	Nagy kínálat alkategóriáinak elérése egy lépésből
Oldalsáv	A tartalom mellett, sablononként eltérő	Kategórialista, népszerű oldalak, szűkebb témakör navigációja
Kategórianavigáció	Kategória- és listaoldalakon	Lefelé vezet a hierarchiában, alkategóriákra és termékekre
Szűrős (faceted) navigáció	Webáruházak listaoldalain	Tulajdonságok szerinti szűkítés, sok URL-változattal
Mobilmenü	Hamburger ikon mögött, kis kijelzőn	Ugyanaz a feladat, mint a főmenüé, kisebb helyen

A lábléc linkjei, a kapcsolódó cikkek blokkja és a morzsamenü szintén a sablon részei, de mindháromnak külön útmutatója készül (Footer link, Related articles, Breadcrumb linkelés), ezért itt csak ott említjük őket, ahol a menütervezést közvetlenül érintik.

Site-wide link és menücímke

Két fogalmat érdemes még tisztázni. A site-wide link olyan link, amely a webhely összes vagy szinte összes oldalán megjelenik; a főmenü minden pontja ilyen. A menücímke pedig a menüpont szövege, amely horgonyszövegként működik. A horgonyszövegek általános szabályait az anchor text útmutató ismerteti; a menücímkénél az a különbség, hogy ugyanaz a szöveg több ezer oldalon ismétlődik, így egyetlen rossz szóválasztás az egész webhelyen elterjed.

Hogyan működik?

A kereső a webhelyet linkek mentén járja be. A főoldalról induló robot először a főoldalon látható linkeket találja meg, és ezek között a navigáció linkjei vannak a legnagyobb számban és a legmegbízhatóbb helyen. A bejárás általános folyamatát a crawling útmutató írja le. A navigációs linkeknek ebben a folyamatban három hatása van: meghatározzák a kattintási mélységet, elosztják a belső linkek adta súlyt, és jelzik, mit tart a webhely fontosnak.

Kattintási mélység

Ami a főmenüben szerepel, az a főoldalról egy kattintásra van, és mivel a menü minden oldalon ott van, bármely más oldalról is. Ami a mega menü második szintjén van, az szintén egy kattintásra érhető el, még ha a látogatónak le is kell nyitnia a panelt. Ami csak a kategóriaoldalról érhető el, az kettőre, ami csak egy alkategória lapozott listájáról, az akár négy-öt kattintásra is kerülhet. A navigáció tehát az a hely, ahol a legolcsóbban lehet egy oldalt közelebb hozni a főoldalhoz. Az oldalak hierarchiájának tervezését az oldalstruktúra útmutató tárgyalja részletesen.

A site-wide link súlya

Egy főmenüpont minden oldalról kap linket, ezért a belső linkek számlálásakor messze kiemelkedik. Ez hasznos, ha a menüpont egy fontos oldalra mutat, és pazarlás, ha egy olyan oldalra, amely üzletileg vagy keresési szempontból mellékes. Azt, hogy a Google pontosan hogyan súlyozza az ismétlődő sablonlinkeket a tartalmon belüli linkekhez képest, nem hozta nyilvánosságra részletesen, ezért a gyakorlati szabály az, hogy a menübe csak olyan oldal kerüljön, amelynek valóban minden oldalról elérhetőnek kell lennie. A tematikus jelzést a kontextuális linkek adják, a navigáció inkább az elérhetőséget és a hierarchiát biztosítja.

HTML linkek és JavaScript menük

A navigáció csak akkor segít a bejárásban, ha a kereső linkként ismeri fel. A Google dokumentációja szerint a követhető link egy a elem, amelynek href attribútuma egy valódi URL-t tartalmaz. Ha a menüpont egy span vagy div, amely kattintásra JavaScripttel vált oldalt, vagy a href értéke csak egy # jel, akkor a robot nem feltétlenül talál el a céloldalra. Ugyanez a kockázat áll fenn, ha a mega menü tartalma csak egérmozgatásra töltődik be egy külön kérésből, és a kezdeti HTML-ben nincs benne. A biztonságos megoldás az, hogy a menü minden linkje szerepeljen a szerver által küldött HTML-ben, és a JavaScript csak a megjelenítést (lenyitás, animáció) kezelje.

Ellenőrizni egyszerű: nézd meg az oldal forráskódját (nem a böngésző fejlesztői nézetének élő DOM-ját), és keresd meg benne a menüpontok URL-jeit. Ha a forrásban nincsenek ott, akkor a menü a renderelésre támaszkodik, és érdemes a Search Console URL-vizsgálójával is megnézni, mit lát a Google a renderelt változatban.

Fő módszerek

A navigáció tervezése döntések sorozata: mi kerüljön a főmenübe, milyen néven, hány ponttal, mi menjen a mega menübe vagy az oldalsávba, és hogyan kezeld a szűrőket. Az alábbi módszerek ebben a sorrendben érdemes végigmenni.

1. A menüpontok kiválasztása üzleti és keresési prioritás szerint

Kezdd egy listával, amely minden jelölt oldalt tartalmaz: kategóriákat, szolgáltatásoldalakat, fő témaoldalakat. Minden oldal mellé írd fel, mennyi bevételt vagy érdeklődőt hoz, van-e hozzá keresési kereslet, és a látogatók mennyire keresik a navigációban. A főmenübe azok kerülnek, amelyek legalább két szempontból erősek. Egy szolgáltató cégnél ez jellemzően a fő szolgáltatásoldalak csoportja, egy webáruháznál a legfelső szintű kategóriák, egy tartalmi oldalnál a fő témakörök központi oldalai. A "Rólunk", a "Kapcsolat" és a jogi oldalak ritkán tartoznak a pénzt hozó oldalak közé; a Kapcsolat a legtöbb webhelyen mégis a főmenüben marad, mert a látogatók ott keresik, a jogi oldalak helye viszont inkább a lábléc.

2. Hány menüpont legyen?

Erre nincs a Google által megadott szám, és a sokat idézett "legfeljebb hét pont" sem keresőoptimalizálási szabály, hanem egy felhasználói élményre vonatkozó ökölszabály. A jó kérdés az, hogy a menü minden pontja megkülönböztethető-e a többitől, és a látogató egy pillantással eldönti-e, merre menjen. Ha két menüpont címkéje alapján nem egyértelmű, melyik alá tartozik egy téma, akkor túl sok vagy rosszul tagolt a menü. A főmenü felső szintje legyen szűk, a mélységet a mega menü vagy a kategóriaoldalak adják.

3. Menücímkék horgonyszövegként

A menücímke legyen rövid, és írja le a céloldal témáját úgy, ahogyan a látogatók nevezik. A "Szolgáltatások" címke egy lenyíló csoport fejléceként megfelelő, de ha maga is link egy gyűjtőoldalra, érdemes megnézni, nem jobb-e a konkrétabb "Könyvelés és bérszámfejtés". Kerüld a belső szakzsargont, a márkázott termékcsalád-neveket, amelyeket senki sem keres, és a kulcsszóhalmozást: a "Olcsó laptop akció laptop webshop" típusú címke a felhasználónak zavaró, és site-wide ismétlődve egyértelműen mesterkélt. A magyar nyelvben a menücímke szinte mindig alapalakban áll, ez megkönnyíti, hogy egyezzen a céloldal fő kulcsszavával, de nem kötelező: a látogató értse elsőre.

A mega menü akkor jó megoldás, ha a kínálat valóban széles, és az alkategóriák egy lépésből való elérése a látogatónak is segít. A hátránya, hogy könnyű túltölteni: ha minden felső menüpont alatt negyven link van, akkor minden oldal több száz azonos navigációs linkkel indul, és a fontos alkategóriák elvesznek a kevésbé fontosak között. Tartsd a mega menüben az alkategóriák kiemelt részét, a teljes listát pedig a kategóriaoldalon.

Az oldalsáv rugalmasabb, mert sablononként változhat. Egy blogcikk oldalsávjában a cikk témakörének többi központi oldala jobb választás, mint a teljes kategórialista vagy egy "legújabb bejegyzések" blokk, amely folyamatosan változik, és mindig a friss, de nem feltétlenül fontos oldalakat erősíti.

5. Szűrős navigáció kordában tartása

A webáruházak szűrői (szín, méret, ár, márka) minden kombinációval új URL-t hozhatnak létre. Ha ezek a szűrőlinkek követhető HTML linkek, a robot rengeteg közel azonos oldalt talál, ami a bejárási erőforrást a fontos oldalaktól veszi el. Itt a navigációs link kérdése technikai kérdéssé válik: mely szűrőkombinációk kapjanak saját, indexelhető oldalt (például "női futócipő" mint önálló kategória), és melyek maradjanak a bejárásból kizárva vagy nem követhető formában. A részleteket a faceted navigation útmutató, a bejárási erőforrás kérdését a crawl budget útmutató, a végtelen URL-terek felismerését a crawl trap útmutató írja le.

6. Mobilmenü egyezés

A Google a mobilos változatot használja az indexeléshez, ezért ha a mobilmenü rövidebb, mint az asztali, akkor a kihagyott linkek a Google szemében nem léteznek a navigációban. Ez gyakran észrevétlen marad, mert a fejlesztő a kis kijelzőn "egyszerűsít", és a mega menü alkategóriái eltűnnek. A mobilmenü lehet másképp tagolt (több szintre bontva, lenyitható csoportokkal), de ugyanazokat a linkeket tartalmazza, mint az asztali menü, és a linkek legyenek benne a HTML-ben akkor is, ha a menü zárt állapotban van.

Döntési táblázat: hova kerüljön egy oldal linkje?

Helyzet	Döntés
Fő bevételi oldal vagy legfelső kategória, a látogatók keresik	Főmenü, felső szint
Fontos alkategória egy széles kínálatban	Mega menü vagy kategóriaoldal kiemelt blokkja
Egy témakörön belül fontos, máshol nem releváns	Az adott témakör oldalsávja és kontextuális linkek
Keresett tulajdonságkombináció (például márka és kategória)	Saját indexelhető listaoldal, linkkel a kategóriaoldalról
Keresési kereslet nélküli szűrőkombináció	Nem kap követhető navigációs linket, vagy kizárod a bejárásból
Jogi, adminisztratív oldal	Lábléc
Szezonális kampányoldal	Időszakosan a főmenüben, utána kategóriaoldal és kontextuális linkek

Gyakori hibák

A navigációs hibák azért drágák, mert a sablonban vannak: egyetlen rossz döntés a webhely összes oldalán megjelenik. Ugyanakkor ugyanezért gyorsan javíthatók, hiszen egy sablonmódosítás mindenhol érvényesül.

Gyakori, hogy a főmenü a belső osztályok vagy termékcsaládok neveit tartalmazza, mert így készült az első változat. A látogató és a kereső viszont a problémája vagy a keresett termék felől érkezik. Ha a menüben "Megoldások", "Portfólió" és "Szegmensek" áll, a látogató nem tudja, hol van az, amit keres, és a menücímkék semmit nem mondanak a céloldalak témájáról.

Minden fontosnak tűnik, ezért minden a menüben van

Amikor minden érintett a saját oldalát szeretné a menüben látni, a menü nő, és a pontok egyre kevésbé különböztethetők meg. A következmény kettős: a látogató nehezebben talál, és a főmenü site-wide linkjei olyan oldalakra is jutnak, amelyek ezt nem indokolják. Ilyenkor a prioritási lista (lásd a Fő módszerek első lépését) a vita eldöntésének eszköze.

Nem követhető menülinkek

A JavaScript eseménykezelővel működő, href nélküli menüpontok, a csak felhasználói interakcióra betöltődő mega menü és a képként megjelenített, szöveg nélküli menüpontok mind azt kockáztatják, hogy a robot nem jut el a céloldalakra, vagy nem kap róluk értelmezhető horgonyt. A képes menüpontnál legalább az alt szöveg írja le a céloldalt.

Eltérő asztali és mobilmenü

Ha az asztali mega menüben ott vannak az alkategóriák, a mobilmenüben pedig csak a felső szint, akkor az alkategóriák kattintási mélysége a mobilos bejárásban nagyobb lesz, mint amit az asztali nézet alapján gondolnál. Ezt csak akkor veszed észre, ha a feltérképezést mobilos felhasználói ügynökkel is lefuttatod.

Kontrollálatlan szűrőlinkek

A szűrős navigáció, amelynek minden kombinációja követhető és indexelhető, az egyik leggyakoribb oka annak, hogy egy webáruházban a feltérképezett URL-ek száma sokszorosa a valódi termékek és kategóriák számának. Ez nem a menü hibája, hanem a kategórianavigációé, de ugyanúgy a sablonban keletkezik.

Menüből kikerült, de fontos oldalak

Egy menüátalakítás után a korábban menüből elért oldalak gyakran elveszítik szinte az összes bejövő linküket, mert senki sem gondolt arra, hogy a kategóriaoldalakról vagy a tartalomból is linkelje őket. A menü változtatása előtt ezért mindig nézd meg, melyik oldal mennyi bejövő linket kap csak a navigációból.

Mérés

A navigáció hatását két oldalról érdemes mérni: technikai szempontból (mit lát a robot, milyen mélyen vannak az oldalak) és teljesítmény szempontjából (változik-e a fontos oldalak megjelenése és a látogatók viselkedése). A mutatók nagy része ugyanaz, mint a belső linkelés általános mérésénél, a különbség az, hogy itt a sablon szintű változások hatását keresed.

Mit mérj és honnan?

Mutató	Forrás	Mit keresel?
Kattintási mélység a prioritásos oldalakra	Feltérképező program, asztali és mobilos futtatás	A fontos oldalak egy-két kattintásra vannak, a két futtatás egyezik
Menülinkek a nyers HTML-ben	Forráskód, feltérképező program renderelés nélkül	Minden menüpont URL-je szerepel a HTML-ben
Bejövő belső linkek oldalanként, navigáció nélkül	Feltérképező program, sablonrészek kizárásával	Mely oldalak élnek csak a menüből
Feltérképezett URL-ek száma a valós oldalakhoz képest	Feltérképező program, Search Console bejárási statisztika	Nincs szűrőkombinációból eredő URL-robbanás
Menüpontokra kattintás	Webanalitika eseménymérése	Mely menüpontokat használják a látogatók, melyeket nem
Megjelenések és kattintások a menüből elért oldalakon	Search Console teljesítményjelentés	Változás a menümódosítás után néhány héttel

A menüpontok kattintásainak mérése azért fontos, mert a navigáció nemcsak a keresőnek, hanem a látogatónak is szól. Ha egy menüpontot szinte senki sem használ, és keresési szempontból sem kiemelt, akkor jó jelölt arra, hogy lekerüljön a főmenüből. Ha viszont egy mélyen eldugott oldalt a belső keresőben sokan keresnek, az jelzés arra, hogy közelebb kell hozni a navigációban.

Saját példa: egy kisebb webáruház menüjének átrendezése

Az alábbi példa egy kitalált, de jellemző esetet mutat be, a lépések sorrendje a lényeg, nem a számok. Egy kerti gépeket forgalmazó webáruház főmenüjében hét pont áll: "Termékek", "Akciók", "Márkák", "Blog", "Rólunk", "Szállítás" és "Kapcsolat". A "Termékek" alatt egy mega menü nyílik, benne mind a harmincnyolc alkategória ábécérendben. A mobilmenüben csak a hét felső pont szerepel, a mega menü nem.

A feltérképezés két dolgot mutat. Asztali futtatásnál minden alkategória egy kattintásra van, mobilos futtatásnál viszont kettőre, mert a mobilos bejárás csak a "Termékek" gyűjtőoldalon keresztül jut el hozzájuk. Emellett a bevétel nagy részét hozó három alkategória (fűnyírók, szegélynyírók, láncfűrészek) ugyanolyan helyen áll a listában, mint a ritkán vásárolt kiegészítők.

A módosítás: a "Termékek" pont helyére a három legfontosabb kategória kerül saját menüpontként ("Fűnyírók", "Szegélynyírók", "Láncfűrészek"), a többi egy "További kerti gépek" csoportba. A mega menü alkategóriánként legfeljebb néhány kiemelt alkategóriát mutat, a teljes lista a kategóriaoldalakon marad. A "Szállítás" és a "Rólunk" a láblécbe kerül. A mobilmenü ugyanazokat a linkeket kapja lenyitható csoportokban, a HTML-ben zárt állapotban is jelen lévő linkekkel. A mérési terv: a változtatás napján rögzítik a három fő kategória megjelenéseit és kattintásait a Search Console-ban, és a menüpontok kattintásait a webanalitikában, majd négy és nyolc hét után ugyanezt, mobilos és asztali bontásban.

Ellenőrzőlista menüváltoztatás előtt és után

Minden menüpont egy a elem, valódi URL-lel a href attribútumban.
A menülinkek a nyers HTML-ben is szerepelnek, nem csak interakció után.
A mobilmenü ugyanazokat a linkeket tartalmazza, mint az asztali.
A főmenü felső szintjén csak prioritási lista alapján kiválasztott oldalak vannak.
A menücímkék a látogatók szóhasználatát követik, és nem halmoznak kulcsszót.
Egyik menüpont sem mutat átirányított, hibás vagy nem indexelendő oldalra.
A szűrőkombinációk közül csak a keresett változatok kapnak követhető, indexelhető linket.
A menüből kikerülő oldalak kapnak bejövő linket a kategóriaoldalakról vagy a tartalomból.
A változtatás előtti állapotról van feltérképezési export és Search Console mentés az összevetéshez.

Kapcsolódó részletes útmutatók

A navigációs link a belső linkelés egyik építőeleme; a többi elem a saját útmutatójában kap részletes kifejtést. A folyó szövegben elhelyezett linkeket a contextual link útmutató, a horgonyszövegek típusait az anchor text útmutató és a hozzá tartozó részletes oldalak tárgyalják. A technikai oldalt, a bejárást és a szűrős navigációt a technikai SEO útmutatói fedik le.

Melyik útmutatót mikor olvasd?

Ha a menü átrendezése előtt a teljes belső linkhálót szeretnéd felmérni, kezdd a belső linkelés gyakorlati útmutatójával, mert az audit és a prioritási lista ott részletesen szerepel.
Ha a menüből kikerülő oldalaknak kell új bejövő linket adni a tartalomból, a contextual link útmutató segít a megfelelő mondat és céloldal kiválasztásában.
Ha a menücímkék megfogalmazásán vitatkoztok, az anchor text útmutató és az exact match, illetve partial match horgonyokról szóló oldalak adnak szempontokat.
Ha a kategóriahierarchiát és a kattintási mélységet kell újratervezni, az oldalstruktúra útmutató a kiindulópont.
Ha a webáruház szűrői sok URL-t termelnek, a faceted navigation és a crawl budget útmutató mutatja meg a technikai megoldásokat.

A navigáció tervezése ritkán egyszemélyes döntés: a fejlesztő, a tartalomért felelős kolléga és az üzleti oldal is beleszól. Érdemes a fenti útmutatókból a döntési táblázatokat és ellenőrzőlistákat közös anyagként használni, így a menü vitája a prioritási lista és a mért adatok körül zajlik, nem ízlés kérdése marad. Egy menüváltoztatás után pedig ugyanezekkel a listákkal ellenőrizheted, hogy a sablon minden nézetben, asztali és mobilos változatban is úgy működik-e, ahogyan terveztétek, és hogy egyetlen fontos oldal sem maradt bejövő link nélkül.

Már elérhető kapcsolódó oldalak

Hamarosan

A sablonlinkek további típusairól külön útmutató készül: Footer link, Related articles és Breadcrumb linkelés. Ezek a lábléc, a kapcsolódó tartalmak blokkja és a morzsamenü tervezését bontják ki, és kiegészítik az itt leírt menütervezési szempontokat.