Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Material Carousel a11y improvements #4237

Open
StephDriver opened this issue Jun 3, 2024 · 3 comments
Open

Material Carousel a11y improvements #4237

StephDriver opened this issue Jun 3, 2024 · 3 comments
Labels
a11y Issues that relate to acessibility

Comments

@StephDriver
Copy link
Contributor

From #4194 Sample 5.2 on a Material theme homepage:

Carousel not identified as such. Navigating by heading gets to visible item on carousel, as an H2. But as this is a carousel, this keeps changing making it awkward when navigating past it, then back to find previous heading has changed.

@StephDriver StephDriver added the a11y Issues that relate to acessibility label Jun 3, 2024
@StephDriver StephDriver moved this to Debate in Accessibility Jun 4, 2024
@joemull
Copy link
Member

joemull commented Jun 7, 2024

We think we should move all themes to an accessible, ES6-based carousel tool like glide.js, which we used for Hourglass.

@joemull joemull moved this from Debate to Sent to Dev in Accessibility Jun 7, 2024
@StephDriver
Copy link
Contributor Author

When updating this, consider WCAG 2.1 Keyboard Accessible and WCAG 2.2 Enough Time. Neither are currently supported by the carousel.

@StephDriver
Copy link
Contributor Author

adding that this can also be a particular annoyance when there is only one image - as the carousel still moves, and the page background shows for a split second. If the image is has a lot of black background, and the page is white, this makes it 'flash' between the two extremes. The carousel doesn't move fast enough for this to contravene the 3 flash in a second threshold, but it does move swiftly enough for this to be visually uncomfortable.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y Issues that relate to acessibility
Projects
Status: Sent to Dev
Development

No branches or pull requests

2 participants