Carousels: avoid autoplay, provide pause, keep focus stable

Common failure modes

• It moves while you read: the content changes before you finish.
• No pause/stop: there’s no way to keep it still.
• Focus disruption: if a link/button inside a slide gets hidden, focus can vanish.
• Silent changes: screen readers may get no announcement when a slide changes.
• Motion sensitivity: continuous rotation can be distracting or nauseating.

Small, reliable checklist

• Do not autoplay by default. Make slide changes user-initiated.
• If autoplay is offered, include Pause/Stop and keep it keyboard reachable.
• Never hide the focused element. If the user is interacting, stop rotating.
• Keep focus stable (usually: focus stays on Previous/Next buttons).
• Use announcements sparingly: a polite role="status" update on user actions can help.
• Respect prefers-reduced-motion by disabling autoplay and minimizing animation.

Live demo

Open the carousel BEFORE/AFTER micro-demo