Líneas de tiempo: Cómo presentar eventos y fases en orden

Una línea de tiempo es un registro ordenado de eventos, hitos o fases nombradas en el que la posición comunica cuándo ocurrió algo o cómo se desarrolló un tema. El lector observa la secuencia; no se le está instruyendo para reproducirla.

1. 1
   Marzo 2025 — Investigación aprobada

   El equipo fijó la cohorte, las preguntas y el método de comparación antes de comenzar la recolección.
2. 2
   Abril–Mayo 2025 — Línea base recopilada

   Se registraron las mismas mediciones para cada participante durante la ventana de recolección definida.
3. 3
   Junio 2025 — Hallazgos publicados

   El informe publicó sus resultados con métodos, limitaciones y la fecha de la próxima revisión.

Este ejemplo renderizado describe una secuencia de investigación completada. Su orden explica la relación entre aprobación, recolección y publicación, pero ninguna de sus entradas le ordena al lector realizar esas acciones.

Por qué es importante este elemento

Las personas reconstruyen el cambio haciéndose tres preguntas: ¿qué ocurrió, cuándo ocurrió y qué causó o habilitó? Una línea de tiempo responde esas preguntas en un patrón repetido. El marcador de fecha o fase crea orientación, el título del evento le da nombre al cambio y la descripción explica su importancia. Los lectores pueden buscar un hito conocido, comparar espacios entre eventos o entender por qué el estado actual no podría haber existido antes.

Ese ritmo visual también reduce la carga de memoria. En prosa ordinaria, las fechas pueden separarse de los eventos que califican, y el lector debe retener varias frases en mente antes de ensamblar la cronología. Una línea de tiempo delimitada mantiene cada marcador adjunto a su evento y hace visibles las omisiones o saltos inexplicados. Es especialmente útil cuando la afirmación del pasaje depende de la secuencia: un resultado observado después de una intervención significa algo diferente a un resultado recopilado antes de ella.

La extractabilidad por máquina es la capacidad de un rastreador, motor de búsqueda, sistema de respuestas de IA o adaptador de publicación para aislar cada registro sin perder su orden o campos. Una lista ordenada semántica con regiones consistentes de fecha, título y descripción ofrece a las máquinas una estructura más sólida que fechas dispersas en párrafos. Un sistema puede identificar el tercer evento como el tercer evento, preservar la relación entre «Junio 2025» y «Hallazgos publicados», y citar la descripción sin atribuirla erróneamente a abril.

Usa las reglas de escritura de elementos como regla de precedencia. Si el propósito de un pasaje es registrar cambios a lo largo del tiempo, usa la línea de tiempo tipificada incluso si un encabezado y varios párrafos podrían verse similares. Si su propósito es instrucción, comparación o verificación independiente, el elemento correspondiente tiene prioridad, independientemente de si un diseñador podría dibujar una línea vertical a su lado.

Cuándo usarla

Usa una línea de tiempo cuando el orden es parte de la afirmación y cada elemento representa un evento, hito, transición de estado o fase documentada. Los temas apropiados incluyen la historia de una empresa, los lanzamientos de un producto, las fechas de adopción y aplicación de una normativa, las etapas de un caso de estudio completado, o las fases de recolección y publicación detrás de un informe.

Aplica dos pruebas antes de elegirla:

1. La prueba del intercambio: intercambia dos entradas adyacentes. Si el relato se vuelve históricamente falso, engañoso causalmente o confuso temporalmente, el orden tiene significado.
2. La prueba del observador: pregúntate si el lector está aprendiendo qué ocurrió o se le está diciendo qué hacer. La observación indica una línea de tiempo; la ejecución indica una lista de pasos .

Los casos cercanos necesitan estructuras diferentes:

• Un procedimiento: «Exporta los datos, límpialos, luego súbelos» instruye al lector. Necesita acciones, señales de éxito y rutas de recuperación, no descripciones históricas de eventos.
• Una lista de verificación: «Confirma propietario, fecha, fuente y estado» contiene puertas de verificación independientes. Su orden no crea significado.
• Una lista de funciones: «Lanzó informes, integraciones y alertas» puede simplemente enumerar capacidades. Se convierte en línea de tiempo solo cuando importan los lanzamientos fechados y sus consecuencias.
• Una afirmación de antes y después: dos estados suelen ser más claros como una comparación directa. No añadas un punto decorativo intermedio para alcanzar un recuento mínimo de elementos.
• Un plan de proyecto: las fechas planificadas pueden usar una línea de tiempo solo cuando están claramente etiquetadas como programadas o pronosticadas. No presentes la intención como historia completada.
• Una visión general de proceso: las fases nombradas pueden usar una línea de tiempo cuando la página describe cómo se organiza un proceso. Si el lector debe ejecutar esas fases, usa en su lugar una lista de pasos o una lista de verificación.

La presencia de fechas no es suficiente. Una lista de fechas de conferencias no relacionadas es un calendario o listado. Una línea de tiempo requiere un solo tema y una línea de desarrollo coherente.

Dónde colocarla

Coloca la línea de tiempo inmediatamente después de una oración breve que nombre su tema, alcance y dirección. «Los hitos a continuación van desde la constitución hasta el producto actual» es suficiente. Los lectores nunca deben tener que inferir si el primer elemento es el más antiguo, el más reciente, completado o planificado.

La posición exacta depende de su función:

• Coloca una línea de tiempo histórica después de la definición del tema o resumen del estado actual y antes del análisis de por qué la historia importa.
• Coloca una línea de tiempo de caso de estudio después de la situación inicial y el alcance, pero antes de los resultados detallados, para que los lectores puedan distinguir la línea base, la intervención y la medición.
• Coloca una línea de tiempo de lanzamientos después del resumen del lanzamiento actual. Usa orden del más reciente al más antiguo cuando el descubrimiento del cambio más reciente sea la tarea principal, y etiqueta esa dirección.
• Coloca una cronología de implementación o política después del alcance de la norma y antes de las obligaciones actuales. Las fechas de vigencia deben permanecer visibles fuera de cualquier interfaz colapsada.
• Coloca una línea de tiempo de investigación después del resumen del método y antes de los hallazgos cuando el momento de la recolección afecte la interpretación.

Una línea de tiempo no puede situarse directamente junto a una lista de pasos sobre el mismo tema sin una transición que indique qué bloque registra historia y qué bloque instruye acción. No puede insertarse entre una afirmación y su fuente de respaldo, entre una advertencia y su consecuencia, ni dentro de una celda de comparación. No coloques dos líneas de tiempo consecutivas; combínalas cuando compartan tema y escala, o sepáralas con un análisis que explique por qué la segunda secuencia es distinta.

Evita una llamada a la acción promocional entre eventos. Esto interrumpe tanto el flujo cronológico como la semántica de lista ordenada. Coloca la promoción después de la línea de tiempo completa y su interpretación.

Anatomía

La anatomía etiquetada contiene siete partes:

1. Encabezado de alcance: nombra el tema y el período de tiempo representado por la colección.
2. Indicador de dirección: indica del más antiguo al más reciente o del más reciente al más antiguo cuando el contexto circundante no lo hace inequívoco.
3. Pista ordenada: conecta visualmente los registros mientras el <ol> subyacente preserva el orden sin estilos.
4. Marcador de fecha o fase: identifica cuándo ocurrió el evento, con la precisión más honesta disponible.
5. Título del evento: expresa el cambio o hito en una frase compacta en pasado o presente.
6. Descripción: explica qué cambió y por qué este evento pertenece a la secuencia.
7. Estado: opcionalmente distingue eventos completados, actuales, programados, retrasados o cancelados con palabras y no solo con color.

La línea, los puntos y los iconos son decoración. Las fechas, títulos, descripciones, órdenes y estados son contenido y deben permanecer disponibles en texto, impresión y salida sin CSS.

Ejemplos de diseño

Cada variante compatible preserva una lista ordenada y los mismos campos de elemento. Las variantes cambian la densidad o el énfasis, no el significado.

Estándar vertical

Usa la opción predeterminada para tres a ocho eventos con descripciones de una o dos oraciones. Da espacio para que el texto de longitud variable se ajuste y funciona de manera confiable en pantallas estrechas.

Registro de cambios compacto

Usa el espaciado compacto para registros cortos y frecuentes, como lanzamientos. Los títulos lideran; las descripciones se limitan a una oración. El orden del más reciente al más antiguo solo está permitido cuando el encabezado o el indicador de dirección lo indica.

Énfasis en hitos

Usa énfasis en hitos cuando dos a seis puntos de inflexión importan más que los intervalos entre ellos. Un hito actual resaltado debe incluir la palabra visible «Actual»; el tamaño o el color por sí solos son insuficientes.

Línea de tiempo por fases

Usa fases nombradas cuando las fechas exactas no están disponibles o son menos útiles que la posición en el ciclo de vida. Los marcadores de fase deben ser mutuamente distintos y consistentemente granulares: «Descubrimiento», «Recolección» y «Publicación», no «Descubrimiento», «12 de mayo» y «Después».

Horizontal en pantalla ancha

Usa una presentación horizontal solo para tres a cinco hitos breves y solo cuando se convierta en una lista ordenada vertical en pantallas pequeñas sin cambiar el orden de origen. Nunca requieras desplazamiento horizontal para descubrir un evento.

Hoja de ruta de estado mixto

Usa esta variante para una hoja de ruta genuina que contenga eventos completados y planificados. Cada elemento necesita un estado textual, y las fechas inciertas utilizan rangos honestos como «Q4 2026» en lugar de días inventados.

Parámetros

El contrato separa las configuraciones de la colección de los registros de eventos repetidos. El primer encabezado principal proporciona el título de la colección; el primer encabezado de cada elemento proporciona el título de su evento.

marker es visible y puede contener una fecha con la precisión que los lectores entiendan, como «Mayo 2025» o «Q3 2026». Proporciona date solo cuando la fuente respalde una fecha de calendario legible por máquina. Un marcador como «Primavera 2025» no debe convertirse en una fecha ISO inventada. En una variante por fases, marker contiene el nombre de la fase y date normalmente se omite.

Sintaxis y ejemplos de código

Las tres formas siguientes codifican la misma cronología completada. La directiva portátil es la estructura canónica de autoría; los adaptadores de plataforma deben preservar el orden, los campos y la redacción visible.

Directiva Markdown portátil

:::timeline{variant=vertical direction=ascending}
## Cronología de investigación y publicación

::item{marker="Marzo 2025" date="2025-03-01" status=completed id="research-approved"}
### Investigación aprobada

El equipo fijó la cohorte, las preguntas y el método de comparación antes de comenzar la recolección.
::

::item{marker="Abril–Mayo 2025" status=completed id="baseline-collected"}
### Línea base recopilada

Se registraron las mismas mediciones para cada participante durante la ventana definida.
::

::item{marker="Junio 2025" date="2025-06-18" status=completed id="findings-published"}
### Hallazgos publicados

El informe publicó sus resultados con métodos, limitaciones y una fecha de revisión.
::
:::

El rango «Abril–Mayo 2025» no tiene atributo date porque una sola fecha ISO tergiversaría un evento de varios meses.

Shortcode de Hugo

{{< timeline_with_icon >}}
[
  {"title":"Marzo 2025 — Investigación aprobada","description":"El equipo fijó la cohorte, las preguntas y el método de comparación antes de comenzar la recolección."},
  {"title":"Abril–Mayo 2025 — Línea base recopilada","description":"Se registraron las mismas mediciones para cada participante durante la ventana definida."},
  {"title":"Junio 2025 — Hallazgos publicados","description":"El informe publicó sus resultados con métodos, limitaciones y una fecha de revisión."}
]
{{< /timeline_with_icon >}}

El renderizador Hugo existente acepta un array JSON con campos title y description opcionales y renderiza los registros en el orden de origen. Combinar marcador y título en title es su mapeo de adaptador actual; un renderizador más rico puede separar esas regiones visibles sin cambiar el contenido canónico.

Bloque de WordPress

<!-- wp:amicited/timeline {"variant":"vertical","direction":"ascending"} -->
<!-- wp:amicited/timeline-item {"marker":"Marzo 2025","date":"2025-03-01","status":"completed","id":"research-approved"} -->
<h3>Investigación aprobada</h3>
<p>El equipo fijó la cohorte, las preguntas y el método de comparación antes de comenzar la recolección.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"Abril–Mayo 2025","status":"completed","id":"baseline-collected"} -->
<h3>Línea base recopilada</h3>
<p>Se registraron las mismas mediciones para cada participante durante la ventana definida.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"Junio 2025","date":"2025-06-18","status":"completed","id":"findings-published"} -->
<h3>Hallazgos publicados</h3>
<p>El informe publicó sus resultados con métodos, limitaciones y una fecha de revisión.</p>
<!-- /wp:amicited/timeline-item -->
<!-- /wp:amicited/timeline -->

