Skip to content

Demo-app accessibility follow-ups (reduced-motion + headings) #5

Description

@jonfroehlich

From the June 2026 a11y pass (which added a <main> landmark and labeled role="img" canvases to the non-serial demos). These two items were scoped out at the time.

  • prefers-reduced-motion: pause or skip the live canvas animations for users who request reduced motion. The gallery previews already honor this (poster fallback), but the live apps under src/apps/ do not. Needs a small per-app JS change (check matchMedia('(prefers-reduced-motion: reduce)') and don't start / freeze the loop).
  • Visually-hidden <h1> per demo for screen-reader heading navigation. We added landmarks + canvas labels; a heading would complete the document structure without changing the visual. Would add a shared .visually-hidden CSS utility.

Good first-issue territory — small, self-contained, one app at a time.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions