Table of Contents

Rôle

La balise <time> est un élément HTML polyvalent qui permet de représenter et de marquer les heures ainsi que les dates dans le calendrier grégorien. Elle offre une solution efficace pour structurer et afficher ces informations de manière sémantique et accessible. Dans cet article, nous explorerons en détail l’utilisation de la balise <time> et son impact sur la conception web.

<p>L'heure actuelle est <time>14:30</time>.</p>

Marquage des Dates

Outre les heures, la balise <time> est également utile pour marquer les dates dans le calendrier grégorien. Lorsque vous affichez des dates, il est conseillé d’inclure une légende ou une description pour indiquer le contexte. Par exemple :

html
<p>L'événement aura lieu le <time datetime="2023-09-15">15 septembre 2023</time>.</p>

Ici, la balise <time> est utilisée pour entourer la date "15 septembre 2023", tandis que l’attribut datetime fournit une valeur dans le format ISO 8601 pour indiquer la date exacte. Cette approche permet aux navigateurs de mieux comprendre le contenu et aux moteurs de recherche d’indexer les informations temporelles de manière plus précise.

Utilisation de l’Attribut pubdate

Lorsqu’une balise <time> est utilisée à l’intérieur d’un article ou d’un contenu publié, il est possible d’ajouter l’attribut pubdate pour indiquer la date de publication. Cela est particulièrement utile pour les articles de blog, les actualités et d’autres types de contenus chronologiques. Voici comment cela peut être mis en œuvre :

html
<article>
<h2>Titre de l'article</h2>
<p>Cet article a été publié le <time pubdate datetime="2023-08-20">20 août 2023</time>.</p>
<p>Contenu de l'article...</p>
</article>

En ajoutant l’attribut pubdate, vous signalez que la date encapsulée par la balise <time> correspond à la date de publication de l’article. Cela peut avoir un impact positif sur le référencement et l’organisation des contenus dans les systèmes de gestion de contenu.

Testez vous-même cette balise

Utilisez Codepen

Compatibilité

La balise <time> est pris en charge par tous les principaux navigateurs.

Attributs spécifiques

La balise <time> peut être utilisée avec l’attribut datetime pour définir une heure ou une date. Cet attribut est utilisé si aucune date ou heure n’est spécifiée dans le contenu de l’élément

La balise <time> prend en charge les attributs globaux

Attibuts de type événement

La balise <time> peut prendre en charge les événements clavier via l’attribut global contenteditable.

La balise <time> prend également en charge les événements de souris !

Maxime GUINARD
Maxime GUINARD

Merci d'avoir lu cet article. Je suis un développeur web WordPress passionné, et j'ai créé ce contenu avec soin pour vous offrir des informations de qualité. Restez connectés pour plus de conseils et d'astuces !

Facebook
Twitter
LinkedIn
Avantages Inconvénients
Permet de spécifier l’espace entre la bordure et l’image de bordure Peut ne pas être pris en charge par tous les navigateurs
Facilite la personnalisation des propriétés d’image de bordure La compatibilité avec les versions antérieures peut être un problème
Contribue à créer des effets visuels intéressants avec les bordures Doit être utilisé avec discernement pour éviter des conceptions trop complexes
Améliore la flexibilité dans la conception de bordures créatives La syntaxe peut nécessiter une certaine compréhension approfondie

Un projet en tête ?

Contact

Et si on discutait ? 🙂

  • Element Carré
  • Element Triangle
  • Element Triangle
  • Element Carré
[fluentform id="4"]

Adresse

Avenue du bac
94210 SAINT MAUR DES FOSSES

Téléphone

06.65.13.24.36