HTML sitemap: teljes útmutató

A HTML sitemap egy látogatóknak szánt, a webhelyen belül elérhető oldal, amely kattintható linkekkel mutatja meg a webhely fő részeit és lapjait. Segít az olvasónak eligazodni, a keresőnek pedig belső linkeken keresztül eljutni a mélyebben fekvő lapokhoz. Nem pótolja az XML sitemapet és a jó navigációt, hanem kiegészíti őket, főleg közepes és nagy webhelyeken.

Alapfogalmak

A HTML sitemap (magyarul gyakran oldaltérkép vagy tartalomjegyzék) egy hagyományos weboldal, amelyet ugyanúgy megnyit a böngésző, mint bármely más lapot. A tartalma egy rendezett linkgyűjtemény: a webhely fő kategóriái, alkategóriái és a legfontosabb lapjai, jellemzően a szerkezetet követő csoportosításban. Általában a láblécből érhető el, és a webhely minden oldaláról egy kattintásra van.

A fogalom a korai webről ered, amikor a navigációs menük egyszerűek voltak, és a webhely teljes szerkezetét egyetlen oldalon szokás volt megmutatni. Ma a legtöbb webhely menürendszere fejlettebb, ezért a HTML sitemap szerepe megváltozott. Kevésbé elsődleges navigációs eszköz, inkább biztonsági háló: egy hely, ahol minden fontos lap biztosan kap legalább egy belső linket, és ahol a látogató akkor is megtalálja, amit keres, ha a menüben elakadt.

HTML és XML sitemap összevetése

Szempont	HTML sitemap	XML sitemap
Kinek szól	Elsősorban a látogatónak, másodsorban a robotnak	Kizárólag a keresőrobotnak
Formátum	Hagyományos weboldal, linkekkel	Szabványos XML fájl
Mit ad a keresőnek	Belső linkeket, szerkezeti összefüggést	URL-listát és metaadatot, például módosítási dátumot
Teljesség	Nagy webhelyen szinte mindig válogatott	Az összes indexelhető URL-t tartalmazhatja
Beküldés	Nincs, belső linkkel érhető el	Robots.txt és Search Console

A két eszköz tehát nem versenytársa egymásnak. Az XML sitemap a felfedezést segíti metaadatokkal, a HTML sitemap belső linket és felhasználói navigációt ad. Egy webhelynek lehet mindkettő, és a nagyobb webhelyeken gyakran érdemes is.

Kapcsolódó fogalmak

Belső link: ugyanazon webhely két lapja közötti hivatkozás. A HTML sitemap lényegében belső linkek gyűjteménye.
Kattintási mélység: hány kattintásra van egy lap a kezdőlaptól. A HTML sitemap ezt csökkentheti a mélyen fekvő lapoknál.
Árva lap: olyan lap, amelyre semmilyen belső link nem mutat. A HTML sitemap az egyik egyszerű eszköz az árva lapok bekötésére.
Webhelyszerkezet: a kategóriák és lapok hierarchiája. Egy jó HTML sitemap ezt teszi láthatóvá.

Hol a helye a webhelyen

A HTML sitemapnek nincs kötelező címe vagy helye, de néhány szokás bevált. Az oldal címe legyen egyértelmű, például „Oldaltérkép", és a lábléc állandó linkjei között szerepeljen, ahol a látogatók az ilyen kiegészítő oldalakat keresni szokták. Az URL legyen rövid és beszédes. A lap maga a webhely normál sablonját használja, fejléccel és menüvel, hogy a látogató innen is tovább tudjon lépni bármerre. Ha a webhely többnyelvű, minden nyelvi változatnak saját sitemap oldala legyen, a saját nyelvű lapokkal és linkszövegekkel, ne egy közös, vegyes lista.

Hogyan működik?

A HTML sitemap két közönségre hat, és mindkettőnél másként. A látogatónak egy áttekintő oldal, a keresőnek egy linkekkel teli lap, amelyen keresztül további lapokat talál. Érdemes mindkét működést külön megérteni, mert a tervezési döntések ebből következnek.

