Heading Analyzer (H1-H6)

Mi a Heading Analyzer eszköz?#

A Heading Analyzer egy ingyenes SEO eszköz, amely átfogóan elemzi a weboldal HTML címsorait (H1-H6) és azonosítja a strukturális problémákat. Az eszköz ellenőrzi a címsorok hierarchiáját, azonosítja a hiányzó szinteket, jelzi a túl hosszú vagy túl rövid címsorokat, és 100 pontos skálán értékeli az oldal heading struktúráját.

A helyes heading struktúra kritikus fontosságú mind az SEO, mind az akadálymentesség szempontjából. A keresőmotorok a címsorokat használják az oldal tartalmának és hierarchiájának megértésére, míg a képernyőolvasók a címsorok alapján navigálnak a látássérült felhasználók.

Miért fontos a helyes heading struktúra?#

1. SEO előnyök#

A Google és más keresőmotorok a heading struktúrát használják az oldal témájának és fontossági sorrendjének megértésére. Egy jól strukturált oldal:

• Jobb rangsorolás: A keresőmotorok könnyebben értelmezik a tartalmat
• Featured snippets: Strukturált címsorok növelik az esélyt a kiemelt pozícióra
• Témakör egyértelmű: A H1 és H2-k jelzik a fő témákat

2. Akadálymentesség (Accessibility)#

A képernyőolvasók és más asszisztív technológiák a heading struktúrát használják navigációra:

• Gyors ugrás: Felhasználók ugorhatnak címsorok között
• Áttekintés: Képernyőolvasók listázhatják a címsorokat
• Kontextus: Címsorok adnak kontextust a tartalomhoz

3. Felhasználói élmény#

A jól strukturált címsorok javítják az olvashatóságot:

• Könnyebb áttekintés: Felhasználók gyorsan megtalálják a keresett információt
• Vizuális hierarchia: Címsorok tagolják a hosszú szöveget
• Tartalomjegyzék: Címsorokból könnyen készíthető tartalomjegyzék

Hogyan használd a Heading Analyzer eszközt?#

1. lépés: HTML kód beszerzése#

Két módszerrel juthatsz a HTML kódhoz:

A) Böngésző Developer Tools:

1. Nyisd meg a vizsgálni kívánt oldalt
2. Nyomd meg F12 vagy Ctrl+Shift+I (Windows) / Cmd+Option+I (Mac)
3. Válaszd a Elements tabot
4. Keresd meg a heading elemeket (<h1>, <h2>, stb.)
5. Másold ki a kívánt HTML szakaszt

B) View Page Source:

1. Nyisd meg az oldalt
2. Jobb klikk → View Page Source (vagy Ctrl+U)
3. Keresd meg a heading elemeket
4. Másold ki a releváns HTML-t

2. lépés: HTML beillesztése#

Illeszd be a HTML kódot az eszköz szövegmezőjébe. Az eszköz automatikusan felismeri a <h1>, <h2>, <h3>, <h4>, <h5> és <h6> elemeket.

Példa HTML bemenet:

<h1>Az oldal fő címe</h1>

<h2>Első fő témakör</h2>
<p>Tartalom...</p>

<h3>Altémakör 1.1</h3>
<p>Részletek...</p>

<h3>Altémakör 1.2</h3>
<p>Részletek...</p>

<h2>Második fő témakör</h2>
<p>Tartalom...</p>

3. lépés: Elemzés indítása#

Kattints a “🔍 Címsorok Elemzése” gombra. Az eszköz azonnal elemzi a heading struktúrát és generál egy részletes jelentést.

4. lépés: Eredmények értelmezése#

Az eszköz négy fő eredményt ad:

1. Pontszám (0-100): Az összes heading struktúra minősége
2. Problémák listája: Hibák, figyelmeztetések és információk
3. Címsor hierarchia: Vizuális fa struktúra
4. Optimalizálási javaslatok: Konkrét lépések a javításhoz

Mit ellenőriz pontosan az eszköz?#

❌ Hibák (ERROR) - 30 pont levonás#

1. Hiányzó H1:

• Ha nincs H1 az oldalon
• Megoldás: Adj hozzá pontosan 1 db H1 címsort

2. Több H1:

