Gradient selector and color links lack ARIA labels
- Dominant language
- JavaScript
- Stars
- 259
- Forks
- 67
- PR merge metrics
- No merged PRs in 30d
Description
We recently worked with the Inclusive Design Research Centre to conduct an accessibility audit on our WordPress-based software backend (for [Pressbooks](https://pressbooks.org/)). In the course of that audit, the auditor indicated that the content of the color picker is not communicated to users of assistive technologies. For example, the selector within the gradient is communicated as `link,` and the various colors (black, white, red, etc.) are announced as `group`.

Our auditors indicated that this can be fixed by adding [an ARIA label](https://www.w3.org/TR/WCAG20-TECHS/ARIA6.html) to each color so that it says something other than 'group' (i.e. the color's name or hex value).
Contributor guide
No contributing guide indexed for this repository
Research direction
No file or test is named in the issue. Start by locating the gradient color-picker implementation and inspect how its selector and color entries are exposed to assistive technologies. Done means the selector and each color announce a meaningful color name or hex value instead of “link” or “group”.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100