WordPress debe almacenar los registros como un bloque principal ordenado con elementos secundarios, no como tarjetas visuales no relacionadas cuyo orden pueda desviarse durante la edición.

Ejemplos

Bueno: historial de implementación de una normativa

Enero 2024 — Norma publicada. El regulador emitió el texto final y confirmó las organizaciones dentro del alcance.

Julio 2024 — Período de transición comenzó. Las organizaciones cubiertas podían adoptar el formato de informe mientras el formato anterior seguía siendo aceptado.

Enero 2025 — Requisitos entraron en vigor. Las nuevas presentaciones debían usar el formato publicado; la opción de transición finalizó.

Abril 2025 — Guía aclarada. El regulador explicó cómo las presentaciones modificadas debían identificar el período de informe original.

Esta es una buena línea de tiempo porque cada entrada describe un evento documentado, la precisión es consistente y el orden explica el paso desde la publicación hasta la transición, la aplicación y la aclaración. Un lector puede entender las obligaciones actuales sin confundir una fecha futura con un evento pasado.

Malo: línea de tiempo de optimización de artículo

1 — Añade ejemplos. Incluye ejemplos útiles en el artículo.

2 — Revisa los encabezados. Asegúrate de que los encabezados describan cada sección.

3 — Añade enlaces internos. Enlaza a contenido relacionado.

Esto es malo porque no es ni una cronología ni un procedimiento sólido. Los números no tienen fechas ni fases, y las acciones pueden realizarse en un orden diferente sin cambiar el resultado. Llamarlo línea de tiempo decora verificaciones independientes con una secuencia falsa. Usa una lista de verificación para puntos de revisión independientes; usa una lista de pasos solo si las dependencias hacen necesario el orden de ejecución.

Marcado de esquema y accesibilidad

Schema.org no tiene un tipo general Timeline. No emitas propiedades inventadas ni añadas ItemList únicamente para que el bloque parezca estructurado. La línea de tiempo puede proporcionar hechos visibles a datos estructurados a nivel de página cuando ya existe un vocabulario apropiado —por ejemplo, una fecha de publicación de lanzamiento en una página relacionada con software—, pero ese mapeo se rige por el contrato de esquema de la página, no por el componente visual. Los datos estructurados nunca deben contener eventos, fechas o estados omitidos de la línea de tiempo visible.

La línea base confiable legible por máquina es HTML semántico: un <ol> en el orden de lectura previsto y un <li> por evento. Usa <time datetime="2025-06-18">Junio 2025</time> solo cuando la fecha de máquina esté respaldada por la fuente. Si el marcador visible es un trimestre, temporada, rango o fase nombrada, el texto plano es más veraz que un valor datetime fabricado.

La accesibilidad depende de preservar la secuencia sin depender de la pista gráfica. El encabezado nombra el tema y la dirección; la lista ordenada proporciona recuento y posición; cada evento mantiene su marcador, título, descripción y estado juntos. Las líneas decorativas, puntos e iconos utilizan alternativas vacías o están ocultos para la tecnología de asistencia. El estado se escribe como texto, no se transmite solo por verde, ámbar o un círculo relleno.

No se debe requerir interacción con el teclado para leer una línea de tiempo. Si los eventos individuales enlazan a evidencia o detalles, usa enlaces descriptivos ordinarios y un estado de enfoque visible. Los diseños horizontales deben refluir en lugar de atrapar a usuarios de teclado o táctil en un desplazador lateral. El zoom al 200%, la visualización en viewport estrecho, la salida impresa y la salida sin CSS deben conservar el mismo orden.

Reglas de escritura

Usa de tres a doce eventos en una línea de tiempo. Por debajo de tres, la prosa ordinaria o una comparación directa de antes y después es más clara. Por encima de doce, los lectores pierden la forma general; agrupa los eventos en épocas nombradas o crea líneas de tiempo separadas con alcances independientes.

Escribe cada título de evento en dos a diez palabras y su descripción en 12–60 palabras. Comienza los títulos con el cambio, no con relleno: «Los requisitos entraron en vigor» es más fuerte que «Una nueva etapa importante». Las descripciones responden qué cambió y por qué el evento es importante. Usa tiempo pasado para eventos completados, tiempo presente para un estado actual y lenguaje futuro o programado para eventos planificados.