• Ha 2 vagy több H1 van az oldalon
• Megoldás: Tartsd meg csak 1 db H1-et, a többi legyen H2 vagy alacsonyabb

Példa - ROSSZ:

<h1>Első cím</h1>
<h1>Második cím</h1>  ❌ Több H1!

Példa - JÓ:

<h1>Fő cím</h1>
<h2>Második cím</h2>  ✅ Helyes hierarchia

⚠️ Figyelmeztetések (WARNING) - 10 pont levonás#

1. Szintugrás:

• Ha kihagysz egy heading szintet (pl. H2 → H4)
• Megoldás: Használj minden szintet sorrendben

Példa - ROSSZ:

<h2>Fő témakör</h2>
<h4>Altéma</h4>  ❌ H3 hiányzik!

Példa - JÓ:

<h2>Fő témakör</h2>
<h3>Altéma</h3>  ✅ Nincs szintugrás

2. Üres címsor:

• Ha egy heading elem nem tartalmaz szöveget
• Megoldás: Töltsd ki értelmes tartalommal

Példa - ROSSZ:

<h2></h2>  ❌ Üres!

Példa - JÓ:

<h2>Értelmes címsor</h2>  ✅ Van tartalom

💡 Információk (INFO) - Nincs pontlevonás#

1. Túl hosszú címsor:

• Ha egy címsor 70 karakternél hosszabb
• Javaslat: Rövidítsd 20-70 karakter közé

2. Túl rövid címsor:

• Ha egy címsor 10 karakternél rövidebb (de nem üres)
• Javaslat: Legalább 10 karakter kontextus szükséges

Gyakori heading struktúra hibák#

❌ 1. Több H1 használata#

Rossz gyakorlat:

<h1>Termék neve</h1>
<h1>Termék leírása</h1>
<h1>Vélemények</h1>

Jó gyakorlat:

<h1>Termék neve</h1>
<h2>Termék leírása</h2>
<h2>Vélemények</h2>

Miért rossz? Több H1 gyengíti az oldal fő témájának súlyát és zavarja a keresőmotorokat.

❌ 2. Szintugrás a hierarchiában#

Rossz gyakorlat:

<h1>Főcím</h1>
<h2>Alfejezet</h2>
<h4>Részletezés</h4>  ❌ H3 hiányzik!

Jó gyakorlat:

<h1>Főcím</h1>
<h2>Alfejezet</h2>
<h3>Részletezés</h3>  ✅ Logikus sorrend
<h4>További részlet</h4>

Miért rossz? Zavarja a dokumentum logikai struktúráját és az akadálymentességet.

❌ 3. Heading-ek használata formázásra#

Rossz gyakorlat:

<h3 style="font-size: 24px;">Nagy betű kell ide</h3>
<p>Ez itt a normál szöveg</p>

Jó gyakorlat:

<p style="font-size: 24px; font-weight: bold;">Nagy betű kell ide</p>
<p>Ez itt a normál szöveg</p>

Miért rossz? A heading-ek szemantikus jelentéssel bírnak, nem csak vizuális formázásra valók.

❌ 4. H1 hiánya#

Rossz gyakorlat:

<h2>Első szakasz</h2>
<h2>Második szakasz</h2>
<!-- Nincs H1! -->

Jó gyakorlat:

<h1>Az oldal fő témája</h1>
<h2>Első szakasz</h2>
<h2>Második szakasz</h2>

Miért rossz? A H1 az oldal legfontosabb szemantikus eleme, ami meghatározza a fő témát.

Optimalizálási tippek#

✅ 1. Logikus hierarchia#

Gondolj úgy a heading struktúrára mint egy könyv tartalomjegyzékére:

H1 = Könyv címe (1 db)
H2 = Fejezetek (több lehet)
H3 = Alfejezetek (több lehet)
H4 = Alpontok (több lehet)
H5-H6 = További részletezés (ritkán használt)

Példa jó struktúra:

<h1>SEO Útmutató Kezdőknek</h1>

<h2>Mi az a SEO?</h2>
<h3>SEO definíció</h3>
<h3>SEO típusok</h3>
<h4>On-page SEO</h4>
<h4>Off-page SEO</h4>
<h4>Technikai SEO</h4>