A látogató szemszögéből

A látogató jellemzően akkor nyitja meg a HTML sitemapet, ha a menüben vagy a belső keresőben nem találta meg, amit keresett, vagy ha áttekintést szeretne a webhely teljes kínálatáról. Ilyenkor az oldal akkor hasznos, ha gyorsan átlátható: egyértelmű csoportcímek, logikus sorrend, beszédes linkszövegek. Egy több ezer linket felsoroló, tagolatlan oldal ebből a szempontból használhatatlan, akkor is, ha technikailag teljes.

A kereső szemszögéből

A keresőrobot a HTML sitemapet ugyanúgy kezeli, mint bármely más lapot: letölti, és a rajta lévő linkeket követi. Minden link egy újabb felfedezési lehetőség. Ha egy lapra máshonnan csak mélyen, sok kattintással lehet eljutni, a HTML sitemap egy rövidebb utat ad hozzá. Mivel a sitemap oldalt a lábléc miatt a webhely szinte minden lapja linkeli, a róla induló linkek viszonylag könnyen elérhetők a robot számára.

A linkeknek itt szövege is van, és ez a különbség az XML változathoz képest. A linkszöveg megmondja, miről szól a céllap, és ezzel a kereső a céllap témáját is jobban érti. Ezért a HTML sitemapben a linkszöveg ne egy URL vagy egy azonosító legyen, hanem a lap valódi neve.

A linkek súlya és a lap mérete

Egy lap belső linkjei nem egyformán fontos jelzések. Egy tartalmi szövegben, témához illő mondatban álló link erősebb kontextust ad, mint egy hosszú lista egyik eleme. A HTML sitemap linkjei listaszerűek, ezért elsősorban elérhetőséget biztosítanak, nem erős témajelzést. Ebből két következtetés adódik. Egyrészt a sitemap nem pótolja a tartalmi belső linkelést. Másrészt minél hosszabb a lista, annál kevesebbet mond az egyes linkekről, ezért a válogatás és a csoportosítás itt is számít.

Mit nem csinál a HTML sitemap

Nem kényszeríti ki az indexelést. A kereső a céllapokról a saját szempontjai szerint dönt.
Nem javítja meg a rossz fő navigációt. Ha a menü hiányos, a látogatók nagy része sosem jut el a sitemap oldalig.
Nem ad módosítási dátumot, ezért a frissítések jelzésére nem alkalmas.
Nem helyettesíti a tartalmi belső linkelést, amely a szövegkörnyezetben, témához illő linkszöveggel köti össze a lapokat.

Fő módszerek

A HTML sitemap felépítése a webhely méretétől függ. Ami egy harmincoldalas cégbemutató webhelyen jól működik, az egy százezer termékes webáruházban kezelhetetlen. Az alábbi módszerek a leggyakoribb helyzeteket fedik le.

Teljes lista kis webhelyen

Néhány tucat lapos webhelyen a HTML sitemap tartalmazhatja az összes indexelhető lapot, a menüszerkezetet követő csoportosításban. Ez egy oldalon áttekinthető, és könnyen karbantartható. A kérdés inkább az, szükség van-e rá egyáltalán: ha minden lap egy-két kattintásra van a kezdőlaptól, a sitemap oldal főleg a látogatóknak ad kényelmi funkciót.

Hierarchikus, kategória alapú sitemap

Közepes webhelyen a sitemap a fő kategóriákat és alkategóriákat sorolja fel, alattuk a legfontosabb lapokkal. A tartalom egyes lapjait nem kell mind kilistázni, mert azokhoz a kategóriaoldalakon keresztül el lehet jutni. A cél az, hogy a sitemapről minden kategória közvetlenül elérhető legyen, és a kategóriákon belül a lapok is megtalálhatók maradjanak.

Többszintű, felosztott sitemap nagy webhelyen

