Testing Page by Ray

Option A Vertical spine

Dates in their own column, a line and dots carry the order. Looks the same on every screen.

Progress of lung cancer screening

  1. 2011–2020

    Landmark studies of lung cancer screening

    NLST (2011) and NELSON (2020) demonstrate a clear benefit of lung cancer screening.1, 2

  2. 2012–2020

    The Partnership convenes key lung screening partners

    The Partnership creates and convenes the Pan-Canadian Lung Cancer Screening Network (PLCSN) and develops the first set of indicators for lung cancer screening program quality reporting.

  3. 2017

    Screening starts

    Ontario starts lung cancer screening pilot.3

  4. 2020

    The Partnership catalyzes lung screening in Canada

    The Partnership begins funding to support lung cancer screening.

  5. 2022–2026

    Screening spreads

    Quebec, British Columbia, Alberta, Newfoundland and Labrador, Nova Scotia and Saskatchewan start lung cancer screening.3

  6. 2026

    Pre-implementation planning continues

    Manitoba, Prince Edward Island, New Brunswick and Nunavut work towards launching lung cancer screening.3

On phonesDate moves above the title, line stays on the left.
How manyAny number of milestones, long text is fine.
AccentLast milestone gets an orange dot. Optional.

Option B Horizontal track

Left to right in one row. Shortest on the page, but six columns leave about 160px each, so text must stay short.

Progress of lung cancer screening

2011–2020

Landmark studies of lung cancer screening

NLST (2011) and NELSON (2020) demonstrate a clear benefit of lung cancer screening.1, 2

2012–2020

The Partnership convenes key lung screening partners

The Partnership creates and convenes the Pan-Canadian Lung Cancer Screening Network (PLCSN) and develops the first set of indicators for lung cancer screening program quality reporting.

2017

Screening starts

Ontario starts lung cancer screening pilot.3

2020

The Partnership catalyzes lung screening in Canada

The Partnership begins funding to support lung cancer screening.

2022–2026

Screening spreads

Quebec, British Columbia, Alberta, Newfoundland and Labrador, Nova Scotia and Saskatchewan start lung cancer screening.3

2026

Pre-implementation planning continues

Manitoba, Prince Edward Island, New Brunswick and Nunavut work towards launching lung cancer screening.3

On phonesBecomes a vertical list, same as Option A.
How manySix is the practical maximum in one row.
WatchLong text wraps to many lines in a narrow column.

Option C Cards on the gradient band

Uses the annual report band and orange rule, so this report and the annual report share one look. Cards alternate left and right.

Progress of lung cancer screening

  1. 2011–2020

    Landmark studies of lung cancer screening

    NLST (2011) and NELSON (2020) demonstrate a clear benefit of lung cancer screening.1, 2

  2. 2012–2020

    The Partnership convenes key lung screening partners

    The Partnership creates and convenes the Pan-Canadian Lung Cancer Screening Network (PLCSN) and develops the first set of indicators for lung cancer screening program quality reporting.

  3. 2017

    Screening starts

    Ontario starts lung cancer screening pilot.3

  4. 2020

    The Partnership catalyzes lung screening in Canada

    The Partnership begins funding to support lung cancer screening.

  5. 2022–2026

    Screening spreads

    Quebec, British Columbia, Alberta, Newfoundland and Labrador, Nova Scotia and Saskatchewan start lung cancer screening.3

  6. 2026

    Pre-implementation planning continues

    Manitoba, Prince Edward Island, New Brunswick and Nunavut work towards launching lung cancer screening.3

On phonesAll cards move to one side of the spine.
How manyAny number, each card adds height.
OptionalCorner line animation and colour presets like the highlight banner.

Side by side

A · Vertical spineB · Horizontal trackC · Cards on band
Reads at a glanceGoodBestGood
Long textComfortableTight, 2–3 linesComfortable
Page heightMediumShortestTallest
PhoneSame layoutBecomes a listCards on one side
Matches annual reportNeutralNeutralYes

Editors fill in the same fields for all three: a heading, then date, title and text for each milestone. The option only changes the look.