Développez votre site à l’international avec hreflang

Lorsque vous avez un site international multilingue, l’attribut hreflang permet à Google de savoir quelle version linguistique et éventuellement quelle version régionale, il doit afficher selon la langue parlée par l’utilisateur et sa géo-localisation.

Menu

Fonctionnement de l’attribut hreflang
hreflang pour indiquer une version linguistique d’une page dans une autre langue
hreflang et son attribut régional
Les nomenclatures des codes pays pour les hreflang
Où mettre le code hreflang ?
hreflang et x-default
Mise en place des balises à attribut hreflang avec le principe de réciprocité
hreflang pour éviter les pages doublons

Fonctionnement de l’attribut hreflang

L’attribut hreflang donne un signal aux users agents (Googlebot par exemple), de sorte que lorsqu’un internaute fait une recherche dans un pays parlant la langue ‘’x’’, ce dernier voudra la version linguistique de la page demandée dans cette langue “x“, au lieu d’une page avec le contenu original écrit dans une langue “y“.

hreflang pour indiquer une version linguistique d’une page dans une autre langue

Par exemple si vous créez une version anglaise de votre page d’accueil écrite en français, vous devez utiliser la balise ‘’anglais’’ de la façon suivante : hreflang = ’’en’’. Ainsi, lorsqu’un visiteur ayant une adresse IP située dans un pays majoritairement anglophone, visite votre site, le moteur de recherche lui servira la page d’accueil en anglais plutôt qu’en français

hreflang et son attribut régional

Hreflang permet aussi de choisir parmi les différentes variantes d’une même langue. Si vous le souhaitez, vous pouvez améliorer le ciblage de vos pages en rajoutant des arguments à l’attribut hreflang. Ces arguments permettent de spécifier pour quelle région est destinée votre contenu.

Si on reprend l’exemple précédent, la page d’accueil française pourrait aussi s’adresser à une audience belge, dans ce cas on aurait : hreflang = ‘’fr-FR’’ pour la 1ère balise et hreflang = ‘’fr-BE’’ pour la 2ème. C’est une astuce très utile pour mieux cibler géographiquement les visiteurs, s’adapter aux différentes monnaies, s’adresser à différentes cultures …

Les nomenclatures des codes pays pour les hreflang

• en-CA anglais pour le Canada
• fr-FR français en France
• en-US anglais pour les États-Unis
• fr-CA français pour le Canada
• fr-BE français en Belgique
• fr-CH français en Suisse
• es-MX espagnol au Mexique
• es-AR espanol en Argentine
• es-ES espagnol en Espagne

Où mettre le code hreflang

Le hreflang peut être placé dans les endroits suivants :

• Code HTML sur les pages concernées
• Placer des balises hreflang dans un sitemap XML
• Ajouter le code au header http

Attention, n’utilisez qu’une seule de ces méthodes.

hreflang et x-default

hreflang peut aussi être complété par la valeur d’attribut x-default.

Cette valeur signale au moteur de recherche que la page de la version linguistique choisie par défaut (x-default) doit être affichée lorsqu’aucune des versions hreflang spécifiées ne correspond.

Si on reprend notre exemple d’une page d’accueil traduite en français, en belge et en anglais, il serait plus judicieux de mettre la version anglaise en x-default, l’anglais étant largement plus parlé à travers le monde que le français ou le belge.

Mise en place des balises à attribut hreflang avec le principe de réciprocité

Exemples :
< link rel = ‘’alternate’’ hreflang = ‘’langue-PAYS’’ href = ‘’[URL]’’ />
< link rel = ‘’alternate’’ hreflang = ‘fr-FR href = ‘’http://www.votre-site.fr’’ />

Chaque langue doit pointer vers les URLs de ses homologues dans chaque langue disponible. Voici un exemple pour la page ‘produits’ qui est en français pour la France et la Belgique, et en anglais pour la Grande-Bretagne :
www.votre-site.fr/produits.html
< link rel = ‘’alternate’’ hreflang = ‘fr-FR href = ‘’http://www.votre-site.fr/produits.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘fr-BE href = ‘’http://www.votre-site.be/produits.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘en-GB href = ‘’http://www.votre-site.co.uk/products.html’’ />

www.votre-site.be/produits.html
< link rel = ‘’alternate’’ hreflang = ‘fr-BE href = ‘’http://www.votre-site.be/produits.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘fr-FR href = ‘’http://www.votre-site.fr/produits.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘en-GB href = ‘’http://www.votre-site.co.uk/products.html’’ />

www.votre-site.co.uk/products.html
< link rel = ‘’alternate’’ hreflang = ‘en-GB href = ‘’http://www.votre-site.co.uk/products.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘fr-FR href = ‘’http://www.votre-site.fr/produits.html’’ />
< link rel = ‘’alternate’’ hreflang = ‘fr-BE href = ‘’http://www.votre-site.fr/produits.html’’ />

hreflang pour éviter les pages doublons

Cette notion de réciprocité est importante. La page sur le site français pointe vers la page sur le site anglais, la page du site anglais doit avoir une balise qui pointe vers la page du site français.

Les deux url doivent avoir les mêmes balises : la française et l’anglaise pour bien spécifier à Googlebot qu’il s’agit de différentes versions linguistiques d’une même page, et non de doublons.

L’attribut hreflang a pour objectif :

• De maximiser l’expérience utilisateur en lui servant un contenu adapté à sa langue et sa culture.
• De permettre aux moteurs de recherche d’afficher la bonne version d’une page dans la SERP en fonction de la localisation de l’utilisateur et de ses préférences linguistiques.
• D’indiquer à Google que les pages ne sont pas des doublons, mais bien des versions linguistiques

La mise en place de l’attribut hreflang peut être fastidieuse en raison du principe de réciprocité. C’est particulièrement vrai pour les grands sites internationaux avec de nombreuses versions linguistiques.
Si vous avez besoin de conseil pour la mise en place d’une version internationale de votre site, ou si vous avez besoin d’un audit international de votre site, nous sommes à votre disposition !

En complément de l’article :
Pour savoir quelle nomenclature utiliser pour chaque pays rendez-vous ici
Pour savoir quelle nomenclature utiliser pour chaque langage rendez-vous ici

Nous écrire

Cet article vous est présenté par Hugo, responsable de la mise en place des stratégies digitales à Pluvian. Il est spécialisé en contenu vidéo et se forme en langages informatiques à IMERIR