Nagy webhelyen egyetlen oldal nem bírja el a teljes listát. Ilyenkor a HTML sitemap több oldalra oszlik: egy fő sitemap oldal a kategóriákat mutatja, és minden kategóriához tartozik egy saját sitemap aloldal, amely az adott kategória lapjait sorolja fel. Ha egy aloldal még így is túl hosszú lenne, betűrend vagy alkategória szerinti bontás segít. A lapozás itt kerülendő, ha lehet, mert a lapozott listák végén lévő tételek ugyanúgy mélyre kerülnek, mint korábban; ha mégis kell, a pagination útmutató szabályai itt is érvényesek.

Automatikus generálás

Bármelyik szerkezetet is választod, a HTML sitemapet érdemes a tartalomkezelőből vagy az adatbázisból generálni, nem kézzel szerkeszteni. A kézi lista gyorsan elavul: megszűnt lapokra mutat, és az újak kimaradnak belőle. A generálás szabálya ugyanaz legyen, mint az indexelhetőségé: ami noindex, átirányít vagy hibát ad, az ne kerüljön a listába.

Döntési szabály: kell-e HTML sitemap

Minden fontos lap legfeljebb néhány kattintásra van, és a menü teljes: a HTML sitemap nem szükséges, de kényelmi funkcióként nem árt.
Vannak mélyen fekvő, kevés belső linket kapó lapok: a HTML sitemap egyszerű módja a bekötésüknek.
Sok kategória, bonyolult szerkezet, sok látogató használja a keresőt vagy a láblécet: a HTML sitemap érdemi navigációs segítség.
A webhely több százezer lapos: a sitemap csak válogatott, többszintű formában működik, és a belső linkelés fő terhét a kategóriaszerkezetnek kell vinnie.

Gyakori hibák

A HTML sitemap hibái többnyire abból fakadnak, hogy egyszer elkészül, aztán senki sem nézi meg újra. A webhely közben változik, a sitemap pedig egyre kevésbé tükrözi a valóságot.

Hibás és átirányított linkek

A leggyakoribb hiba a megszűnt lapokra mutató link. Egy elavult sitemap oldal tele lehet 404 hibát adó vagy átirányított célokkal. A látogatónak ez rossz élmény, a keresőnek felesleges kör. Az átirányított linkeket a végső célra kell cserélni, a megszűnt lapokat törölni kell a listából.

Nem indexelhető lapok felsorolása

Ha a sitemap noindex jelölésű lapokat, szűrt listanézeteket vagy paraméteres URL-eket is felsorol, a robot olyan címekre fordít időt, amelyeket úgyis kizársz. Ez különösen webáruházakban fordul elő, ahol a szűrőkombinációk lapjai is bekerülhetnek egy automatikus listába.

Tagolatlan, óriási linklista

Egy oldal, amely csoportosítás nélkül több ezer linket sorol fel, sem a látogatónak, sem a keresőnek nem jó. Az olvasó nem talál meg benne semmit, a lap maga pedig lassú és nehezen értelmezhető. A megoldás a hierarchikus felosztás és a válogatás.

Egyéb hibák

A sitemap oldal maga noindex vagy robots.txt által tiltott, így a rajta lévő linkek feltérképezési szerepe is gyengül.
A linkek JavaScripttel, eseménykezelővel működnek, nem valódi href attribútummal, így a robot nem biztos, hogy követi őket.
A linkszövegek nem beszédesek: „termék 1", „oldal 23", vagy maguk az URL-ek.
A HTML sitemap nincs belinkelve sehonnan, vagy csak egy nehezen megtalálható helyről.

Ellenpélda: a sitemap mint menüpótlék

Előfordul, hogy egy webhely menüje szándékosan minimális, és a tervezők a HTML sitemapre bízzák, hogy a látogató mindent megtaláljon. Ez rossz irány. A látogatók túlnyomó része a menüt és a tartalmi linkeket használja, és sosem jut el a láblécig. Ha egy fontos kategória csak a sitemap oldalról érhető el, a látogatók nagy része nem fogja megtalálni, a kereső pedig egy listaelemből kevesebbet tud meg róla, mint egy menüpontból vagy egy kategóriaoldalról. A sitemap a hiányzó navigációt nem pótolja, legfeljebb eltakarja a problémát.

