Linhas do Tempo: Como Apresentar Eventos e Fases em Ordem

Uma linha do tempo é um registro ordenado de eventos, marcos ou fases nomeadas em que a posição comunica quando algo aconteceu ou como um assunto se desenvolveu. O leitor observa a sequência; ele não está sendo instruído a reproduzi-la.

1. 1
   Março de 2025 — Pesquisa aprovada

   A equipe definiu o grupo, as perguntas e o método de comparação antes do início da coleta.
2. 2
   Abril–Maio de 2025 — Linha de base coletada

   As mesmas medidas foram registradas para cada participante durante a janela de coleta definida.
3. 3
   Junho de 2025 — Descobertas publicadas

   O relatório divulgou seus resultados com métodos, limitações e a próxima data de revisão.

Este exemplo renderizado descreve uma sequência de pesquisa concluída. Sua ordem explica a relação entre aprovação, coleta e publicação, mas nenhuma de suas entradas ordena que o leitor realize essas ações.

Por que este elemento é importante

As pessoas reconstroem mudanças fazendo três perguntas: o que aconteceu, quando aconteceu e o que causou ou possibilitou? Uma linha do tempo responde a essas perguntas em um padrão repetido. O marcador de data ou fase cria orientação, o título do evento dá nome à mudança e a descrição explica o significado. Os leitores podem procurar um marco conhecido, comparar intervalos entre eventos ou entender por que o estado atual não poderia ter existido antes.

Esse ritmo visual também reduz a carga de memória. Na prosa comum, as datas podem estar separadas dos eventos que qualificam, e o leitor precisa manter várias frases em mente antes de montar a cronologia. Uma linha do tempo delimitada mantém cada marcador ligado ao seu evento e torna visíveis omissões ou saltos inexplicados. É especialmente útil quando a afirmação do texto depende da sequência: um resultado observado após uma intervenção significa algo diferente de um resultado coletado antes dela.

A capacidade de extração por máquina é a capacidade de um rastreador, mecanismo de busca, sistema de resposta de IA ou adaptador de publicação de isolar cada registro sem perder sua ordem ou campos. Uma lista ordenada semântica com regiões consistentes de data, título e descrição dá às máquinas uma estrutura mais forte do que datas espalhadas por parágrafos. Um sistema pode identificar o terceiro evento como o terceiro evento, preservar a relação entre “Junho de 2025” e “Descobertas publicadas” e citar a descrição sem atribuí-la a Abril por engano.

Use as regras de escrita de elementos como regra de precedência. Se o propósito de um trecho é registrar mudanças ao longo do tempo, use a linha do tempo tipada mesmo que um título e vários parágrafos possam parecer semelhantes. Se o propósito é instrução, comparação ou verificação independente, o elemento correspondente tem precedência, independentemente de um designer poder desenhar uma linha vertical ao lado dele.

Quando usar

Use uma linha do tempo quando a ordenação faz parte da afirmação e cada item representa um evento, marco, transição de estado ou fase documentada. Assuntos apropriados incluem a história de uma empresa, os lançamentos de um produto, as datas de adoção e aplicação de um regulamento, as etapas de um estudo de caso concluído ou as fases de coleta e publicação por trás de um relatório.

Aplique dois testes antes de escolhê-la:

1. O teste da troca: troque duas entradas adjacentes. Se o relato se tornar historicamente falso, causalmente enganoso ou temporalmente confuso, a ordem carrega significado.
2. O teste do observador: pergunte se o leitor está aprendendo o que aconteceu ou sendo instruído sobre o que fazer. Observação indica uma linha do tempo; execução indica uma lista de etapas .

Casos próximos precisam de estruturas diferentes:

