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

Component accessibility #8

Closed
jer3m01 opened this issue May 8, 2024 · 1 comment
Closed

Component accessibility #8

jer3m01 opened this issue May 8, 2024 · 1 comment

Comments

@jer3m01
Copy link
Contributor

jer3m01 commented May 8, 2024

When navigating using keyboard only in clear, you can't tell where the focus is.

Every interact-able component (including scrollable lists) should have a :focus of :focus-visible style, either the same as :hover or something obvious (like an outline).

Clickable images (or anything) should be wrapped inside a button, not a div with onClick.

In addition, every dynamic component should optimally have WAI-ARIA roles and signals (or use native elements). This include: modals, toggles (or switch), toasts, buttons, collapsible, context menus.
For these components I'd recommend building on top of https://kobalte.dev. Otherwise the patterns are documented here https://www.w3.org/WAI/ARIA/apg/patterns

@adithyasource
Copy link
Owner

Tabbing around is now possible after bde50cb and I've brought in more improvements to it in 0f0cb19, (mainly the ability to use arrow keys to emulate the scroll wheel for selecting different images in NewGame)

Basically, everything can now be done with just the keyboard and it's a great improvement for usability, thanks to your suggestion! Most components follow the WAI-ARIA spec now and I'm quite satisfied with where it is, but I still feel it'll require improvements in the future, so I'll be mentioning this issue whenever that happens.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants