Definición destacada
¿Como funciona el comando en HTML5: 'time'?
Última modificación: 2024-06-18
Descripción de la Etiqueta <time> en HTML5
La etiqueta <time> en HTML5 se utiliza para representar tiempos, fechas o ambos en un documento. Este elemento puede ser útil para proporcionar a los navegadores , motores de búsqueda y otras herramientas información semántica sobre valores temporales, facilitando tareas como el formateo de fechas, la localización y la agenda de eventos.
Atributos del Elemento <time>
-
datetime (opcional):
- Permite especificar una representación legible por máquina de la fecha o tiempo. Aunque es un atributo opcional, su uso es muy recomendado para proporcionar un valor exacto en un formato estandarizado.
- Formatos válidos incluyen una fecha completa (
YYYY-MM-DD), una hora (HH:MM), o combinaciones de fecha y hora (YYYY-MM-DDTHH:MM:SS). - Ejemplos:
- Solo fecha:
2023-10-20 - Fecha y hora:
2023-10-20T14:30:00 - Solo hora:
14:30:00
- Solo fecha:
-
pubdate (obsoleto en HTML5):
- Anteriormente se utilizaba para especificar que la fecha contenida es la fecha de publicación del artículo o contenido. Sin embargo, este atributo ha sido eliminado y se aconseja utilizar otras etiquetas y métodos para marcar fechas de publicación.
Uso de <time> en HTML5 con Ejemplos
Ejemplo 1: Representación de una Fecha
<p>El evento se llevará a cabo el <time datetime="2023-10-20">20 de octubre de 2023</time>.</p>
En este ejemplo, el elemento <time> proporciona tanto una representación legible por humanos ("20 de octubre de 2023") como una representación legible por máquinas (2023-10-20).
Ejemplo 2: Fecha y Hora Combinadas
<p>La reunión está programada para <time datetime="2023-10-20T14:30">el 20 de octubre de 2023 a las 2:30 PM</time>.</p>
Este ejemplo muestra tanto la fecha como la hora en un formato amigable para los usuarios, mientras que el atributo datetime proporciona una forma estándar para herramientas y scripts.
Ejemplo 3: Solo Hora
<p>La alarma está configurada para sonar a las <time datetime="07:00">7:00 AM</time>.</p>
Aquí, solo se especifica una hora, lo que puede ser útil para alarmas, horarios y otros eventos basados en el tiempo.
Ejemplo 4: Uso en Contexto de Publicaciones
<article>
<h2>Nueva Publicación en el Blog</h2>
<p>Publicado el <time datetime="2023-10-10">10 de octubre de 2023</time> por Juan Pérez.</p>
<p>Contenido del artículo...</p>
</article>
En este caso, la etiqueta <time> se utiliza para marcar la fecha de publicación de un artículo, contextualizándolo de manera semántica dentro de la publicación.
Conclusión
La etiqueta <time> en HTML5 es una herramienta valiosa para proporcionar información temporal de manera semántica y estructurada. Aunque su atributo pubdate ha sido obsoleto, el atributo datetime sigue siendo fundamental para asegurar que las fechas y horas pueden ser interpretadas correctamente por diversas aplicaciones y herramientas. Utilizar <time> adecuadamente mejora la accesibilidad y la interoperabilidad de los contenidos web.