Noms des métadonnées standard

L'élément <meta> permet de fournir des métadonnées sous forme de paires clé/valeur où l'attribut name représente le nom et où l'attribut content fournit la valeur.

Noms de métadonnées standard définis dans la spécification HTML

La spécification HTML définit les noms de métadonnées standard suivants :

application-name

Le nom de l'application qui s'exécute sur la page web.

Note :

  • Les navigateurs peuvent utiliser cette information pour identifier l'application. Cette métadonnée est différente de celle fournie par <title> qui comprend généralement le nom de l'application, mais qui peut aussi contenir le nom du document ou un état.
  • Les pages web simples ne devraient pas utiliser application-name.
author

Le nom de la personne qui a écrit le document.

description

Une description concise et précise du contenu de la page. Certains navigateurs, comme Firefox et Opera, utilisent cette description par défaut pour les marque-pages.

generator

L'identifiant du logiciel qui a généré la page.

keywords

Les mots-clés pertinents pour décrire le contenu de la page, séparés par des virgules.

referrer

Contrôle l'en-tête HTTP Referer pour les requêtes envoyées depuis le document :

Valeurs pour l'attribut content de <meta name="referrer">
no-referrer Aucun en-tête Referer n'est envoyé.
origin Envoie l'origine du document.
no-referrer-when-downgrade Envoie l'URL complète lorsque la destination est au moins aussi sécurisée que la page actuelle (HTTP(S)→HTTPS). Dans le cas contraire (HTTPS→HTTP), aucun référent n'est envoyé. Il s'agit du comportement par défaut.
origin-when-cross-origin Envoie l'URL sans les paramètres pour les requêtes vers la même origine. Dans les autres cas, seule l'origine est envoyée.
same-origin Envoie l'URL sans les paramètres pour les requêtes vers la même origine. Dans les autres cas, aucun référent n'est envoyé.
strict-origin Envoie l'origine lorsque la destination est au moins aussi sécurisée que la page actuelle (HTTP(S)→HTTPS). Dans le cas contraire (HTTPS→HTTP), aucun référent n'est envoyé.
strict-origin-when-cross-origin Envoie l'URL sans les paramètres pour les requêtes vers la même origine. Sinon, si la destination est au moins aussi sécurisée que la page actuelle (HTTP(S)→HTTPS), c'est l'origine qui est envoyée. Dans les autres cas, aucun référent n'est envoyé.
unsafe-URL Envoie l'URL sans les paramètres pour les requêtes vers la même origine et vers les autres origines.

Note :

  • L'insertion dynamique d'un élément <meta name="referrer"> (en utilisant document.write() ou appendChild()) rendra imprévisible le comportement du référent.
  • Lorsque plusieurs règles contradictoires sont définies, c'est la règle no-referrer qui est appliquée.
theme-color

Fournit une suggestion de couleur que les agents utilisateur peuvent utiliser afin de personnaliser l'affichage de la page ou l'interface utilisateur environnante. L'attribut content doit contenir une couleur CSS valide (voir la page sur le type <color>.

color-scheme

Définit un ou plusieurs schémas de couleurs avec lesquels le document est compatible.

Le navigateur utilisera cette information en complément des réglages du navigateur et du système sous-jacent pour déterminer les couleurs à utiliser en arrière-plan et en premier plan pour les contrôles de formulaire et les barres de défilement. L'utilisation principale de <meta name="color-scheme"> consiste à indiquer la compatibilité avec les modes de thèmes clair ou sombre et l'ordre de préférence associé.

Pour color-scheme, la valeur de l'attribut content peut être :

normal

Le document n'a pas de schéma de couleurs particulier connu et devrait être affiché avec la palette de couleurs par défaut.

[light | dark]+

Un ou plusieurs schémas de couleurs pris en charge par le document. Répéter plusieurs fois le même schéma aura le même effet que l'indiquer une seule fois. Indiquer plusieurs schémas traduira un ordre de préférence : la première valeur étant préférée par le document et la seconde étant acceptable pour suivre la préférence de l'utilisatrice ou de l'utilisateur.

only light

