When a rider lands on a service-disruptions page, they are rarely browsing for fun. They may be standing at a stop, late for work, or trying to decide whether to leave home. The page has about ten seconds to answer the question that matters: “Does this affect me, and what should I do?”
Make the status obvious before the detail
Start with a clear label such as Active, Resolved, or Scheduled. Put the affected route, stop, area, or service at the beginning of the alert—not buried after a paragraph of background. Include a visible last-updated time when information changes frequently.
Use a predictable alert structure
- What is affected: route, stop, area, or service.
- What changed: delay, detour, closure, or altered boarding location.
- When: start time, expected duration if known, and last update.
- What riders should do: a concise action, link, or alternate option.
That structure gives riders confidence even when the underlying issue is complicated. It also gives staff a repeatable publishing pattern that is faster under pressure.
Do not make color carry the message
Color can help signal urgency, but a red card by itself is not an accessible status system. Use words, icon labels where helpful, sufficient contrast, and headings that work with a screen reader. On mobile, keep the key facts near the top and avoid forcing users through a large decorative hero before they reach current information.
A strong disruptions page feels almost boring in the best way: clear, current, and easy to scan. The visual design should serve the rider’s next decision.