Hreflang Tag - Többnyelvű és Többrégiós SEO Útmutató

Mi az a hreflang tag?

A hreflang (HTML language attribute) egy HTML link attribútum, amely megmondja a keresőmotoroknak, hogy egy weboldal mely nyelven és/vagy mely régióban érvényes. Ez lehetővé teszi a Google és más keresőmotorok számára, hogy a megfelelő nyelvű/régiójú verziót jelenítse meg a felhasználóknak a keresési eredményekben.

Egyszerű példa:

<!-- Magyar oldal -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

Ez azt mondja a Google-nek:

Van egy magyar verzió: example.com/hu/
Van egy angol verzió: example.com/en/

Miért fontos?

Duplicate content elkerülése: Többnyelvű oldalak hasonló tartalmat tartalmaznak → Google nem bünteti, ha hreflang van
Jobb felhasználói élmény: Magyar felhasználó magyar oldalt lát, angol felhasználó angol oldalt
Geotargeting: Regionális tartalmak megfelelő országban jelennek meg

Mikor kell hreflang tag-et használni?

✅ Használd hreflang-et, ha:

1. Több nyelven van meg a weboldal

Példa:

https://example.com/hu/    (magyar)
https://example.com/en/    (angol)
https://example.com/de/    (német)

2. Egy nyelv, több régió

Példa - Angol nyelv különböző régiókban:

https://example.com/en-us/  (amerikai angol)
https://example.com/en-gb/  (brit angol)
https://example.com/en-au/  (ausztrál angol)

Különbségek:

Helyesírás (color vs colour)
Deviza (USD vs GBP vs AUD)
Helyi tartalom (termékek elérhetősége)

3. Részben fordított tartalom

Példa - E-commerce:

Template ugyanaz minden nyelven
Navigáció, gombok lefordítva
Termékleírás csak angol

Akkor is kell hreflang, mert a Google látja a hasonlóságot.

4. Ugyanaz a nyelv, különböző tartalom régióként

Példa - Spanyol:

https://example.com/es-es/  (spanyolországi spanyol)
https://example.com/es-mx/  (mexikói spanyol)

❌ NEM kell hreflang, ha:

Csak 1 nyelv van (pl. csak magyar)
Nincs regionális különbség
Külön domain-ek vannak országonként ÉS nincs átfedés

Hreflang szintaxis és kódok

Alap szintaxis

<link rel="alternate" hreflang="[nyelv-kód]" href="[URL]" />

Elemek:

rel="alternate" → Alternatív verzió
hreflang="[kód]" → Nyelvi/regionális kód
href="[URL]" → Teljes URL (abszolút, nem relatív!)

Nyelvi kódok (ISO 639-1)

Leggyakoribb nyelvek:

Nyelv	Kód
Magyar	`hu`
Angol	`en`
Német	`de`
Francia	`fr`
Spanyol	`es`
Olasz	`it`
Portugál	`pt`
Lengyel	`pl`
Cseh	`cs`
Szlovák	`sk`

Teljes lista: https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes

Regionális kódok (ISO 3166-1 Alpha-2)

Nyelv + Régió formátum: [nyelv]-[ORSZÁG]

Példák:

Nyelv + Régió	Kód	Jelentés
Amerikai angol	`en-US`	Amerikai Egyesült Államok
Brit angol	`en-GB`	Nagy-Britannia
Ausztrál angol	`en-AU`	Ausztrália
Kanadai angol	`en-CA`	Kanada
Spanyol (Spanyolország)	`es-ES`	Spanyolország
Spanyol (Mexikó)	`es-MX`	Mexikó
Spanyol (Argentína)	`es-AR`	Argentína
Portugál (Brazília)	`pt-BR`	Brazília
Portugál (Portugália)	`pt-PT`	Portugália
Német (Németország)	`de-DE`	Németország
Német (Ausztria)	`de-AT`	Ausztria
Német (Svájc)	`de-CH`	Svájc
Francia (Franciaország)	`fr-FR`	Franciaország
Francia (Kanada)	`fr-CA`	Kanada
Kínai (egyszerűsített)	`zh-CN`	Kína
Kínai (hagyományos)	`zh-TW`	Tajvan

Teljes lista: https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2

⚠️ FONTOS:

Kisbetűs nyelv + NAGYBETŰS ország: en-US ✅
Hibás: EN-us, en-us, EN-US ❌

