HTML
Citas, código, datos, tiempo y ediciones
Elementos HTML para representar citas, código, salida, datos, fechas y cambios editoriales con significado legible por personas y máquinas.
- Última actualización
- Actualizada
- Nivel
- Fundamentos
HTML
Elementos HTML para representar citas, código, salida, datos, fechas y cambios editoriales con significado legible por personas y máquinas.
<p>
El equipo definió el objetivo como
<q>reducir el trabajo manual</q>.
</p>Representa una cita breve en línea. El navegador puede añadir comillas según idioma.
No escribas comillas duplicadas manualmente alrededor de q salvo que el estilo o idioma lo requieran de forma deliberada.
<blockquote cite="https://example.com/article">
<p>La accesibilidad comienza con una estructura comprensible.</p>
</blockquote>Representa una cita extensa. cite contiene la URL de la fuente, pero no sustituye una atribución visible.
<p>
En <cite>Designing with Web Standards</cite>, el autor explica...
</p>Representa el título de una obra, no el nombre de la persona autora.
Para autoría visible usa texto normal, posiblemente dentro de figcaption.
<abbr title="HyperText Markup Language">HTML</abbr>Representa una abreviatura. title puede ofrecer expansión, pero no dependas de tooltip como única explicación si el término no es comprensible en contexto.
<p>
HyperText Markup Language (<abbr>HTML</abbr>) estructura documentos web.
</p>Presentar la expansión en texto suele ser más robusto.
<p>Utiliza el elemento <code>main</code>.</p>Representa un fragmento de código o nombre técnico.
Para bloques:
<pre><code>const total = price * quantity;</code></pre><p>Presiona <kbd>Ctrl</kbd> + <kbd>K</kbd>.</p>Representa entrada del usuario, normalmente teclado o voz.
<p>La terminal muestra <samp>Build completed</samp>.</p>Representa salida de un programa o sistema.
<p>El área es <var>width</var> × <var>height</var>.</p>Representa una variable matemática o de programación dentro de texto.
<data value="product-123">Teclado mecánico</data>Asocia una representación legible con un valor apto para procesamiento.
No crea automáticamente structured data ni comportamiento JavaScript.
<time datetime="2026-07-23">23 de julio de 2026</time>Relaciona texto humano con una fecha/hora legible por máquinas.
<time datetime="2026-07-23T17:30:00-05:00">
5:30 p. m.
</time>Incluye offset cuando representa un instante específico.
<time datetime="PT2H30M">2 horas y 30 minutos</time>El valor utiliza una duración válida cuando el contexto lo admite.
<p>Precio: <del>$120</del> $90</p>Representa contenido eliminado de una versión del documento.
Puede incluir metadata:
<del
cite="https://example.com/change-log"
datetime="2026-07-23T10:00:00-05:00"
>
Funcionalidad anterior
</del><p>
Disponible en Bogotá
<ins>y de forma remota</ins>.
</p>Representa contenido insertado como edición.
<s>Información desactualizada</s>s indica que algo ya no es preciso o relevante. del registra una eliminación editorial.
<ruby>
漢 <rp>(</rp><rt>かん</rt><rp>)</rp>
</ruby>Proporciona anotaciones de pronunciación o explicación utilizadas en sistemas de escritura de Asia oriental.
rp ofrece fallback de paréntesis en entornos sin soporte adecuado.
<p>
<dfn id="semantic-html">HTML semántico</dfn>
utiliza elementos según su significado.
</p>Marca la instancia donde se define un término.
Otros enlaces pueden referir al fragmento:
<a href="#semantic-html">Revisar la definición</a><article>
<header>
<h2>Nueva versión de DomiSys</h2>
<p>
Publicada el
<time datetime="2026-07-23">23 de julio de 2026</time>.
</p>
</header>
<p>
Se eliminó <del>la gestión manual de stock</del>
y se añadió <ins>sincronización por local</ins>.
</p>
</article>¿Por qué <cite>Nicolás Garzón</cite> suele ser incorrecto?
Porque cite representa el título de una obra, no el nombre de una persona autora.
Enlaces y navegación explica cómo HTML conecta documentos, recursos y ubicaciones.