<time>
Une date, une heure ou une durée écrites de façon lisible pour les humains et, en même temps, compréhensible pour les machines.
- Affichage
- inline
- Balise fermante
- Obligatoire
- Contenu autorisé
- Contenu phrasant. Sans l’attribut
datetime, seulement du texte dans un format valide
Exemple
#<p>Le webinaire « Votre première page en HTML » commence le <time datetime="2026-10-06T18:00+02:00">6 octobre à 18h</time>.</p>
<p>Durée de l’enregistrement : <time datetime="PT1H15M">1 h 15 min</time>.</p>Définition et utilisation
#L’élément <time> marque une date, une heure ou une durée. Vous écrivez le texte visible pour les humains comme vous le voulez (« demain à 18 h », « le 14 septembre »), et dans l’attribut datetime, vous donnez la même information dans un format strictement défini, par exemple 2026-09-14 ou 18:00.
Grâce à cela, la date exacte peut être lue par les moteurs de recherche, les calendriers, les extensions de navigateur et vos propres scripts, indépendamment de la langue de la page. Un script peut par exemple la transformer en « il y a 3 jours » ou convertir l’heure dans le fuseau horaire de l’utilisateur.
Si vous omettez datetime, le contenu de l’élément lui-même doit être écrit dans un format machine valide. Les navigateurs ne changent pas l’apparence de <time>, donc pour le lecteur, c’est un texte ordinaire.
Syntaxe
#<time datetime="2026-09-28">28 septembre 2026</time>Attributs
#date, heure ou durée
La version pour les machines. Une date a la formeAAAA-MM-JJ, une heureHH:MM, et la combinaison des deux avec la lettreTet un décalage de fuseau horaire ressemble à ceci :2026-09-28T18:30+02:00. Une durée commence par la lettreP, par exemplePT1H30Mcorrespond à une heure et demie, etP3Dà trois jours.
L’élément accepte aussi tous les attributs globaux, comme class, id, style ou hidden.
Attributs en pratique
#datetime
date, heure ou duréeLa version pour les machines. Une date a la forme AAAA-MM-JJ, une heure HH:MM, et la combinaison des deux avec la lettre T et un décalage de fuseau horaire ressemble à ceci : 2026-09-28T18:30+02:00. Une durée commence par la lettre P, par exemple PT1H30M correspond à une heure et demie, et P3D à trois jours.
<ul>
<li><time datetime="2026-09-28">28 septembre 2026</time></li>
<li><time datetime="2026-09">septembre 2026</time></li>
<li><time datetime="18:30">18 h 30</time></li>
<li><time datetime="2026-09-28T18:30+02:00">aujourd’hui à 18 h 30</time></li>
<li><time datetime="P3D">3 jours</time></li>
</ul>Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Pour les événements, indiquez le décalage de fuseau horaire, par exemple
+02:00, pour que l’heure ne soit pas décalée pour les participants d’autres pays. - Écrivez la date de publication d’un article dans
<time>, généralement dans le<header>du billet. - N’utilisez pas
<time>pour des expressions sans date précise, comme « un jour » ou « bientôt ».
Entrées associées
#- <data>Relie un contenu lisible à une valeur pour les machines, par exemple le nom d’un produit à son code.
- <article>Un contenu autonome qui garde son sens une fois lu ou partagé séparément.
- <abbr>Une abréviation ou un acronyme, avec un développement facultatif dans l’attribut title.
- <span>Un conteneur en ligne générique sans signification, pour styliser un fragment de texte.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.