X-default speciális érték

Mi az x-default?

Egy fallback (alapértelmezett) oldal olyan felhasználóknak, akiknek nincs specifikus nyelvű verzió.

Példa:

<!-- Alapértelmezett (angol vagy nyelvválasztó) -->
<link rel="alternate" hreflang="x-default" href="https://example.com/" />

<!-- Specifikus nyelvek -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

Mikor használd x-default-ot?

Esetben 1 - Nyelvválasztó oldal:

https://example.com/         (nyelvválasztó)
https://example.com/hu/      (magyar)
https://example.com/en/      (angol)
https://example.com/de/      (német)

x-default → https://example.com/ (nyelvválasztó)

Esetben 2 - Fő piaci nyelv:

https://example.com/en/      (angol - fő piac)
https://example.com/de/      (német)
https://example.com/fr/      (francia)

x-default → https://example.com/en/ (angol mint alapértelmezett)

Esetben 3 - Globális angol:

https://example.com/en-us/   (amerikai angol)
https://example.com/en-gb/   (brit angol)
https://example.com/en/      (általános angol)

x-default → https://example.com/en/ (általános angol bármelyik más országhoz)

Hreflang implementációs módszerek

1. módszer: HTML link tag (AJÁNLOTT)

Hol: <head> részben minden oldalon

Példa - Magyar és angol oldal:

Magyar oldal (example.com/hu/):

<!DOCTYPE html>
<html lang="hu">
<head>
  <meta charset="UTF-8">
  <title>Főoldal - Magyar</title>
  
  <!-- Hreflang tag-ek -->
  <link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
  <link rel="alternate" hreflang="en" href="https://example.com/en/" />
  <link rel="alternate" hreflang="x-default" href="https://example.com/en/" />
  
  <!-- Canonical -->
  <link rel="canonical" href="https://example.com/hu/" />
</head>
<body>
  <!-- Tartalom -->
</body>
</html>

Angol oldal (example.com/en/):

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Home - English</title>
  
  <!-- Hreflang tag-ek (UGYANAZOK!) -->
  <link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
  <link rel="alternate" hreflang="en" href="https://example.com/en/" />
  <link rel="alternate" hreflang="x-default" href="https://example.com/en/" />
  
  <!-- Canonical -->
  <link rel="canonical" href="https://example.com/en/" />
</head>
<body>
  <!-- Content -->
</body>
</html>

Kritikus szabály:

Minden oldal tartalmazza az ÖSSZES nyelvi verziót (beleértve saját magát is).

✅ Előnyök:

Egyszerű implementáció
Könnyen debug-olható (View Source)
CMS-ek támogatják (WordPress, Shopify, stb.)

❌ Hátrányok:

Sok nyelv esetén sok link tag (de nem probléma)
Minden oldalon frissíteni kell új nyelv hozzáadásakor

2. módszer: HTTP Header

Mikor használd: Nem-HTML fájlok (PDF, Excel, stb.)

Példa - PDF fájl:

HTTP/1.1 200 OK
Content-Type: application/pdf
Link: <https://example.com/en/document.pdf>; rel="alternate"; hreflang="en"
Link: <https://example.com/hu/dokumentum.pdf>; rel="alternate"; hreflang="hu"
Link: <https://example.com/en/document.pdf>; rel="alternate"; hreflang="x-default"

Apache .htaccess példa:

<Files "document.pdf">
    Header add Link "<https://example.com/en/document.pdf>; rel=\"alternate\"; hreflang=\"en\""
    Header add Link "<https://example.com/hu/dokumentum.pdf>; rel=\"alternate\"; hreflang=\"hu\""
</Files>

✅ Előnyök:

Működik nem-HTML tartalommal

❌ Hátrányok:

Bonyolultabb implementáció
Nehezebb debug-olni

3. módszer: XML Sitemap

Mikor használd: Nagy nemzetközi oldalak sok nyelvvel (enterprise szint)

Példa - sitemap.xml:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:xhtml="http://www.w3.org/1999/xhtml">
  
  <!-- Magyar oldal -->
  <url>
    <loc>https://example.com/hu/</loc>
    <xhtml:link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/" />
    <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/en/" />
  </url>
  
  <!-- Angol oldal -->
  <url>
    <loc>https://example.com/en/</loc>
    <xhtml:link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
    <xhtml:link rel="alternate" hreflang="en" href="https://example.com/en/" />
    <xhtml:link rel="alternate" hreflang="x-default" href="https://example.com/en/" />
  </url>
  