Indique que le document prend uniquement en charge un mode clair (où les couleurs d'arrière-plan sont claires et les couleurs de premier plan foncées). La valeur only dark n'est pas valide pour la spécification, car afficher un document en mode sombre lorsqu'il n'est pas réellement compatible avec ce mode peut entraîner un contenu illisible. Les différents navigateurs principaux utilisent le mode clair par défaut.

Ainsi, pour indiquer qu'un document préfère être affiché en mode sombre tout en étant aussi compatible avec un mode clair, on aura :

<meta name="color-scheme" content="dark light">

Cela fonctionne au niveau du document, de la même façon que la propriété color-scheme permet à des éléments individuels d'indiquer leurs schémas de couleurs préférés et acceptables. Pour adapter la mise en forme en fonction du schéma de couleurs, on pourra utiliser la caractéristique média prefers-color-scheme.

Noms de métadonnées standard définis dans les autres spécifications

La spécification CSS sur l'adaptation des appareils (Device Adaptation) définit les noms de métadonnées suivants :

viewport

Fournit une indication à propos de la taille initiale de la zone d'affichage (viewport).

Valeurs pour le contenu de <meta name="viewport">
Valeurs Sous-valeurs possibles Description
width Un nombre entier positif ou le texte device-width Définit la largeur en pixel pour la zone d'affichage selon laquelle on souhaite que le site web soit affiché.
height Un nombre entier positif ou le texte device-height Définit la hauteur de la zone d'affichage. N'est utilisé par aucun navigateur.
initial-scale Un nombre positif entre 0.0 et 10.0 Définit le ratio entre la largeur de l'appareil (device-width en portrait et device-height en paysage) et la taille de la zone d'affichage.
maximum-scale Un nombre positif entre 0.0 et 10.0 Définit le zoom maximal possible. Cette valeur doit être supérieure ou égale à minimum-scale (dans le cas contraire, le comportement est indéfini). Les réglages des navigateurs peuvent permettre d'ignorer cette règle et iOS10+ l'ignore par défaut default.
minimum-scale Un nombre positif entre 0.0 et 10.0 Définit le zoom minimal possible. Cette valeur doit être inférieure ou égale à maximum-scale (dans le cas contraire, le comportement est indéfini). Les réglages des navigateurs peuvent permettre d'ignorer cette règle et iOS10+ l'ignore par défaut.
user-scalable yes ou no Si la valeur vaut no, la personne ne pourra pas zoomer sur la page. La valeur par défaut est yes. Les réglages des navigateurs peuvent permettre d'ignorer cette règle et iOS10+ l'ignore par défaut.
viewport-fit auto, contain ou cover

La valeur auto n'a pas d'impact sur la disposition initiale de la zone d'affichage et toute la page web est visible.

La valeur contain indique que la zone d'affichage est mise à l'échelle pour s'inscrire dans le plus grand rectangle possible de l'affichage.

La valeur cover indique que la zone d'affichage est mise à l'échelle afin de remplir l'affichage de l'appareil. Il est grandement recommandé d'utiliser les variables safe area inset pour s'assurer que le contenu important ne se retrouve pas en dehors de l'affichage.

Points d'accessibilité quant à la mise à l'échelle de la zone d'affichage

Désactiver la possibilité de zoomer en utilisant user-scalable avec la valeur no empêchera les personnes ayant des troubles de la vision de pouvoir lire et comprendre le contenu de la page.

Voir aussi

La règle-@ @viewport.

Autres noms de métadonnées

La page wiki du WHATWG sur les MetaExtensions contient un large ensemble de noms de métadonnées qui n'ont pas encore été formellement acceptées, mais dont certains sont déjà utilisés en pratique et dont une partie est présentée ici :

  • creator
    • : Le nom de la créatrice ou du créateur du document, tel que celui de l'organisation ou de l'institution. Si plusieurs noms correspondent, on utilisera plusieurs éléments <meta>.
  • googlebot
    • : Un synonyme de robots, uniquement suivi par Googlebot (le robot d'indexation de Google).
  • publisher
    • : Le nom de l'éditrice ou de l'éditeur (pour la publication) du document.
  • robots
    • : Le comportement que les robots d'indexation devraient suivre sur la page. Il s'agit d'une liste de valeurs séparées par des virgules et qui sont décrites dans le tableau suivant :
      Valeur Description Utilisée par
      index Permet au robot d'indexer la page (valeur par défaut). Tous
      noindex Demande au robot de ne pas indexer la page. Tous
      follow Permet au robot de suivre les liens de la page (valeur par défaut). Tous
      nofollow Demande au robot de ne pas suivre les liens de la page. Tous
      all Équivalent à index, follow Google
      none Équivalent à noindex, nofollow Google
      noarchive Demande au moteur de recherche de ne pas mettre en cache le contenu de la page. Google, Yahoo, Bing
      nosnippet Empêche l'affichage d'une description de la page dans les résultats d'un moteur de recherche. Google, Bing
      noimageindex Demande à ce que cette page n'apparaisse pas comme page référente d'une image indexée. Google
      nocache Synonyme de noarchive. Bing

    Note :

    • Ces règles ne sont pas contraignantes dans l'absolu. Seuls les robots suivants les bonnes pratiques les respecteront. Il ne faut pas s'attendre à ce qu'un acteur malveillant les suive.
    • Le robot doit avoir accès à la page afin de lire ces règles. Pour éviter une consommation de bande passante, utilisez un fichier robots.txt.
    • Si vous souhaitez retirer une page d'un index, noindex fonctionnera à partir de la prochaine visite du robot. Assurez-vous que le fichier robots.txt n'empêche pas les visites ultérieures.
    • Certaines valeurs s'excluent mutuellement (comme index et noindex, ou follow et nofollow). Dans ces cas, le comportement du robot est indéfini et peut varier selon les robots.
    • Certains robots d'indexation comme ceux de Google, Yahoo et Bing prennent en charge ces valeurs pour l'en-tête HTTP X-Robots-Tag, ce qui permet aux robots d'accéder à ces règles pour les documents qui ne sont pas HTML (les images par exemple).

Spécifications

Specification
HTML Standard
# standard-metadata-names
CSS Device Adaptation Module Level 1
# viewport-meta
Referrer Policy
# referrer-policy-delivery-meta

Compatibilité des navigateurs

BCD tables only load in the browser