La precisión de la fecha debe seguir la evidencia. Si la fuente solo respalda un año, publica el año. Si respalda un trimestre, no inventes el primer día del trimestre para la visualización o los metadatos. Usa un solo estilo de fecha dentro de una línea de tiempo: «18 de junio de 2025» no debe estar junto a «06/20/25», y las fechas numéricas deben evitarse cuando la interpretación regional sea ambigua.

Mantén la granularidad consistente. Una línea de tiempo que combina «Empresa fundada», seis parches semanales menores y «Alcanzó distribución internacional» otorga a los cambios rutinarios más peso visual que a los hitos estratégicos. O registra los lanzamientos de manera consistente o selecciona los hitos de manera consistente y explica la regla de selección.

Nunca pongas esto dentro de un evento:

• una instrucción de varios pasos que el lector debe ejecutar;
• una llamada a la acción promocional no relacionada;
• un testimonio utilizado como evidencia del evento;
• una advertencia esencial oculta tras una expansión;
• varios eventos independientes unidos para reducir el recuento de elementos;
• una fecha o estado que la fuente no respalde.

El tono debe ser factual, compacto y específico. Evita lenguaje celebratorio como «hito que cambia el juego» a menos que la página lo atribuya como una cita y proporcione contexto. Una línea de tiempo establece credibilidad a través de una secuencia verificable, no del entusiasmo.

Tipos de publicación que la usan

Las filas siguientes están impulsadas por el frontmatter postTypes y utilizan solo slugs de tipo de publicación registrados.

No añadas una línea de tiempo para satisfacer una plantilla de tipo de publicación cuando la página no tenga una cronología significativa. El frontmatter expresa relaciones compatibles, no un requisito de que cada instancia deba contener el elemento.

Lista de verificación de QA

Antes de la publicación, verifica todo lo siguiente:

• Cada elemento registra un evento, hito, estado o fase en lugar de instruir al lector.
• Intercambiar eventos adyacentes haría que el relato sea falso, engañoso o más difícil de entender.
• La introducción nombra el tema, el alcance y la dirección cronológica.
• La línea de tiempo contiene 3–12 elementos o documenta una decisión clara de agrupación.
• La precisión de la fecha y el estado están respaldados por una fuente; no se ha inventado ninguna fecha exacta.
• Los títulos contienen 2–10 palabras y las descripciones normalmente contienen 12–60 palabras.
• Los eventos usan un nivel consistente de granularidad y un solo estilo de fecha.
• Los registros completados, actuales, planificados, retrasados y cancelados se distinguen en texto visible.
• La fuente es una colección ordenada y la salida usa un <ol> con un <li> por evento.
• Los marcadores, títulos, descripciones y estados permanecen juntos en impresión, sin CSS y en salida de pantalla estrecha.
• Las líneas decorativas, iconos y color no contienen información que esté ausente del texto.
• Cualquier dato estructurado coincide exactamente con los eventos visibles y usa solo un vocabulario apropiado para la página.
• Los mapeos de Markdown portátil, Hugo y WordPress preservan el mismo orden y significado.
• La colocación no interrumpe evidencia, advertencias, instrucciones o la interpretación final.

FAQ

¿Cuál es la diferencia entre una línea de tiempo y una lista de pasos? Una línea de tiempo registra lo que ocurrió; una lista de pasos le dice al lector qué hacer. La prueba del observador resuelve la elección.

¿Todo elemento de una línea de tiempo necesita una fecha exacta? No. Usa el marcador más preciso que la evidencia respalde, incluyendo un mes, trimestre, año o fase nombrada.

¿Cuántos eventos debe contener una línea de tiempo? Usa de tres a doce. Agrupa historias más largas en épocas nombradas o secuencias separadas.

¿Tiene la línea de tiempo su propio tipo de Schema.org? No. Usa HTML semántico de lista ordenada y solo datos estructurados a nivel de página que coincidan verazmente con un vocabulario apropiado.

¿Puede una línea de tiempo ir de la más reciente a la más antigua? Sí, cuando el descubrimiento de lo más reciente primero es la tarea principal del lector. Etiqueta la dirección y mantenla consistente.