Tévhit: a HTML sitemap elavult, nincs rá szükség

Az igaz, hogy egy jól felépített, sekély szerkezetű webhelynek nem nélkülözhetetlen. Az viszont nem igaz, hogy haszontalan. Nagy és bonyolult webhelyeken a mélyre került lapok bekötésének egyik legegyszerűbb eszköze, és a látogatók egy része valóban használja áttekintésre. A kérdés tehát nem az, hogy elavult-e, hanem az, hogy az adott webhely szerkezete indokolja-e.

Mérés

A HTML sitemap hatását nem egyetlen mutató jelzi. Három irányból érdemes nézni: technikai állapot, belső linkelési hatás és a látogatói használat.

Technikai állapot

Egy feltérképező eszközzel járd be a sitemap oldalt és az összes aloldalát, és kérdezd le a linkek céljainak állapotkódját. Az eredményben nem lehet 3xx, 4xx vagy 5xx állapotú cél. Ellenőrizd azt is, hogy a céllapok indexelhetők-e, és önmagukra kanonizáltak-e. Ha a sitemap és az XML sitemap ugyanazt a forrást használja, a két lista összevetése gyorsan megmutatja az eltéréseket.

Belső linkelési hatás

A feltérképező eszközök többsége mutatja a lapok kattintási mélységét és a rájuk mutató belső linkek számát. Hasonlítsd össze ezeket a sitemap bevezetése előtt és után. Ha a sitemap jól működik, a korábban mélyen fekvő lapok közelebb kerülnek a kezdőlaphoz, és nem marad árva lap az indexelhető halmazban.

Látogatói használat

Az analitikában nézd meg, hányan nyitják meg a sitemap oldalt, és onnan hová kattintanak. Ha sokan használják, az jelezheti, hogy a fő navigáció nem elég egyértelmű. Ha szinte senki, a sitemap főleg a keresőnek szól, és ez rendben van.

Kidolgozott példa 1: szolgáltatói webhely elrejtett aloldalakkal

Egy szolgáltatói webhelyen minden városhoz tartozott egy aloldal, de a menüben csak a fő szolgáltatások szerepeltek. A városi lapokra csak egy legördülő szűrőből lehetett eljutni, amely JavaScripttel töltötte be a listát. A feltérképezés megmutatta, hogy ezekre a lapokra alig mutat valódi link. A HTML sitemap kapott egy „Szolgáltatási területek" csoportot, amely szolgáltatásonként felsorolta a városi lapokat, rendes linkekkel és a városnevekkel mint linkszöveggel. Így minden városi lap kapott legalább egy statikus belső linket, a látogató pedig egy helyen áttekinthette a lefedett területeket.

Kidolgozott példa 2: elavult sitemap egy tartalomoldalon

Egy cikkekkel bővülő webhely évekkel korábban kézzel készített HTML sitemapet. Egy ellenőrzés során kiderült, hogy a linkek jelentős része átirányításra vagy megszűnt lapra mutat, az új rovatok pedig hiányoznak. A megoldás nem a lista kézi javítása volt, hanem a sitemap átállítása automatikus generálásra a rovatszerkezet alapján. A rovatonként bontott oldalak ettől kezdve maguktól követték a tartalom változását.

Ellenőrzőlista

A sitemap oldal a webhely minden lapjáról elérhető, jellemzően a láblécből.
A sitemap oldal indexelhető, és nem tiltja a robots.txt.
Minden link valódi href, és 200-as, indexelhető célra mutat.
A linkszövegek a céllapok valódi nevei.
A szerkezet a webhely hierarchiáját követi, csoportcímekkel.
Nagy webhelyen a sitemap többszintű, és egy oldal sem kezelhetetlenül hosszú.
A lista automatikusan frissül, és ugyanazt a szabályt követi, mint az XML sitemap.