</urlset>

✅ Előnyök:

Központosított kezelés
Könnyebb sok nyelv/oldal kezelése

❌ Hátrányok:

Bonyolultabb implementáció
Google Search Console validálás szükséges

⚠️ FONTOS: Ha sitemap-et használsz, akkor NE tedd hreflang-et a HTML-be is (duplikáció)!

Melyik módszert válaszd?

Helyzet	Ajánlott módszer
2-10 nyelv, HTML oldalak	HTML link tag
PDF/nem-HTML fájlok	HTTP Header
10+ nyelv, nagy oldal	XML Sitemap
WordPress / CMS	HTML link tag (plugin-ok)

Hreflang szabályok és best practices

1. Kétirányú hivatkozás (Return Link)

Hreflang return link szabály: minden oldal hivatkozzon mindegyik nyelvi verzióra

Minden hreflang kapcsolat kétirányú legyen.

Példa:

Magyar oldal hivatkozik angol oldalra:

<!-- /hu/ oldalon -->
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

Angol oldalnak VISSZA KELL hivatkoznia magyar oldalra:

<!-- /en/ oldalon -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />

❌ Gyakori hiba (hiányzó return link):

<!-- /hu/ oldalon -->
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

<!-- /en/ oldalon -->
<!-- NINCS hivatkozás /hu/ felé! ❌ -->

Google figyelmen kívül hagyja a hreflang-et, ha nincs return link!

2. Önhivatkozás (Self-referential)

Minden oldal hivatkozzon saját magára is.

Példa:

<!-- /hu/ oldalon -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />  ← Saját maga
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

3. Abszolút URL-ek

Mindig teljes URL-t használj (nem relatív).

❌ Rossz:

<link rel="alternate" hreflang="en" href="/en/" />

✅ Jó:

<link rel="alternate" hreflang="en" href="https://example.com/en/" />

4. Canonical és hreflang összhangja

Canonical URL-nek egyeznie kell a hreflang önhivatkozással.

Példa - Magyar oldal:

<!-- Canonical -->
<link rel="canonical" href="https://example.com/hu/" />

<!-- Hreflang önhivatkozás (UGYANAZ AZ URL!) -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />

❌ Gyakori hiba:

<!-- Canonical -->
<link rel="canonical" href="https://example.com/en/" />

<!-- Hreflang önhivatkozás -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />

Ez azt mondja: “Ez a magyar oldal, de az angol a fő verzió” → zavaró!

Szabály: Canonical = hreflang önhivatkozás minden nyelvi verzión.

5. Minden nyelvi verzió tartalmazza az összeset

Példa - 3 nyelvű oldal:

Magyar oldal (/hu/):

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />

Angol oldal (/en/):

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />

Német oldal (/de/):

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />

Minden oldal ugyanazokat a hreflang tag-eket tartalmazza!

6. X-default használata (opcionális, de ajánlott)

Példa:

<!-- X-default (angol alapértelmezett) -->
<link rel="alternate" hreflang="x-default" href="https://example.com/en/" />

<!-- Specifikus nyelvek -->
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />

7. Azonos tartalom nyelvek között

Hreflang csak akkor működik, ha a tartalom AZONOS jelentésű különböző nyelveken.

✅ Helyes:

/hu/rolunk/     → "Rólunk" magyarul
/en/about/      → "About Us" angolul
(Ugyanaz a tartalom, lefordítva)

❌ Rossz:

/hu/blog/termek-a/     → Termék A magyar blog
/en/blog/product-b/    → Termék B angol blog
(Különböző tartalom, NEM fordítás)

Ha a tartalom nem azonos → NE használj hreflang-et!

Hreflang példák különböző konfigurációkhoz

Példa 1: Aldomainek (Subdomain)

URL struktúra:

https://hu.example.com/    (magyar)
https://en.example.com/    (angol)
https://de.example.com/    (német)

Hreflang (minden oldal head-jében):

<link rel="alternate" hreflang="hu" href="https://hu.example.com/" />
<link rel="alternate" hreflang="en" href="https://en.example.com/" />
<link rel="alternate" hreflang="de" href="https://de.example.com/" />
<link rel="alternate" hreflang="x-default" href="https://en.example.com/" />

Példa 2: Almappák (Subdirectory)

URL struktúra:

https://example.com/hu/    (magyar)
https://example.com/en/    (angol)
https://example.com/de/    (német)

Hreflang:

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en/" />

Példa 3: Külön domain-ek (ccTLD)

URL struktúra:

https://example.hu/       (magyar)
https://example.com/      (angol)
https://example.de/       (német)

Hreflang:

<link rel="alternate" hreflang="hu" href="https://example.hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/" />
<link rel="alternate" hreflang="de" href="https://example.de/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/" />

Példa 4: Regionális angol verziók

URL struktúra:

https://example.com/en-us/    (amerikai angol)
https://example.com/en-gb/    (brit angol)
https://example.com/en-au/    (ausztrál angol)
https://example.com/en-ca/    (kanadai angol)

Hreflang:

<link rel="alternate" hreflang="en-US" href="https://example.com/en-us/" />
<link rel="alternate" hreflang="en-GB" href="https://example.com/en-gb/" />
<link rel="alternate" hreflang="en-AU" href="https://example.com/en-au/" />
<link rel="alternate" hreflang="en-CA" href="https://example.com/en-ca/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en-us/" />

Példa 5: Vegyes (nyelv + régió)

URL struktúra:

https://example.com/hu/       (magyar)
https://example.com/en-us/    (amerikai angol)
https://example.com/en-gb/    (brit angol)
https://example.com/de-de/    (német Németország)
https://example.com/de-at/    (német Ausztria)

Hreflang:

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en-US" href="https://example.com/en-us/" />
<link rel="alternate" hreflang="en-GB" href="https://example.com/en-gb/" />
<link rel="alternate" hreflang="de-DE" href="https://example.com/de-de/" />
<link rel="alternate" hreflang="de-AT" href="https://example.com/de-at/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en-us/" />

Hreflang ellenőrzés és hibakeresés

1. Google Search Console

Lépések:

Google Search Console → Válaszd ki a property-t
International Targeting (régi verzió) VAGY
Coverage Report → Nézd a hreflang hibákat

Gyakori hibák a GSC-ben:

“No return tag” - Hiányzó visszamutató hivatkozás
“Incorrect hreflang” - Rossz nyelvi kód
“Missing self-referential” - Nincs önhivatkozás

2. Hreflang Tag Testing Tool

Online eszközök:

A) Ahrefs Hreflang Tag Checker:

https://ahrefs.com/hreflang-tags-generator

Beírod az URL-t
Megmutatja az összes hreflang tag-et
Azonosítja a hibákat

B) Merkle Hreflang Tag Testing Tool:

https://technicalseo.com/tools/hreflang/

Részletes elemzés
Grafikus megjelenítés
Hibák magyarázata

3. Screaming Frog SEO Spider

Lépések:

Crawlolás indítása
Hreflang tab
Nézd meg az összes hreflang connection-t
Validation fül → hibák listája

Mit keres:

Hiányzó return link-ek
Önhivatkozás hiánya
Rossz nyelvi kódok
Broken hreflang URL-ek (404)

4. Manuális View Source ellenőrzés

Lépések:

Nyisd meg az oldalt böngészőben
Jobb klikk → View Page Source (Ctrl+U)
Keress: hreflang (Ctrl+F)
Ellenőrizd:
- Van-e hreflang tag?
- Minden nyelv szerepel?
- Abszolút URL-ek?
- Önhivatkozás megvan?

Gyakori hreflang hibák

❌ 1. Hiányzó return link

Hiba:

Magyar oldal:

<link rel="alternate" hreflang="en" href="https://example.com/en/" />

Angol oldal:

<!-- NINCS hreflang tag! -->

Megoldás:

Angol oldalon is adj hozzá:

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

❌ 2. Rossz nyelvi kód

Hiba:

<link rel="alternate" hreflang="hun" href="https://example.com/hu/" />
<link rel="alternate" hreflang="eng" href="https://example.com/en/" />

(hun, eng nem ISO 639-1 kód!)

Megoldás:

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

❌ 3. Rossz ország kód formátum

Hiba:

<link rel="alternate" hreflang="en-us" href="https://example.com/en-us/" />
<link rel="alternate" hreflang="EN-GB" href="https://example.com/en-gb/" />

Megoldás:

<link rel="alternate" hreflang="en-US" href="https://example.com/en-us/" />
<link rel="alternate" hreflang="en-GB" href="https://example.com/en-gb/" />

(Kisbetűs nyelv + NAGYBETŰS ország!)

❌ 4. Relatív URL használata

Hiba:

<link rel="alternate" hreflang="en" href="/en/" />

Megoldás:

<link rel="alternate" hreflang="en" href="https://example.com/en/" />

❌ 5. Canonical és hreflang ütközés

Hiba:

Magyar oldal:

<link rel="canonical" href="https://example.com/en/" />
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />

(Canonical angol, de hreflang azt mondja ez magyar)

Megoldás:

<link rel="canonical" href="https://example.com/hu/" />
<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />

❌ 6. Önhivatkozás hiánya

Hiba:

Magyar oldal:

<!-- Csak angol verzióra mutat, saját magára nem -->
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

Megoldás:

<link rel="alternate" hreflang="hu" href="https://example.com/hu/" />
<link rel="alternate" hreflang="en" href="https://example.com/en/" />

❌ 7. Broken hreflang URL (404)

Hiba:

<link rel="alternate" hreflang="en" href="https://example.com/en/" />

De https://example.com/en/ → 404 Not Found

Megoldás:

Biztosítsd, hogy minden hreflang URL elérhető (200 OK).

Gyakran Ismételt Kérdések

Mi az a hreflang tag?

A hreflang tag egy HTML attribútum, amely megmondja a Google-nek és más keresőmotoroknak, hogy egy oldal mely nyelven/régióban érvényes. Használata többnyelvű vagy többrégiós weboldalaknál kötelező a duplicate content elkerülésére és a megfelelő nyelvű verzió megjelenítésére a keresési eredményekben.

Mikor kell hreflang tag-et használni?

Hreflang tag-et akkor kell használni, ha (1) Több nyelven van meg az oldal (pl. angol és magyar), (2) Egy nyelv több régióban van (pl. angol UK vs US vs AU), (3) Részben fordított tartalom van (pl. template ugyanaz, de tartalom más nyelven), vagy (4) Ugyanaz a nyelv, de különböző régiók (pl. spanyol ES vs MX).

Mi a különbség a nyelvi és regionális hreflang között?

Nyelvi hreflang csak a nyelvet jelöli (pl. en = angol), míg regionális hreflang nyelv + országot is tartalmaz (pl. en-US = amerikai angol, en-GB = brit angol). Ha regionális különbségek vannak (pl. currency, spelling, local content), használj regionális hreflang-et.

Hogyan implementálható a hreflang tag?

A hreflang tag háromféleképpen implementálható: (1) HTML link tag-ként a head részben, (2) HTTP header-ben (PDF, nem-HTML fájlokhoz), vagy (3) XML sitemap-ben. A leggyakoribb és ajánlott módszer a HTML link tag használata.

Mi az x-default hreflang értéke?

Az x-default egy speciális hreflang érték, amely az alapértelmezett/fallback oldalt jelöli olyan felhasználóknak, akiknek a nyelvére/régiójára nincs specifikus verzió. Általában az angol verzió vagy egy nyelvválasztó oldal. Használata opcionális, de ajánlott nemzetközi oldalaknál.

Mi a leggyakoribb hreflang hiba?

A leggyakoribb hiba a hiányzó visszamutató hivatkozás (missing return link). Minden hreflang kapcsolatnak kétirányúnak kell lennie - ha az angol oldal mutat a magyar verzióra, a magyar verziónak vissza kell mutatnia az angol verzióra. További gyakori hibák: rossz nyelvi kód, önhivatkozás hiánya, és eltérő URL-ek canonical tag-ben.

Következő lépések

Most, hogy megértetted a hreflang tag használatát:

Határozd meg a nyelvi/regionális verziókat
Válaszd ki az implementációs módszert (HTML tag ajánlott)
Implementáld a hreflang tag-eket minden oldalon
Ellenőrizd a Google Search Console-ban
Teszteld Ahrefs vagy Merkle tool-lal
Olvasd el a Canonical URL kezelés útmutatót
Nézd meg az XML Sitemap cikket

Hreflang Tag (Többnyelvű SEO)