• Um procedimento: “Exporte os dados, limpe-os e depois faça o upload” instrui o leitor. Precisa de ações, sinais de sucesso e caminhos de recuperação, não descrições históricas de eventos.
• Uma lista de verificação: “Confirme proprietário, data, fonte e status” contém etapas de verificação independentes. Sua ordem não cria significado.
• Uma lista de funcionalidades: “Lançou relatórios, integrações e alertas” pode simplesmente enumerar capacidades. Torna-se uma linha do tempo apenas quando lançamentos datados e suas consequências importam.
• Uma afirmação de antes e depois: dois estados geralmente são mais claros como uma comparação direta. Não adicione um ponto intermediário decorativo para atingir um número mínimo de itens.
• Um plano de projeto: datas planejadas podem usar uma linha do tempo apenas quando claramente identificadas como agendadas ou previstas. Não apresente intenção como história concluída.
• Uma visão geral de processo: fases nomeadas podem usar uma linha do tempo quando a página descreve como um processo é organizado. Se o leitor precisar executar essas fases, use uma lista de etapas ou lista de verificação.

A presença de datas não é suficiente. Uma lista de datas de conferências não relacionadas é um calendário ou listagem. Uma linha do tempo exige um assunto e uma linha de desenvolvimento coerente.

Onde posicionar

Coloque a linha do tempo imediatamente após uma frase curta que nomeie seu assunto, escopo e direção. “Os marcos abaixo vão da constituição da empresa até o produto atual” é suficiente. Os leitores nunca devem ter que inferir se o primeiro item é o mais antigo, o mais novo, concluído ou planejado.

A posição exata depende de sua função:

• Coloque uma linha do tempo histórica após a definição do assunto ou resumo do estado atual e antes da análise de por que a história importa.
• Coloque uma linha do tempo de estudo de caso após a situação inicial e o escopo, mas antes dos resultados detalhados, para que os leitores possam distinguir linha de base, intervenção e medição.
• Coloque uma linha do tempo de lançamentos após o resumo do lançamento atual. Use a ordem do mais novo para o mais antigo quando a descoberta da alteração mais recente for a tarefa principal, e identifique essa direção.
• Coloque uma cronologia de implementação ou política após o escopo da regra e antes das obrigações atuais. As datas de vigência devem permanecer visíveis fora de qualquer interface recolhível.
• Coloque uma linha do tempo de pesquisa após o resumo do método e antes das descobertas, quando o momento da coleta afetar a interpretação.

Uma linha do tempo não pode ficar diretamente ao lado de uma lista de etapas sobre o mesmo assunto sem uma transição que indique qual bloco registra história e qual bloco instrui ação. Não pode ser inserida entre uma afirmação e sua fonte de suporte, entre um aviso e sua consequência, ou dentro de uma célula de comparação. Não coloque duas linhas do tempo consecutivas; combine-as quando compartilharem um assunto e escala, ou separe-as com uma análise que explique por que a segunda sequência é distinta.

Evite uma chamada para ação promocional entre eventos. Isso interrompe tanto o fluxo cronológico quanto a semântica de lista ordenada. Coloque a promoção após a linha do tempo completa e sua interpretação.

Anatomia

A anatomia rotulada contém sete partes:

1. Título de escopo: nomeia o assunto e o período de tempo representado pela coleção.
2. Indicador de direção: informa do mais antigo ao mais novo ou do mais novo ao mais antigo quando o contexto ao redor não o torna inequívoco.
3. Trilha ordenada: conecta visualmente os registros enquanto o <ol> subjacente preserva a ordem sem estilização.
4. Marcador de data ou fase: identifica quando o evento ocorreu, com a precisão mais honesta disponível.
5. Título do evento: informa a mudança ou marco em uma frase compacta no passado ou presente.
6. Descrição: explica o que mudou e por que este evento pertence à sequência.
7. Status: opcionalmente distingue eventos concluídos, atuais, agendados, atrasados ou cancelados em palavras, não apenas por cor.

A linha, os pontos e os ícones são decoração. As datas, títulos, descrições, ordens e status são conteúdo e devem permanecer disponíveis em texto, impressão e saída sem CSS.

Exemplos de design

Toda variante suportada preserva uma lista ordenada e os mesmos campos de item. As variantes mudam densidade ou ênfase, não significado.

Vertical padrão

Use o padrão para três a oito eventos com descrições de uma ou duas frases. Dá espaço para textos de comprimento variável e funciona de forma confiável em telas estreitas.

Registro de alterações compacto

Use espaçamento compacto para registros curtos e frequentes, como lançamentos. Os títulos lideram; as descrições ficam em uma frase. A ordem do mais novo ao mais antigo é permitida apenas quando o título ou indicador de direção assim o informa.

