Tidslinjer: Så presenterar du händelser och faser i ordning

En tidslinje är en ordnad registrering av händelser, milstolpar eller namngivna faser där placeringen förmedlar när något hände eller hur ett ämne utvecklades. Läsaren observerar sekvensen; de instrueras inte att återskapa den.

1. 1
   March 2025 — Research approved

   The team fixed the cohort, questions, and comparison method before collection began.
2. 2
   April–May 2025 — Baseline collected

   The same measures were recorded for every participant during the defined collection window.
3. 3
   June 2025 — Findings published

   The report released its results with methods, limitations, and the next review date.

Detta renderade exempel beskriver en slutförd forskningssekvens. Dess ordning förklarar relationen mellan godkännande, insamling och publicering, men ingen av posterna uppmanar läsaren att utföra dessa handlingar.

Varför detta element är viktigt

Människor rekonstruerar förändring genom att ställa tre frågor: vad hände, när hände det, och vad orsakade eller möjliggjorde det? En tidslinje besvarar dessa frågor i ett upprepat mönster. Datum- eller fasmarkören skapar orientering, händelsetiteln ger förändringen ett namn och beskrivningen förklarar betydelsen. Läsare kan söka efter en känd milstolpe, jämföra avstånd mellan händelser eller förstå varför det nuvarande tillståndet inte kunde ha funnits tidigare.

Den visuella rytmen minskar även minnesbelastningen. I vanlig prosa kan datum skiljas från de händelser de kvalificerar, och en läsare måste hålla flera meningar i minnet innan kronologin kan sammanställas. En avgränsad tidslinje håller varje markör kopplad till sin händelse och gör utelämnanden eller oförklarade hopp synliga. Den är särskilt användbar när textens påstående beror på sekvens: ett resultat som observerats efter en intervention betyder något annat än ett resultat som samlats in före den.

Maskinellt utdragbarhet är förmågan hos en crawler, sökmotor, AI-svarssystem eller publiceringsadapter att isolera varje post utan att förlora dess ordning eller fält. En semantisk ordnad lista med konsekventa datum-, titel- och beskrivningsområden ger maskiner en starkare struktur än datum utspridda över stycken. Ett system kan identifiera den tredje händelsen som den tredje händelsen, bevara relationen mellan “June 2025” och “Findings published” och citera beskrivningen utan att av misstag koppla den till April.

Använd skrivreglerna för element som prioritetsregel. Om ett avsnitts syfte är att registrera förändring över tid, använd den typade tidslinjen även om en rubrik och flera stycken skulle kunna se liknande ut. Om syftet är instruktion, jämförelse eller oberoende verifiering har motsvarande element företräde, oavsett om en designer skulle kunna rita en vertikal linje bredvid det.

När du ska använda det

Använd en tidslinje när ordningen är en del av påståendet och varje objekt representerar en händelse, milstolpe, tillståndsövergång eller dokumenterad fas. Lämpliga ämnen inkluderar ett företags historia, en produkts releaser, en reglerings antagande- och efterlevnadsdatum, stegen i en slutförd fallstudie eller insamlings- och publiceringsfaserna bakom en rapport.

Tillämpa två tester innan du väljer det:

1. Bytestestet: byt plats på två intilliggande poster. Om redogörelsen blir historiskt falsk, orsaksmässigt missvisande eller tidsmässigt förvirrande bär ordningen mening.
2. Observatörstestet: fråga om läsaren lär sig vad som hände eller får veta vad den ska göra. Observation indikerar en tidslinje; utförande indikerar en steglista .

Nära nog kräver andra strukturer:

• En procedur: “Exportera data, rensa den, ladda sedan upp den” instruerar läsaren. Den behöver åtgärder, framgångssignaler och återhämtningsvägar, inte historiska händelsebeskrivningar.
• En checklista: “Bekräfta ägare, datum, källa och status” innehåller oberoende verifieringsgrindar. Deras ordning skapar inte mening.
• En funktionslista: “Lanserade rapportering, integrationer och aviseringar” kan helt enkelt räkna upp funktioner. Det blir en tidslinje först när daterade releaser och deras konsekvenser spelar roll.
• Ett före-och-efter-påstående: två tillstånd är oftast tydligare som en direkt jämförelse. Lägg inte till en dekorativ mittpunkt för att nå ett minsta antal poster.
• En projektplan: planerade datum kan använda en tidslinje endast när de tydligt är märkta som schemalagda eller prognostiserade. Presentera inte avsikt som slutförd historia.
• En processöversikt: namngivna faser kan använda en tidslinje när sidan beskriver hur en process är organiserad. Om läsaren måste utföra dessa faser, använd en steglista eller checklista istället.

