Skip to content

USWDS - Bug: Range slider screen reader experience lacks context #5431

@mahoneycm

Description

@mahoneycm

Describe the bug

When using the range slider with a screen reader, users are left without context. Because sliders rely on context from their implementation, we should allow devs to provide additional context to for screen readers.

Steps to reproduce the bug

  1. Visit the range slider component page // This link is from USWDS - Range: Remove redundant ARIA attributes #5413 which improved screen reader functionality of the component
  2. Turn on screen reader
  3. Increase/decrease slider
  4. Listen to readouts

There currently is no way to add units of measurement to these readouts

Expected Behavior

Devs should be able to customize callouts to fit the need of their component.

Examples:

  • Percentages
  • Satisfaction rating (4 out of 5)
  • Temperature

Really any context that visual users might have, the screen reader should readout on input changes

An additional potential enhancement discussed with @amycole501 would be to also read out the position of the slider in terms of how far along the range it is.

For example, "4 out of 5 stars (80% of available range)".

Related code

No response

Screenshots

No response

System setup

No response

Additional context

No response

Code of Conduct

Metadata

Metadata

Assignees

Type

No type

Projects

Status

Done

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions