16 oktober 2020

Hoe gebruik ik het hreflang attribuut?

6 minuten lezen
Vertalingen en meertaligheid

Met het hreflang attribuut, ook wel de hreflang tag genoemd, is het mogelijk om aan zoekmachines te vertellen in welke taal een bepaalde pagina is geschreven en voor welke regio de pagina is bedoeld. Op deze manier kunnen zoekmachines de juiste versie van een pagina aan bezoekers laten zien en wordt voorkomen dat er sprake is van verwarring door dubbele content.
SDIM legt uit hoe je het hreflang attribuut gebruikt!

Het hreflang attribuut, voluit het rel=”alternate” hreflang=”x” link attribuut, is door Google geïntroduceerd in 2011 en maakt het mogelijk om aan de zoekmachine kenbaar te maken in welke taal en voor welke regio een specifieke pagina is geschreven. Wanneer het gaat over hreflang wordt er vaak gesproken over de hreflang tag. Dit is echter eigenlijk een onjuiste benaming.

Om duidelijk te maken welke verschillende versies er van een bepaalde pagina zijn, geeft u met het hreflang attribuut de relatie tussen de verschillende versies aan. Dit kan binnen hetzelfde domein zijn, maar ook voor verschillende domeinen (bijvoorbeeld “example.nl” en “example.be”).

Op deze manier is het voor een zoekmachine duidelijk dat een gebruiker die in het Nederlands zoekt, de Nederlandse versie van de pagina wil bekijken en niet de (bijna) identieke pagina in het Engels.

Daarnaast is het mogelijk om door middel van het hreflang attribuut aan te geven dat er in een bepaalde taal verschillende pagina’s zijn gericht op een specifieke regio. Zo kan er een pagina gericht zijn op Nederland en een andere pagina worden geschreven voor bezoekers uit België.

Wanneer een Nederlandstalige Belg een zoekopdracht in het Nederlands doet, laat de zoekmachine de Nederlandstalige pagina gericht op België zien en niet degene die is gericht op Nederland.

Belangrijk om te vermelden is dat alleen Google en Yandex het hreflang attribuut ondersteunen. De zoekmachine Bing gebruikt language meta tags. Dit is een andere manier om meertaligheid duidelijk te maken. Een language meta tag ziet er bijvoorbeeld zo uit:
<meta http-equiv=”content-language” content=”nl-be”>

Het hreflang attribuut gebruikt u om uw bezoekers de beste ervaring op uw website te geven. Zo kunt u ervoor zorgen dat een bezoeker altijd op de pagina in de juiste taal terecht komt en dat de pagina ook gericht is op de regio waarin de bezoeker zich bevindt. Zo kunt u in dezelfde taal variaties maken voor regionale verschillen in valuta’s, leveringsvoorwaarden, seizoensgebondenheid, taalgebruik en cultuur. 

Naast het tonen van de juiste pagina aan uw bezoekers, helpt het hreflang attribuut ook bij het voorkomen van problemen rondom duplicate content (al hoef je niet bang te zijn voor een duplicate content penalty). Dit is vooral het geval bij pagina’s die in dezelfde taal geschreven zijn, maar zich richten op verschillende geografische regio’s. De zoekmachine snapt door het hreflang attribuut dat pagina’s die veel op elkaar lijken gericht zijn op verschillende regio’s en ziet het daardoor niet als duplicate content. 

Nu duidelijk is wat het hreflang attribuut precies is en waarom het belangrijk is om het te gebruiken, gaan we nu kijken hoe het hreflang attribuut er eigenlijk uit ziet.

Stel een bedrijf uit het Verenigd Koninkrijk heeft een website die zich richt op vier landen: het Verenigd Koninkrijk, Nederland, België en Duitsland.  Om ervoor te zorgen dat de bezoekers uit de verschillende landen terechtkomen op de juiste versie van een bepaalde pagina maakt de website gebruik van het hreflang attribuut. Zo zijn er binnen de website vier verschillende versies van iedere pagina:

  • Engelstalige pagina’s gericht op het Verenigd Koninkrijk
  • Nederlandstalige pagina’s gericht op Nederland
  • Nederlandstalige pagina’s gericht op België
  • Duitstalige pagina’s gericht op Duitsland

