Skip to content

a11y: cluster markers unlabeled for screen readers, scroll-zoom guard has no keyboard equivalent #99

Description

@AnayDhawan

A few accessibility gaps on the interactive map, found during a design review pass:

  • Cluster markers (the pie-chart circles in src/components/map/map-view.tsx) have no aria-label describing their contents (place count, dominant types) - a screen-reader user gets an unlabeled marker with no way to know what it represents.
  • The Ctrl+scroll zoom-guard hint (ScrollZoomGuard in the same file) is purely visual/mouse-driven, with no keyboard-accessible equivalent messaging.
  • The desktop zoom-hint dismiss button (in places-map.tsx) uses a literal "x" character rather than an icon with a proper accessible label.

Most other map controls are already well-labeled (aria-label on the FAB, search, filters, chips use role="group"/aria-pressed) - these are the remaining gaps.

Suggested fix: add aria-label to cluster markers summarizing their contents (e.g. "Cluster of 11 places, mostly SAT centres"), add a text-based keyboard-accessible equivalent for the scroll-zoom guard, and swap the "x" for a proper icon button with aria-label="Dismiss".

Metadata

Metadata

Assignees

No one assigned

    Labels

    a11yAccessibility

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions