Comment ajouter des balises Hreflang sur Webflow ?

Lorsqu’un site internet n’est disponible que dans une seule langue, cette dernière est spécifiée directement dans l’entête du document HTML. Pour un site français par exemple, on trouve la balise « lang=’fr’ » dans le type de document.

Dans le cas d’un site qui comporte de multiples versions dans des langues différentes, cet attribut « lang » ne suffit plus. C’est ici que les balises hreflang entrent en jeu !

Nous allons voir dans cet article que sont les balises hreflang et comment les intégrer dans votre site multilingue sur Webflow.

‍

I. Qu’est-ce qu’une balise hreflang ?

‍

La balise hreflang est un élément HTML utilisé pour indiquer aux moteurs de recherche la langue et la localisation d'une page web. Elle est utilisée pour les sites multilingues ou les sites qui proposent du contenu spécifique à une région ou à un pays.

La balise hreflang est placée dans la section d’entête d'une page HTML. Elle utilise un code de langue normalisé et un code de pays ou de région pour spécifier la langue et la localisation.

Ces balises sont une bonne pratique pour optimiser le référencement naturel car elles permettent aux moteurs de recherche de comprendre plus facilement la langue de vos pages. Ainsi, vos pages sont mieux référencées sur les requêtes en langues étrangères. Vous êtes donc mieux positionnés pour atteindre les publics visés.

‍

D’un point de vue technique, les balises hreflang sont à placer sur les liens de vos pages. Voici des exemples de balises hreflang codées :

<a href="https://example.com/page-en.html" hreflang="en">English Version</a>

<a href="https://example.com/page-fr.html" hreflang="fr">Version française</a>

‍

Ici, la balise « hreflang=’en’ » signale à Google que la cible de ce lien est une page en anglais. A l’inverse, la balise « hreflang=’fr’ » envoie le signal que la page sera en français.

‍

II. Comment intégrer des balises hreflang sur mon site Webflow ?

‍

Avec Webflow, l’accès direct au code HTML des boutons et liens générés avec l’outil peut s’avérer compliqué. Puisque c’est un outil no code, nous voulons également une solution no code !

C’est pourquoi nous vous recommandons l’utilisation d’outils de gestion de site multilingue, comme Weglot.

‍

Weglot utilise des algorithmes de traduction automatique pour traduire le contenu de votre site web dans différentes langues. Cet outil est capable de détecter et de traduire automatiquement le texte statique ainsi que le contenu dynamique généré par votre CMS.

Weglot dispose d'un détecteur de langue automatique qui identifie la langue préférée des visiteurs. Ainsi, Weglot met en place des balises hreflang pour assurer une indexation et une visibilité optimales dans les moteurs de recherche.

Weglot comporte une version gratuite pour tester l’outil dans une limite d’une langue supplémentaire et 3000 mots traduits. Par la suite il faudra souscrire à un abonnement :

15€ par mois pour la version Starter : 1 langue et 10 000 mots traduits
29€ par mois pour la version Business : 3 langues et 50 000 mots traduits
79€ par mois pour la version Pro : 5 langues et 200 000 mots traduits

‍

Avec cet outil, vos balises hreflang seront correctement configurées sans devoir toucher directement au code de vos pages.

‍

III. Comment vérifier que les balises présentes sur mon site Webflow sont correctement paramétrées ?

‍

Pour vérifier si vos balises hreflang sont bien configurées, vous pouvez utiliser des outils comme Hreflang Checker.

‍

Hreflang Checker vous permet de tester des URL pour observer si les balises hreflang sont bien paramétrées ou non.

En entrant l’URL de la page à tester dans l’outil, vous aurez un aperçu des balises détectées et des potentielles erreurs.

Dans l’exemple ci-dessus, l’outil à bien identifié les balises hreflang « en » et « it » qui correspondent aux pages en anglais et en italien. Le statut 200 signifie que les balises ne comportent pas d’erreur et que les moteurs de recherches assimilent parfaitement l’information.

Cet outil rapide et gratuit est donc idéal pour tester la mise en place de vos pages en langue étrangère.

‍

Félicitations, vous savez désormais ce qu’est une balise hreflang, comment la configurer sur votre site Webflow et comment la tester. Cela va améliorer l’expérience utilisateur des internautes sur votre site, quelle que soit leur langue de navigation préférée. Cela contribue également à améliorer vivement votre référencement naturel dans les requêtes ciblées.

‍

La balise hreflang n’est en revanche qu’une partie de l’optimisation SEO d’un site internet. Pour aller plus loin, mener une analyse approfondie de ce dernier sert à révéler les autres éléments perfectibles et les potentielles erreurs.

‍

Pour plus d’informations sur le référencement naturel, nous vous invitons à retrouver toutes nos astuces dans notre guide complet sur le référencement naturel.

Retrouvez également nos nombreux tutos et conseils sur la création de sites sur Webflow !