Förekomsten av datum är inte tillräcklig. En lista med orelaterade konferensdatum är en kalender eller förteckning. En tidslinje kräver ett ämne och en sammanhängande utvecklingslinje.

Var du ska placera den

Placera tidslinjen omedelbart efter en kort mening som anger dess ämne, omfattning och riktning. “Milstolparna nedan går från bolagsbildning till den nuvarande produkten” är tillräckligt. Läsare ska aldrig behöva gissa om det första objektet är äldst, nyast, slutfört eller planerat.

Exakt position beror på dess uppgift:

• Placera en historisk tidslinje efter ämnets definition eller sammanfattning av nuvarande tillstånd och före analys av varför historien har betydelse.
• Placera en fallstudietidslinje efter utgångssituationen och omfattningen, men före detaljerade resultat, så att läsare kan skilja mellan baslinje, intervention och mätning.
• Placera en releasetidslinje efter den aktu releasesammanfattningen. Använd nyast-först-ordning när upptäckt av den senaste förändringen är den primära uppgiften, och märk den riktningen.
• Placera en implementerings- eller policykronologi efter regelns omfattning och före nuvarande skyldigheter. Ikraftträdandedatum måste förbli synliga utanför ett utfällbart gränssnitt.
• Placera en forskningstidslinje efter metodbeskrivningen och före resultat när insamlingstidpunkt påverkar tolkningen.

En tidslinje får inte placeras direkt bredvid en steglista om samma ämne utan en övergång som anger vilket block som registrerar historia och vilket block som instruerar handling. Den får inte placeras mellan ett påstående och dess stödjande källa, mellan en varning och dess konsekvens, eller inuti en jämförelsecell. Placera inte två tidslinjer efter varandra; kombinera dem när de delar ämne och skala, eller separera dem med analys som förklarar varför den andra sekvensen är distinkt.

Undvik en säljande uppmaning till handling mellan händelser. Den bryter både det kronologiska flödet och den ordnade listans semantik. Placera marknadsföring efter den fullständiga tidslinjen och dess tolkning.

Anatomi

Den märkta anatomin består av sju delar:

1. Omfattningsrubrik: namnger ämnet och den tidsperiod som samlingen representerar.
2. Riktningssignal: anger äldst-till-nyast eller nyast-till-äldst när omgivande sammanhang inte gör det uppenbart.
3. Ordnat spår: sammanbinder poster visuellt medan den underliggande <ol> bevarar ordningen utan formgivning.
4. Datum- eller fasmarkör: identifierar när händelsen inträffade, med den mest ärliga tillgängliga precisionen.
5. Händelsetitel: anger förändringen eller milstolpen i en kompakt fras i dåtid eller nutid.
6. Beskrivning: förklarar vad som förändrades och varför denna händelse hör hemma i sekvensen.
7. Status: skiljer valfritt mellan slutförda, aktuella, schemalagda, försenade eller inställda händelser i ord snarare än enbart med färg.

Linjen, punkterna och ikonerna är dekorativa. Datumen, titlarna, beskrivningarna, ordningen och statusarna är innehåll och måste vara tillgängliga i text, utskrift och utdata utan CSS.

Designexempel

Varje variant som stöds bevarar en ordnad lista och samma objektfält. Varianter ändrar täthet eller betoning, inte betydelse.

Standard vertikal

Använd standardvarianten för tre till åtta händelser med en- eller tvåmeningars beskrivningar. Den ger text med varierande längd utrymme att brytas och fungerar tillförlitligt på smala skärmar.

Kompakt ändringslogg

Använd kompakt avstånd för korta, frekventa poster som releaser. Titlar leder; beskrivningar hålls till en mening. Nyast-först-ordning är tillåten endast när rubriken eller riktningssignalen anger det.

Milstolpebetoning

Använd milstolpebetoning när två till sex vändpunkter är viktigare än intervallen mellan dem. En markerad aktuell milstolpe måste innehålla det synliga ordet “Aktuell”; storlek eller färg ensamt är otillräckligt.

Fasad tidslinje

Använd namngivna faser när exakta datum inte är tillgängliga eller mindre användbara än livscykelposition. Fasmarkörer måste vara ömsesidigt distinkta och konsekvent granulära: “Upptäckt”, “Insamling” och “Publicering”, inte “Upptäckt”, “12 maj” och “Senare”.

Horisontell bredskärm

Använd en horisontell presentation endast för tre till fem korta milstolpar och endast när den blir en vertikal ordnad lista på små skärmar utan att källordningen ändras. Kräv aldrig horisontell scrollning för att upptäcka en händelse.

Vägkarta med blandad status

Använd denna variant för en verklig vägkarta som innehåller både slutförda och planerade händelser. Varje objekt behöver en textuell status, och osäkra datum använder ärliga intervall som “Q4 2026” snarare än påhittade dagar.

Parametrar

Kontraktet separerar samlingsinställningar från upprepade händelseposter. Den första överordnade rubriken anger samlingstiteln; varje objekts första rubrik anger dess händelsetitel.

marker är synlig och kan innehålla ett datum med den precision läsare förstår, som “May 2025” eller “Q3 2026.” Ange date endast när källan stöder ett maskinläsbart kalenderdatum. En markör som “Spring 2025” får inte omvandlas till ett påhittat ISO-datum. I en fasvariant innehåller marker fasnamnet och date utelämnas normalt.

Syntax och kodexempel

Alla tre formerna nedan kodar samma slutförda kronologi. Det portabla direktivet är den kanoniska författarstrukturen; plattformsadaptrar måste bevara ordning, fält och synlig formulering.

Portabelt Markdown-direktiv

:::timeline{variant=vertical direction=ascending}
## Forsknings- och publiceringstidslinje

::item{marker="March 2025" date="2025-03-01" status=completed id="research-approved"}
### Forskning godkänd

Teamet fastställde kohort, frågor och jämförelsemetod innan insamlingen påbörjades.
::

::item{marker="April–May 2025" status=completed id="baseline-collected"}
### Baslinje insamlad

Samma mått registrerades för varje deltagare under den definierade insamlingsperioden.
::

::item{marker="June 2025" date="2025-06-18" status=completed id="findings-published"}
### Resultat publicerade

Rapporten släppte sina resultat med metoder, begränsningar och ett granskningsdatum.
::
:::

Omfånget “April–May 2025” har inget date-attribut eftersom ett ISO-datum skulle feltolka en flermånadershändelse.

Hugo shortcode

{{< timeline_with_icon >}}
[
  {"title":"March 2025 — Research approved","description":"The team fixed the cohort, questions, and comparison method before collection began."},
  {"title":"April–May 2025 — Baseline collected","description":"The same measures were recorded for every participant during the defined window."},
  {"title":"June 2025 — Findings published","description":"The report released its results with methods, limitations, and a review date."}
]
{{< /timeline_with_icon >}}

Den befintliga Hugo-renderaren accepterar en JSON-array med title och valfri description och renderar posterna i källordning. Kombinationen av markör och titel i title är dess nuvarande adaptermappning; en rikare renderare kan separera dessa synliga områden utan att ändra det kanoniska innehållet.

WordPress-block

<!-- wp:amicited/timeline {"variant":"vertical","direction":"ascending"} -->
<!-- wp:amicited/timeline-item {"marker":"March 2025","date":"2025-03-01","status":"completed","id":"research-approved"} -->
<h3>Forskning godkänd</h3>
<p>Teamet fastställde kohort, frågor och jämförelsemetod innan insamlingen påbörjades.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"April–May 2025","status":"completed","id":"baseline-collected"} -->
<h3>Baslinje insamlad</h3>
<p>Samma mått registrerades för varje deltagare under den definierade insamlingsperioden.</p>
<!-- /wp:amicited/timeline-item -->
<!-- wp:amicited/timeline-item {"marker":"June 2025","date":"2025-06-18","status":"completed","id":"findings-published"} -->
<h3>Resultat publicerade</h3>
<p>Rapporten släppte sina resultat med metoder, begränsningar och ett granskningsdatum.</p>
<!-- /wp:amicited/timeline-item -->
<!-- /wp:amicited/timeline -->

WordPress måste lagra posterna som ett ordnat överordnat block med underordnade objekt, inte som orelaterade visuella kort vars ordning kan ändras under redigering.

Exempel

Bra: en reglerings implementeringshistorik

Januari 2024 — Regel publicerad. Regulatorn utfärdade den slutliga texten och bekräftade vilka organisationer som omfattades.

Juli 2024 — Övergångsperiod inleddes. Berörda organisationer kunde använda rapportformatet medan det tidigare formatet fortfarande accepterades.

Januari 2025 — Krav trädde i kraft. Nya inskickningar måste använda det publicerade formatet; övergångsalternativet upphörde.

April 2025 — Vägledning förtydligades. Regulatorn förklarade hur ändrade inskickningar skulle identifiera den ursprungliga rapporteringsperioden.

Detta är en bra tidslinje eftersom varje post beskriver en dokumenterad händelse, precisionen är konsekvent och ordningen förklarar övergången från publicering till övergång, efterlevnad och förtydligande. En läsare kan förstå nuvarande skyldigheter utan att missta en framtida deadline för en tidigare händelse.

Dålig: en artikeloptimerings-tidslinje

1 — Lägg till exempel. Inkludera användbara exempel i artikeln.

2 — Kontrollera rubriker. Se till att rubriker beskriver varje avsnitt.

3 — Lägg till interna länkar. Länka till relaterat innehåll.

Detta är dåligt eftersom det varken är en kronologi eller en sund procedur. Siffrorna har inga datum eller faser, och åtgärderna kan utföras i en annan ordning utan att resultatet ändras. Att kalla det en tidslinje dekorerar oberoende kontroller med falsk sekvens. Använd en checklista för oberoende granskningsgrindar; använd en steglista endast om beroenden gör exekveringsordning nödvändig.

Schema-markup och tillgänglighet

Schema.org har ingen allmän Timeline-typ. Använd inte påhittade egenskaper eller lägg till ItemList enbart för att få blocket att se strukturerat ut. Tidslinjen kan tillhandahålla synliga fakta till strukturerad data på sidnivå när en lämplig vokabulär redan finns – till exempel ett publicerat releasedatum på en mjukvarurelaterad sida – men den mappningen styrs av sidans schemakontrakt, inte av den visuella komponenten. Strukturerad data får aldrig innehålla händelser, datum eller statusar som utelämnats från den synliga tidslinjen.

Den tillförlitliga maskinläsbara baslinjen är semantisk HTML: en <ol> i avsedd läseordning och en <li> per händelse. Använd <time datetime="2025-06-18">June 2025</time> endast när maskindatumet stöds av källan. Om den synliga markören är ett kvartal, säsong, intervall eller namngiven fas, är vanlig text sanningsenligare än ett fabricerat datetime-värde.

Tillgänglighet beror på att sekvensen bevaras utan att förlita sig på det grafiska spåret. Rubriken anger ämne och riktning; den ordnade listan anger antal och position; varje händelse håller sin markör, titel, beskrivning och status samlade. Dekorativa linjer, punkter och ikoner använder tomma alternativ eller döljs för hjälpmedelsteknik. Status skrivs som text, inte förmedlas enbart av grönt, bärnsten eller en ifylld cirkel.

Tangentbordsinteraktion bör inte krävas för att läsa en tidslinje. Om enskilda händelser länkar till bevis eller detaljer, använd vanliga beskrivande länkar och ett synligt fokustillstånd. Horisontella layouter måste flöda om istället för att låsa tangentbords- eller pekanvändare i en sidledsrullning. Zoom till 200%, smal visningsport, utskriftsutdata och utdata utan CSS måste behålla samma ordning.

Skrivregler

Använd tre till tolv händelser i en tidslinje. Under tre är vanlig prosa eller en direkt före-och-efter-jämförelse tydligare. Över tolv förlorar läsarna den övergripande formen; gruppera händelser i namngivna epoker eller skapa separata tidslinjer med oberoende omfattning.

Skriv varje händelsetitel med två till tio ord och dess beskrivning med 12–60 ord. Börja titlar med förändringen, inte utfyllnad: “Krav trädde i kraft” är starkare än “En viktig ny fas.” Beskrivningar svarar på vad som förändrades och varför händelsen spelar roll. Använd dåtid för slutförda händelser, nutid för ett aktuellt tillstånd och framtida eller schemalagt språk för planerade händelser.

Datumprecision måste följa bevisen. Om källan endast stöder ett år, publicera året. Om den stöder ett kvartal, hitta inte på kvartalets första dag för visning eller metadata. Använd en datumstil inom en tidslinje: “18 June 2025” får inte stå bredvid “06/20/25,” och numeriska datum bör undvikas när regional tolkning är tvetydig.

Håll granulariteten konsekvent. En tidslinje som kombinerar “Företag grundat,” sex mindre veckovisa patchar och “Nådde internationell distribution” ger rutinförändringar mer visuell tyngd än strategiska milstolpar. Antingen registrera releaser konsekvent eller välj milstolpar konsekvent och ange urvalsregeln.

Placera aldrig dessa inuti en händelse:

• en flerstegsinstruktion som läsaren måste utföra;
• en orelaterad säljande uppmaning till handling;
• ett vittnesmål som används som bevis för händelsen;
• en väsentlig varning gömd bakom utfällning;
• flera oberoende händelser sammanslagna för att minska antalet poster;
• ett datum eller en status som källan inte stöder.

Ton bör vara saklig, kompakt och specifik. Undvik festligt språk som “banbrytande milstolpe” om inte sidan tillskriver det som ett citat och ger sammanhang. En tidslinje etablerar trovärdighet genom verifierbar sekvens, inte entusiasm.

Posttyper som använder det

Tabellerna nedan styrs av postTypes frontmatter och använder endast registrerade posttyps-slogans.

Lägg inte till en tidslinje för att uppfylla en posttypsmall när sidan saknar en meningsfull kronologi. Frontmatter uttrycker stödda relationer, inte ett krav på att varje instans måste innehålla elementet.

QA-checklista

Före publicering, verifiera allt följande:

• Varje post registrerar en händelse, milstolpe, tillstånd eller fas snarare än att instruera läsaren.
• Att byta plats på intilliggande händelser skulle göra redogörelsen falsk, missvisande eller svårare att förstå.
• Introduktionen anger ämne, omfattning och kronologisk riktning.
• Tidslinjen innehåller 3–12 poster eller dokumenterar ett tydligt grupperingsbeslut.
• Datumprecision och status stöds av en källa; inget exakt datum har hittats på.
• Titlar innehåller 2–10 ord och beskrivningar normalt 12–60 ord.
• Händelser använder en konsekvent granularitetsnivå och en datumstil.
• Slutförda, aktuella, planerade, försenade och inställda poster särskiljs i synlig text.
• Källan är en ordnad samling och utdata använder en <ol> med en <li> per händelse.
• Markörer, titlar, beskrivningar och statusar hålls samlade i utskrift, utdata utan CSS och smal skärm.
• Dekorativa linjer, ikoner och färg bär ingen information som saknas i texten.
• Eventuell strukturerad data matchar synliga händelser exakt och använder endast en sidlämplig vokabulär.
• Portabel Markdown-, Hugo- och WordPress-mappning bevarar samma ordning och betydelse.
• Placering avbryter inte bevis, varningar, instruktioner eller den slutliga tolkningen.

FAQ

Vad är skillnaden mellan en tidslinje och en steglista? En tidslinje registrerar vad som hände; en steglista säger åt läsaren vad den ska göra. Observatörstestet avgör valet.

Måste varje tidslinjeobjekt ha ett exakt datum? Nej. Använd den mest exakta markören som bevisen stöder, inklusive en månad, kvartal, år eller namngiven fas.

Hur många händelser bör en tidslinje innehålla? Använd tre till tolv. Gruppera längre historier i namngivna epoker eller separata sekvenser.

Har en tidslinje en egen Schema.org-typ? Nej. Använd semantisk ordnad HTML-lista och endast strukturerad data på sidnivå som sanningsenligt matchar en lämplig vokabulär.

Kan en tidslinje gå från nyast till äldst? Ja, när senast-först-upptäckt är läsarens huvuduppgift. Märk riktningen och håll den konsekvent.