<h2>Kulcsszó kutatás</h2>
<h3>Kulcsszó típusok</h3>
<h3>Kulcsszó eszközök</h3>

<h2>Tartalom optimalizálás</h2>
<h3>Cím optimalizálás</h3>
<h3>Meta leírás</h3>

✅ 2. Kulcsszavak a címsorokban#

Használj természetes kulcsszavakat a címsorokban, de ne erőltesd:

Rossz:

<h2>SEO SEO SEO tippek SEO-hoz</h2>  ❌ Keyword stuffing

Jó:

<h2>10 gyakorlati SEO tipp kezdőknek</h2>  ✅ Természetes

✅ 3. Informatív címsorok#

A címsoroknak önmagukban is értelmesnek kell lenniük:

Rossz:

<h2>Bevezetés</h2>
<h2>Részletek</h2>
<h2>Összegzés</h2>

Jó:

<h2>Mi az a keresőoptimalizálás?</h2>
<h2>SEO technikák és stratégiák</h2>
<h2>SEO következő lépések</h2>

✅ 4. Címsor hossz#

• Minimum: 10 karakter (legyen elég kontextus)
• Optimális: 20-70 karakter
• Maximum: 70 karakter (túl hosszú nehezen olvasható)

Példák:

<h2>SEO</h2>  ❌ Túl rövid (3 karakter)

<h2>SEO alapok kezdőknek</h2>  ✅ Optimális (23 karakter)

<h2>Teljes körű SEO útmutató kezdőknek és haladóknak, amely bemutatja az összes technikát részletesen</h2>  ⚠️ Túl hosszú (99 karakter)

Eredmények értelmezése#

Pontszám értékelés#

Címsor hierarchia vizualizáció#

Az eszköz egy fa struktúrában jeleníti meg a címsorokat, ahol:

• H1 = Lila színkód (legfontosabb)
• H2 = Kék színkód (fejezetek)
• H3 = Zöld színkód (alfejezetek)
• H4 = Sárga színkód (alpontok)
• H5-H6 = Szürke színkód (ritka)

A behúzás jelzi a hierarchia mélységét - minél mélyebb egy heading, annál jobban be van húzva.

Példa vizualizáció:

🟣 H1 - Főcím (sor 1)
  🔵 H2 - Első fejezet (sor 5)
    🟢 H3 - Alfejezet 1.1 (sor 8)
    🟢 H3 - Alfejezet 1.2 (sor 12)
  🔵 H2 - Második fejezet (sor 16)
    🟢 H3 - Alfejezet 2.1 (sor 20)
      🟡 H4 - Részlet (sor 24)

Korlátozások#

1. Csak HTML elemzés#

Az eszköz csak HTML kódot elemez, nem tud:

• Élő URL-t crawlolni
• JavaScript által generált címsorokat detektálni
• CSS-sel elrejtett címsorokat azonosítani

Megoldás: Használd a böngésző “View Rendered Source” funkcióját JavaScript alapú oldalaknál.

2. Nem vizsgál SEO kulcsszavakat#

Az eszköz a struktúrát ellenőrzi, nem a tartalmat. Nem vizsgálja:

• Kulcsszavak jelenlétét
• Címsor relevanciáját
• Kulcsszó sűrűséget

Megoldás: Kombináld más SEO eszközökkel a teljes optimalizáláshoz.

3. Nem helyettesíti a manuális ellenőrzést#

Az automatikus eszköz nem tudja értékelni:

• A címsorok értelmességét
• A tartalmi kontextust
• A felhasználói szándékot

Megoldás: Használd kiegészítő eszközként, ne kizárólagos megoldásként.

Gyakran Ismételt Kérdések#

Következő lépések#

Most, hogy megértetted a heading struktúra fontosságát:

• Elemezd saját weboldalad címsor struktúráját
• Javítsd ki az észlelt hibákat és figyelmeztetéseket
• Olvasd el a Heading Struktúra (H1-H6) részletes útmutatót
• Kombinálj más SEO eszközökkel: Title Tag Optimizer
• Ellenőrizd a belső linkek struktúráját

Források#

• Google Search Central: Use heading tags to emphasize important text
• MDN Web Docs: HTML Heading Elements
• W3C: Headings and Labels