Ênfase em marcos

Use ênfase em marcos quando dois a seis pontos de virada importam mais do que os intervalos entre eles. Um marco atual destacado deve incluir a palavra visível “Atual”; tamanho ou cor sozinhos são insuficientes.

Linha do tempo por fases

Use fases nomeadas quando datas exatas não estão disponíveis ou são menos úteis que a posição no ciclo de vida. Os marcadores de fase devem ser mutuamente distintos e consistentemente granulares: “Descoberta”, “Coleta” e “Publicação”, não “Descoberta”, “12 de Maio” e “Depois”.

Horizontal em tela larga

Use uma apresentação horizontal apenas para três a cinco marcos breves e apenas quando se tornar uma lista ordenada vertical em telas pequenas sem alterar a ordem de origem. Nunca exija rolagem horizontal para descobrir um evento.

Roteiro de status misto

Use esta variante para um roteiro genuíno contendo eventos concluídos e planejados. Cada item precisa de um status textual, e datas incertas usam intervalos honestos como “Q4 2026” em vez de dias inventados.

Parâmetros

O contrato separa as configurações da coleção dos registros de eventos repetidos. O primeiro título pai fornece o título da coleção; o primeiro título de cada item fornece o título do seu evento.

marker é visível e pode conter uma data na precisão que os leitores entendem, como “Maio de 2025” ou “Q3 2026.” Forneça date apenas quando a fonte suportar uma data de calendário legível por máquina. Um marcador como “Primavera de 2025” não deve ser convertido em uma data ISO inventada. Em uma variante por fases, marker contém o nome da fase e date normalmente é omitido.

Sintaxe e exemplos de código

As três formas abaixo codificam a mesma cronologia concluída. A diretiva portável é a estrutura canônica de autoria; os adaptadores de plataforma devem preservar ordem, campos e redação visível.

Diretiva Markdown portável

:::timeline{variant=vertical direction=ascending}
## Linha do tempo de pesquisa e publicação

::item{marker="Março de 2025" date="2025-03-01" status=completed id="research-approved"}
### Pesquisa aprovada

A equipe definiu o grupo, as perguntas e o método de comparação antes do início da coleta.
::

::item{marker="Abril–Maio de 2025" status=completed id="baseline-collected"}
### Linha de base coletada

As mesmas medidas foram registradas para cada participante durante a janela definida.
::

::item{marker="Junho de 2025" date="2025-06-18" status=completed id="findings-published"}
### Descobertas publicadas

O relatório divulgou seus resultados com métodos, limitações e uma data de revisão.
::
:::

O intervalo “Abril–Maio de 2025” não possui atributo date porque uma única data ISO representaria incorretamente um evento de vários meses.

Shortcode Hugo

{{< timeline_with_icon >}}
[
  {"title":"Março de 2025 — Pesquisa aprovada","description":"A equipe definiu o grupo, as perguntas e o método de comparação antes do início da coleta."},
  {"title":"Abril–Maio de 2025 — Linha de base coletada","description":"As mesmas medidas foram registradas para cada participante durante a janela definida."},
  {"title":"Junho de 2025 — Descobertas publicadas","description":"O relatório divulgou seus resultados com métodos, limitações e uma data de revisão."}
]
{{< /timeline_with_icon >}}

O renderizador Hugo existente aceita um array JSON com campos title e description opcionais e renderiza os registros na ordem de origem. Combinar marcador e título em title é seu mapeamento de adaptador atual; um renderizador mais rico pode separar essas regiões visíveis sem alterar o conteúdo canônico.

Bloco WordPress

<!-- wp:amicited/timeline {"variant":"vertical","direction":"ascending"} -->
<!-- wp:amicited/timeline-item {"marker":"Março de 2025","date":"2025-03-01","status":"completed","id":"research-approved"} -->
<h3>Pesquisa aprovada</h3>
<p>A equipe definiu o grupo, as perguntas e o método de comparação antes do início da coleta.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"Abril–Maio de 2025","status":"completed","id":"baseline-collected"} -->
<h3>Linha de base coletada</h3>
<p>As mesmas medidas foram registradas para cada participante durante a janela definida.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"Junho de 2025","date":"2025-06-18","status":"completed","id":"findings-published"} -->
<h3>Descobertas publicadas</h3>
<p>O relatório divulgou seus resultados com métodos, limitações e uma data de revisão.</p>
<!-- /wp:amicited/timeline-item -->
<!-- /wp:amicited/timeline -->

O WordPress deve armazenar os registros como um bloco pai ordenado com itens filhos, não como cartões visuais não relacionados cuja ordem pode se alterar durante a edição.

Exemplos

Bom: histórico de implementação de um regulamento

Janeiro de 2024 — Regra publicada. O regulador emitiu o texto final e confirmou as organizações dentro do escopo.

Julho de 2024 — Período de transição começou. As organizações cobertas podiam adotar o formato de relatório enquanto o formato anterior permanecia aceito.

Janeiro de 2025 — Requisitos entraram em vigor. Novas submissões deviam usar o formato publicado; a opção de transição terminou.

Abril de 2025 — Orientação esclarecida. O regulador explicou como submissões alteradas deveriam identificar o período de relatório original.

Esta é uma boa linha do tempo porque cada entrada descreve um evento documentado, a precisão é consistente e a ordem explica a transição da publicação para a transição, aplicação e esclarecimento. O leitor pode entender as obrigações atuais sem confundir um prazo futuro com um evento passado.

Ruim: linha do tempo de otimização de artigo

1 — Adicione exemplos. Inclua exemplos úteis no artigo.

2 — Verifique os títulos. Certifique-se de que os títulos descrevam cada seção.

3 — Adicione links internos. Vincule a conteúdo relacionado.

Isso é ruim porque não é uma cronologia nem um procedimento sólido. Os números não têm datas ou fases, e as ações podem ser executadas em ordem diferente sem alterar o resultado. Chamar isso de linha do tempo decora verificações independentes com uma sequência falsa. Use uma lista de verificação para etapas de revisão independentes; use uma lista de etapas apenas se as dependências tornarem a ordem de execução necessária.

Marcação Schema e acessibilidade

Schema.org não tem um tipo Timeline geral. Não emita propriedades inventadas nem adicione ItemList meramente para fazer o bloco parecer estruturado. A linha do tempo pode fornecer fatos visíveis para dados estruturados no nível da página quando um vocabulário apropriado já existe — por exemplo, uma data de lançamento publicada em uma página relacionada a software — mas esse mapeamento é governado pelo contrato de schema da página, não pelo componente visual. Os dados estruturados nunca devem conter eventos, datas ou status omitidos da linha do tempo visível.

A base confiável legível por máquina é HTML semântico: um <ol> na ordem de leitura pretendida e um <li> por evento. Use <time datetime="2025-06-18">Junho de 2025</time> apenas quando a data de máquina for suportada pela fonte. Se o marcador visível for um trimestre, estação, intervalo ou fase nomeada, texto simples é mais honesto do que um valor datetime fabricado.

A acessibilidade depende de preservar a sequência sem depender da trilha gráfica. O título nomeia o assunto e a direção; a lista ordenada fornece contagem e posição; cada evento mantém seu marcador, título, descrição e status juntos. Linhas decorativas, pontos e ícones usam alternativas vazias ou são ocultados da tecnologia assistiva. O status é escrito como texto, não transmitido apenas por verde, âmbar ou um círculo preenchido.

A interação por teclado não deve ser necessária para ler uma linha do tempo. Se eventos individuais linkarem para evidências ou detalhes, use links descritivos comuns e um estado de foco visível. Layouts horizontais devem ser reorganizados em vez de prender usuários de teclado ou toque em um rolador lateral. Zoom para 200%, exibição em viewport estreita, saída para impressão e saída sem CSS devem reter a mesma ordem.

Regras de escrita

Use de três a doze eventos em uma linha do tempo. Abaixo de três, prosa comum ou uma comparação direta de antes e depois é mais clara. Acima de doze, os leitores perdem a forma geral; agrupe eventos em eras nomeadas ou crie linhas do tempo separadas com escopos independentes.

Escreva cada título de evento em duas a dez palavras e sua descrição em 12 a 60 palavras. Comece os títulos com a mudança, não com preenchimento: “Requisitos entraram em vigor” é mais forte do que “Uma nova etapa importante.” As descrições respondem o que mudou e por que o evento importa. Use o passado para eventos concluídos, o presente para um estado atual e linguagem futura ou de agendamento para eventos planejados.

A precisão da data deve seguir as evidências. Se a fonte suportar apenas um ano, publique o ano. Se suportar um trimestre, não invente o primeiro dia do trimestre para exibição ou metadados. Use um estilo de data dentro de uma linha do tempo: “18 de Junho de 2025” não deve ficar ao lado de “06/20/25,” e datas numéricas devem ser evitadas quando a interpretação regional é ambígua.

Mantenha a granularidade consistente. Uma linha do tempo que combina “Empresa fundada,” seis pequenas correções semanais e “Alcançou distribuição internacional” dá a mudanças rotineiras mais peso visual do que a marcos estratégicos. Ou registre lançamentos de forma consistente ou selecione marcos de forma consistente e declare a regra de seleção.

Nunca coloque estes itens dentro de um evento:

• uma instrução de múltiplas etapas que o leitor deve executar;
• uma chamada para ação promocional não relacionada;
• um depoimento usado como evidência para o evento;
• um aviso essencial oculto atrás de expansão;
• vários eventos independentes unidos para reduzir a contagem de itens;
• uma data ou status que a fonte não suporta.

O tom deve ser factual, compacto e específico. Evite linguagem celebrativa como “marco revolucionário,” a menos que a página o atribua como citação e forneça contexto. Uma linha do tempo estabelece credibilidade por meio de sequência verificável, não de entusiasmo.

Tipos de post que a utilizam

As linhas abaixo são determinadas pelo frontmatter postTypes e usam apenas slugs de tipo de post registrados.

Não adicione uma linha do tempo para satisfazer um template de tipo de post quando a página não possui uma cronologia significativa. O frontmatter expressa relações suportadas, não uma exigência de que toda instância deva conter o elemento.

Lista de verificação de QA

Antes da publicação, verifique todos os itens a seguir:

• Cada item registra um evento, marco, estado ou fase, em vez de instruir o leitor.
• Trocar eventos adjacentes tornaria o relato falso, enganoso ou mais difícil de entender.
• A introdução nomeia o assunto, escopo e direção cronológica.
• A linha do tempo contém 3 a 12 itens ou documenta uma decisão clara de agrupamento.
• A precisão da data e o status são suportados por uma fonte; nenhuma data exata foi inventada.
• Os títulos contêm 2 a 10 palavras e as descrições normalmente contêm 12 a 60 palavras.
• Os eventos usam um nível consistente de granularidade e um estilo de data.
• Registros concluídos, atuais, planejados, atrasados e cancelados são distinguidos em texto visível.
• A origem é uma coleção ordenada e a saída usa um <ol> com um <li> por evento.
• Marcadores, títulos, descrições e status permanecem juntos na impressão, sem CSS e em saída de tela estreita.
• Linhas decorativas, ícones e cores não carregam informações ausentes do texto.
• Quaisquer dados estruturados correspondem exatamente aos eventos visíveis e usam apenas um vocabulário apropriado para a página.
• Os mapeamentos de Markdown portável, Hugo e WordPress preservam a mesma ordem e significado.
• O posicionamento não interrompe evidências, avisos, instruções ou a interpretação final.

FAQ

Qual é a diferença entre uma linha do tempo e uma lista de etapas? Uma linha do tempo registra o que aconteceu; uma lista de etapas diz ao leitor o que fazer. O teste do observador resolve a escolha.

Todo item de uma linha do tempo precisa de uma data exata? Não. Use o marcador mais preciso que a evidência suportar, incluindo um mês, trimestre, ano ou fase nomeada.

Quantos eventos uma linha do tempo deve conter? Use de três a doze. Agrupe histórias mais longas em eras nomeadas ou sequências separadas.

Uma linha do tempo tem seu próprio tipo Schema.org? Não. Use HTML de lista ordenada semântica e apenas dados estruturados no nível da página que correspondam fielmente a um vocabulário apropriado.

Uma linha do tempo pode ir do mais novo ao mais antigo? Sim, quando a descoberta do mais recente primeiro é a principal tarefa do leitor. Identifique a direção e mantenha-a consistente.