Timeline

A component that shows a sequence of events or stages in order along a line, usually a vertical one.

Also called: timeline, time line, event feed, history, chronology, stages, order status, order tracking, package tracking, shipment tracking, track my order, year by year

What it is for

It makes a history of changes, the status of a complex process or a series of stages easy to follow. Icons and color separate events that are done, in progress, and still to come.

Where you see it

• Shipment tracking — order statuses: packed → on the way → delivered
• Project management — the change log of a task
• Company websites — the company’s history, year by year

What it is called in code

• timeline
• <ol>

See also

• Stepper — A progress indicator that breaks a long process, like filling in a long form, into a sequence of steps.
• Notification center — A place that collects system messages and events, reached through an icon, usually a bell in the header, often with an unread badge.
• Loading indicators — Anything that shows the site is busy: a progress bar, a spinning icon, or gray placeholders where content will appear.