Meta tags HTML : à quoi servent ces balises meta ?

Les balises meta HTML, in­vi­sibles pour les uti­li­sa­teurs et situées dans l’en-tête d’un site Web, four­nis­sent des in­for­ma­tions cruciales sur le site. Elles indiquent la structure, le type de page, ainsi que la fonction et la langue du contenu. En plus d’in­fluen­cer l’affichage et l’in­dexa­tion, ces balises sont un outil SEO essentiel pour améliorer le clas­se­ment du site dans les moteurs de recherche.

Que sont les balises meta en HTML ?

Les meta tags HTML sont des balises HTML spéciales, car elles sont in­dis­pen­sables à la pré­sen­ta­tion, l’in­ter­pré­ta­tion et l’in­dexa­tion des sites Web par les na­vi­ga­teurs et les moteurs de recherche. Elles se trouvent dans l’en-tête d’un site Web et ne sont pas visibles pour les uti­li­sa­teurs. En utilisant ha­bi­le­ment le tag HTML <meta>, les dé­ve­lop­peurs peuvent fournir des pro­prié­tés de page pour une meilleure li­si­bi­lité par les moteurs de recherche et définir des in­for­ma­tions telles que la langue, le contenu, la structure ou le codage des ca­rac­tères.

Les balises meta sont donc un outil essentiel en HTML pour optimiser les pages pour les moteurs de recherche, améliorer le clas­se­ment et contrôler l’affichage sur tous les appareils. Bien que les mé­ta­don­nées ne comptent plus aujourd’hui parmi les critères de clas­se­ment les plus im­por­tants pour les sites Web, le HTML title et la meta des­crip­tion, en par­ti­cu­lier, con­ti­nuent de jouer un rôle important.

Les prin­ci­paux domaines d’ap­pli­ca­tion des balises meta HTML

Les prin­ci­paux domaines d’ap­pli­ca­tion des balises meta HTML sont les suivants :

• Op­ti­mi­sa­tion pour les moteurs de recherche : les balises meta, telles que pour la meta-des­crip­tion et le titre, four­nis­sent aux moteurs de recherche des in­for­ma­tions sur le contenu et les points forts d’une page. Elles per­met­tent de résumer clai­re­ment le contenu, de susciter l’intérêt et de générer des clics.
• In­dexa­tion : les mé­ta­don­nées, comme la balise robots, indiquent aux moteurs de recherche si une page doit être indexée ou non.
• Affichage et pré­sen­ta­tion : les balises meta peuvent contenir des in­for­ma­tions et des ins­truc­tions sur le codage des ca­rac­tères, l’affichage sur les appareils mobiles, les mises à jour ou les re­di­rec­tions au­to­ma­tiques.
• Réseaux sociaux : les réseaux sociaux utilisent des balises meta spé­ci­fiques, qui doivent être prises en compte pour garantir un affichage correct lors du partage de contenu.
• Ac­ces­si­bi­lité : les mé­ta­don­nées jouent un rôle crucial dans l’ac­ces­si­bi­lité, en fa­ci­li­tant la ca­té­go­ri­sa­tion par les lecteurs d’écran ou en assurant un affichage optimal sur tous les appareils grâce à l’élément viewport.

Quel est le rôle des balises meta HTML ?

Les moteurs de recherche comme Google four­nis­sent aujourd’hui un clas­se­ment thé­ma­tique très concret et précis basé sur des mots-clés et des requêtes spé­ci­fiques. Il y a quelques années encore, les mé­ta­don­nées jouaient un rôle bien plus important dans le clas­se­ment d’un site Web. Cependant, comme il était beaucoup plus facile de manipuler le clas­se­ment à l’aide de balises meta et de mots-clés, cela a parfois conduit à des abus, tels que le bourrage de mots-clés.

Pour les moteurs de recherche modernes, les mé­ta­don­nées et leur balisage avec <meta> HTML n’ont toutefois rien perdu de leur im­por­tance. Bien au contraire : une mauvaise uti­li­sa­tion des mé­ta­don­nées peut entraîner le risque d’être com­plè­te­ment ignoré. Une uti­li­sa­tion ap­pro­priée de mé­ta­don­nées per­ti­nentes, telles que la balise <title> et la meta des­crip­tion, ainsi qu’une mise à jour régulière des mé­ta­don­nées, peuvent toujours être des critères décisifs pour un bon clas­se­ment durable.

Les prin­ci­pales balises meta HTML et leur syntaxe

Les fonctions remplies par les balises meta et leur uti­li­sa­tion dépendent du type de balise. Nous avons résumé pour vous quelques-unes des prin­ci­pales balises meta dans les pa­ra­graphes suivants.

Op­ti­mi­sa­tion pour les moteurs de recherche (SEO)

L’op­ti­mi­sa­tion pour les moteurs de recherche est l’une des fonctions les plus im­por­tantes du tag HTML <meta>. Les balises meta suivantes sont par­ti­cu­liè­re­ment per­ti­nentes pour le SEO :

Title

Avec le titre ou l’élément <title>, vous expliquez briè­ve­ment aux moteurs de recherche et aux uti­li­sa­teurs le contenu d’un site Web. Stric­te­ment parlant, il ne s’agit pas d’une balise meta, mais d’une balise in­dé­pen­dante qui se place avant toutes les autres meta tags. Néanmoins, le titre est souvent mentionné parmi les éléments les plus im­por­tants, car il est également analysé par les moteurs de recherche et utilisé comme l’un des prin­ci­paux facteurs de clas­se­ment.

Comme il s’agit de l’élément cliquable dans les résultats de recherche, il est important d’avoir un titre clair et concis qui suscite l’intérêt et qui a la longueur correcte pour une annonce complète.

Syntaxe :

<title>Insérer le titre du document</title>

Meta des­crip­tion

La meta des­crip­tion ne joue certes pas un rôle direct dans le clas­se­ment, mais tout comme le titre, elle constitue le premier contact avec les uti­li­sa­teurs et fournit les premières in­for­ma­tions sus­cep­tibles de générer des clics. La longueur adéquate ainsi que des éléments tels que des icônes, des symboles qui mettent en valeur des termes per­ti­nents, ou un Call-to-Action (CTA) sont également im­por­tants à cet égard.

Syntaxe :

<meta name="description" content="Ici se trouve la meta description souhaitée de la page Web en question, qui devrait idéalement avoir une longueur d’environ 150 caractères.">

robots

Avec l’attribut HTML robots, vous pouvez donner aux moteurs de recherche les ins­truc­tions SEO per­ti­nentes pour l’in­dexa­tion, les liens, les snippets ou la sau­ve­garde :

• index : la page peut être indexée.
• noindex : la page ne doit pas être indexée.
• follow : les robots d’in­dexa­tion (crawlers) peuvent suivre les liens sur la page.
• nofollow : les crawlers ne doivent pas suivre les liens sur la page.
• nosnippet : les contenus ne doivent pas être utilisés comme featured snippet (ou « extrait optimisé » en français).
• noarchive : la page en­re­gis­trée dans le cache Google ne doit pas être affichée.

Si aucune donnée robots n’est indiquée, les moteurs de recherche l’in­ter­prè­tent comme une au­to­ri­sa­tion d’indexer, d’afficher des snippets ou de suivre des liens. Le ré­fé­ren­ce­ment naturel avec robots est donc une fonction très im­por­tante des balises meta.

Syntaxe pour une page qui peut être indexée et dont les liens peuvent être suivis par les robots d’ex­plo­ra­tion :

<meta name="robots" content="index, follow">

viewport

L’attribut meta HTML viewport est d’une im­por­tance fon­da­men­tale pour le res­pon­sive design des sites Web. Bien que la balise meta ne soit pas di­rec­te­ment per­ti­nente pour le SEO, elle l’est cependant pour le ré­fé­ren­ce­ment pour mobile, qui sert également de facteur de clas­se­ment important. Grâce à viewport, vous indiquez à un moteur de recherche si votre site Web supporte un design res­pon­sive sur dif­fé­rents terminaux et s’il est considéré comme adapté aux mobiles. Vous veillez avec viewport à la re­pré­sen­ta­tion correcte du site Web en fonction du terminal, et donc à une uti­li­sa­bi­lité optimale.

Syntaxe :

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Codage des ca­rac­tères avec charset

Avec la balise meta charset, vous indiquez aux na­vi­ga­teurs le codage des ca­rac­tères utilisé pour garantir un affichage correct du texte. Cela est par­ti­cu­liè­re­ment important si vous n’avez pas spécifié le jeu de ca­rac­tères dans l’en-tête HTTP ou si le na­vi­ga­teur récupère les fichiers HTML di­rec­te­ment depuis le disque dur plutôt que via HTTP(S).

Syntaxe :

<meta charset="utf-8"/>

Mettre en cache avec expires

Si vous ne souhaitez pas interdire com­plè­te­ment la mise en cache, vous pouvez utiliser expires pour définir une date ou une période après laquelle les données HTML mises en cache doivent expirer. Cependant, dans les ap­pli­ca­tions Web modernes, l’uti­li­sa­tion de expires est devenue très rare, car la mise en cache est désormais prin­ci­pa­le­ment contrôlée par les en-têtes HTTP.

Syntaxe :

<meta http-equiv="expires" content="Heure de l’expiration en secondes"/>

In­for­ma­tions sur l’auteur et le copyright

Les balises meta HTML author et copyright per­met­tent de consigner les in­for­ma­tions sur l’auteur et le copyright dans le code source. Vous facilitez ainsi la gestion de la page et êtes trans­pa­rent sur les dernières mo­di­fi­ca­tions apportées à celle-ci.

Syntaxe :

<meta name="author" content="Auteur"/>
<meta name="copyright" content="Titulaire du droit d’auteur"/>

Mots-clés

Au­pa­ra­vant, les mots-clés faisaient partie des critères de clas­se­ment im­por­tants lors de la création de sites Web. Aujourd’hui, les mots-clés meta ont une im­por­tance nettement réduite et sont ignorés, du moins par Google, en ce qui concerne la per­ti­nence SEO et le clas­se­ment. En tant que mots-clés, vous décrivez les aspects les plus im­por­tants d’une page qui, idéa­le­ment, cor­res­pon­dent aux in­ten­tions de recherche des uti­li­sa­teurs. Se ren­seig­ner sur les mots-clés per­ti­nents pour son domaine peut offrir des avantages con­cur­ren­tiels. En principe, cependant, les mots-clés jouent désormais un rôle se­con­daire dans le clas­se­ment.

Syntaxe :

<meta name="keywords" content="Mot-clé1, mot-clé2, mot-clé3...">