Hreflang implementera med rätt språkkoder

Lär dig implementera hreflang rätt med språkkoder och return-taggar – så visar Google rätt språkversion till rätt besökare. Kom igång i dag.

Du har byggt en engelsk version av sajten, men fel besökare hamnar på fel sida: svenska kunder ser den engelska texten och tvärtom. Det problemet löser hreflang. Att implementera hreflang rätt är inte svårt att förstå, men lätt att slarva med, och en enda glömd detalj räcker för att Google ska ignorera hela uppsättningen.

Av redaktionen på seoninja.se

En felaktig språkkod eller en saknad return-tagg kan sänka hela den internationella satsningen. Här gås hela kedjan igenom, från hur taggen ser ut till hur den testas med rätt SEO-verktyg och övervakas efter lansering.

Vad hreflang gör

Hreflang är ett attribut som läggs på en sida för att ange att det finns andra språkversioner eller landversioner av samma innehåll. Google läser taggen och matchar rätt version mot rätt användare i sökresultatet. Det är alltså ingen rankingfaktor, utan ett sätt att styra vilken av dina versioner sökmotorn visar.

Varför det spelar roll för din internationella sajt

Med innehåll på flera språk konkurrerar de egna sidorna annars med varandra i sökresultatet. En svensk och en engelsk version ser för Google nästan likadana ut. Utan hreflang riskerar fel version att visas, och besökaren studsar direkt. Rätt matchning brukar ge lägre studsfrekvens och fler konverteringar från rätt marknad.

När hreflang behövs

Hreflang behövs när samma eller liknande innehåll finns på flera språk eller riktar sig till flera länder. Det passar när sajten har:

• Samma sida på svenska och engelska.
• Olika versioner för länder som talar samma språk, som en-gb och en-us.
• En internationell butik med regionala priser och leverans.

Finns hela sajten bara på ett språk för en marknad behövs det inte.

Så ser en hreflang-tagg ut

I sin enklaste form är hreflang en link-tagg i sidans head, ungefär som annan strukturerad data i sidhuvudet. Så anges att en sida har en svensk och en engelsk språkversion:

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

Varje version listar samtliga versioner, inklusive sig själv. Det är kärnan: uppsättningen ska vara identisk på alla sidor som ingår.

Delarna i link rel alternate

Raden link rel alternate består av tre delar som alla måste stämma:

• rel="alternate" säger att det är en alternativ version.
• hreflang="sv-se" anger språk och eventuellt land.
• href pekar på en absolut URL, aldrig en relativ sökväg.

Med relativa URL:er slutar taggen att fungera, så hela adressen - inklusive protokollet https - ska alltid skrivas ut.

Rätt språkkoder

Språkkoden är den vanligaste källan till fel. Formatet är språk först, land sedan, och landet är valfritt. En påhittad kod ignoreras av Google utan någon varning och syns inte i sökresultatet.

Exempel på språkkoder

• sv eller sv-se för svenska och Sverige.
• en-gb för United Kingdom, en-us för USA.
• de-de för tyska i Germany.
• nl-be för Nederlands i Belgium.

Koden för Storbritannien är gb, inte uk. Just den fällan är extremt vanlig och sprids ofta som en seglivad missuppfattning. Anges bara språk, till exempel sv, gäller det alla som söker på svenska oavsett var de befinner sig.

x-default för besökare som inte matchar

x-default är en särskild hreflang-kod för den sida som ska visas när ingen annan version passar. En besökare i ett land utan egen version hamnar då på din valda standardsida.

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

Koden är inte obligatorisk, men i regel en bra idé på en internationell sajt.

Return-taggar: hreflang måste vara ömsesidigt

Detta är den enskilt vanligaste orsaken till att hreflang inte fungerar. Om sida A pekar på sida B måste sida B peka tillbaka på A. Google kallar det return-taggar, och saknas de kastas hela relationen bort när Googlebot crawlar sidorna. En sajt med tre språkversioner behöver alltså att varje sida listar alla tre, vilket snabbt blir svårt att överblicka utan rätt verktyg.

Tre sätt att implementera hreflang

Det finns tre metoder, och de utesluter varandra: samma relation ska inte blandas i flera samtidigt.

1. HTML link-taggar i sidans head, enklast för de flesta.
2. XML-sitemap, bäst när det finns många sidor att crawla effektivt.
3. HTTP-header, för filer utan head.

hreflang i HTTP-header

För innehåll utan head anges hreflang i serverns svarshuvud som en Link-header. Principen är densamma som i HTML: samma uppsättning, ömsesidiga return-taggar och absoluta URL:er som svarar rätt.

När det passar för PDF-filer

Har du produktblad eller manualer som PDF-filer på flera språk är HTTP-header enda vägen, eftersom en PDF inte har någon HTML-head att lägga taggarna i.

Steg för steg: implementera hreflang i HTML

Hreflang och canonical

Hreflang och canonical måste vara överens, annars motverkar de varandra i sökresultatet. Den vanligaste fällan är att en språkversion har en canonical som pekar på en annan version - samma sorts konflikt som uppstår vid felaktiga omdirigeringar. På varje version ska canonical i stället vara självrefererande. Canonicaliseras den engelska sidan mot den svenska säger du åt Google att den engelska inte ska indexeras, och då spelar hreflang ingen roll.

Exempel: svensk och engelsk språkversion

Säg att en tjänst drivs från Stockholm med en sida på svenska och en på engelska. Den svenska sidan ska innehålla:

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

Så matchar du versionerna

Exakt samma två rader ska finnas på den engelska sidan. Ingen version får utelämna den andra, och ingen får utelämna sig själv. Så vet Google att den svenska visas för svenska sökningar och den engelska för brittiska.

Exempel: samma språk, flera länder

Med engelskt innehåll för flera marknader anges land per version:

• en-gb för United Kingdom.
• en-us för USA.
• en-ca för Canada.

Samma logik gäller för andra språk i flera länder: språket först, landet sedan.

Hreflang på Shopify

På Shopify hanteras hreflang oftast automatiskt via plattformens internationella funktioner när marknader och språk är uppsatta. Kontrollera ändå i källkoden att taggarna faktiskt renderas och att return-taggarna stämmer, för automatik är ingen garanti.

Hreflang i WordPress med WPML och Weglot

I WordPress sköts hreflang i regel av ett plugin. WPML lägger till taggarna baserat på översatta sidor, och Weglot gör det när språkversionerna är kopplade. Weglot över flera språk blir smidigt, men resultatet bör alltid verifieras i stället för att lita blint på plugin.

Testa taggarna lokalt

Innan publicering öppnas källkoden på ett par sidor för en manuell kontroll:

• Att alla versioner listas, inklusive sidan själv.
• Att språkkoderna är korrekta.
• Att URL:erna är absoluta och svarar med status 200.
• Att return-taggen finns på motsvarande version.

En snabb manuell koll fångar de flesta grova fel.

Validera med Screaming Frog

För mer än en handfull sidor krävs ett verktyg. Screaming Frog SEO Spider har en särskild hreflang-rapport som listar saknade return-taggar, felaktiga språkkoder och URL:er som inte matchar. Så görs crawlen:

• Aktivera hreflang i konfigurationen innan crawlen.
• Crawla sajten och öppna hreflang-fliken.
• Filtrera på fel som “Missing Return Links”.
• Åtgärda och crawla om för att bekräfta.

Monitoring efter lansering

Hreflang går sönder tyst. En migrering, en ändrad URL eller en borttagen sida kan bryta return-taggar utan att något syns på ytan. Därför hör monitoring till implementeringen, inte bara lanseringen. Search Console visar internationell targeting och fel över tid, och en schemalagd crawl i Screaming Frog fångar brutna relationer.

Vanliga misstag

De fel som återkommer om och om igen, ofta värda en plats i din löpande felsökning:

• Glömda return-taggar mellan versionerna.
• Relativa URL:er istället för absoluta.
• Fel språkkod, som uk istället för gb.
• Canonical som pekar på fel version.
• Blandade metoder för samma relation.

Gör så här, undvik det här

Hreflang belönar symmetri. Är relationen inte ömsesidig på varje sida finns den, för Google, inte alls.

Snabb checklista innan publicering

Nästa steg

Börja litet: kartlägg språkversionerna, sätt rätt språkkoder och lägg en komplett, ömsesidig uppsättning på varje sida. Validera i Screaming Frog, koppla på monitoring och utöka därifrån. När grunden sitter går det att lägga till fler länder utan att tappa kontrollen. Kör det fast är du välkommen att höra av dig.