In de broncode van de homepagina is het volgende te zien:

<link rel=”alternate” hreflang=”en-gb” href=”http://www.example.com/” />

<link rel=”alternate” hreflang=”nl-nl” href=”http://www.example.com/nl/” />

<link rel=”alternate” hreflang=”nl-be” href=”http://www.example.com/be/” />

<link rel=”alternate” hreflang=”de-de” href=”http://www.example.com/de/” />

Het eerste gedeelte van het hreflang attribuut, <link rel=”alternate” , laat weten dat het hier gaat om een relatie tussen verschillende pagina’s. Naast het hreflang attribuut zijn er meerdere relaties tussen verschillende pagina’s. Denk bijvoorbeeld aan paginering, AMP en canonicals.

Daarna zien we: hreflang=”nl-nl”, wat duidelijk maakt dat deze pagina gericht is op Nederlandstalige bezoekers in Nederland. De taal wordt als eerst genoemd en de regio, oftewel het land, daarna.

Tot slot zien we href=”http://www.example.com/” staan in het hreflang attribuut. Dit geeft aan via welke URL de content die gericht is op de bezoeker zoals hiervoor beschreven te vinden is.

Wanneer u een internationale website heeft is het goed mogelijk dat deze wordt bezocht door gebruikers uit een regio en met een taal waar u geen specifieke pagina’s voor heeft gecreëerd. Om deze bezoekers naar de juiste pagina te leiden maakt u gebruik van een hreflang=”x-default”. Hiermee geeft u aan welke versie bezoekers te zien krijgen die niet binnen de doelgroep van de andere pagina’s vallen. Het is aan te raden om hiervoor een Engelstalige versie te gebruiken.

Een voorbeeld van het hreflang=”x-default”:

<link rel=”alternate” hreflang=”x-default” href=”http://www.example.com/” />

Het hreflang attribuut kan het gemakkelijkst worden geïmplementeerd in de <head> sectie van de pagina. Het is daarnaast ook mogelijk hreflang te implementeren in de HTTP header en XML sitemap. Dit is echter meestal minder eenvoudig.

Belangrijk bij het implementeren van het hreflang attribuut is dat op iedere variant van een pagina, alle varianten definieert. Iedere versie verwijst dus naar alle andere versies en naar zichzelf. Wanneer er dus vier versies van iedere pagina zijn, dan krijgen al die pagina’s dus vier regels hreflang code.

Het is mogelijk om één pagina te gebruiken voor meerdere talen of regio’s.

Zo is het bijvoorbeeld mogelijk om een Engelse pagina te gebruiken voor zowel bezoekers uit de Verenigde Staten als Australië. 

<link rel=”alternate” hreflang=”en-us” href=”http://www.example.com/” />

<link rel=”alternate” hreflang=”en-au” href=”http://www.example.com/” />

Wanneer u alle gebruikers die Engelstalig zijn wil voorzien van één pagina, ongeacht de regio, kunt u de regio ook weglaten. Alleen gebruik maken van een regio zonder vermelding van de taal is echter niet mogelijk.

<link rel=”alternate” hreflang=”en” href=”http://www.example.com/” />

Een veelvoorkomende fout bij het implementeren van het hreflang attribuut, is het onjuist gebruiken van taal en regiocodes. De correcte definitie voor taal is het ISO 639-1 formaat en voor de regio maakt het hreflang attribuut gebruik van ISO 3166-1 alpha-2. De taalcode is verplicht en de regiocode is optioneel. Belangrijk is om de taal altijd als eerst te vermelden. Wanneer de regio eerst wordt gedefinieerd zal dit door de zoekmachine niet worden begrepen en werkt het hreflang attribuut niet.

Om te testen of u het hreflang attribuut op de juiste manier heeft geïmplementeerd, kunt u verschillende tools gebruiken.

  • Web crawlers/scrapers
  • Google Search Console
  • Hreflang testing tools op internet

Hulp nodig met hreflang?

Contact

Reacties (0)

Geef een reactie

Je e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *