odota
Combos page can't be navigated with keyboard
Is your feature request related to a problem? Please describe. Open Dota is a robust tool that as many fans as possible should be able to use. After running an aXe scan on several pages, there are accessibility improvements that can be implemented to bring the web platform closer in line with WCAG standards.
Describe the solution you'd like In order to ensure as many Dota fans as possible can enjoy and use Open Dota, I would like to implement accessibility improvements to various parts of the web application. These include but are not limited to:
- link text that can be detected by screen readers
- ensuring pages include at least a heading level 1, and follow correct heading level progression
- form elements are associated with appropriate labels
Below are some screenshots documents some of the issues:
Home page
Matches page
Heroes page
Teams page
Explorer page
Things to note about the above screenshots:
- Some of the pages show hundreds or thousands of issues. These are largely color contrast issues in generated tables and should mostly be resolved with singular fixes to things like css classes.
- Some issues may need a larger discussion such as adding
<h1>to pages for matches, teams, etc, as this involves more user facing changes.
Describe alternatives you've considered There aren't many alternatives to a11y fixes. We should strive to make the web accessible to all users as much as possible.
Teachability, Documentation, Adoption, Migration Strategy Users with visual, auditory, and / or cognitive disabilities will be brought to a more identical user experience than those without disabilities. Documentation could possibly include some words around the a11y standards Open Dota strives for.
Migration strategy for a project like this is probably best done in a stepwise approach. Submitting smaller PRs, possibly scoped to specific pages would help with introducing improvements on a scale small enough and digestible enough where potential bugs or regressions don't fall through the cracks.
👋 Hey there, maintainers of Open Dota. I have participated in Hacktoberfest for the past couple years, and this year I wanted to dedicate PRs to helping projects improve their accessibility. With your permission, I would like to carry out the above issue through several ongoing pull requests, with the intention of continuing support past October. I would like to attach the label hacktoberfest-accepted to each PR I make.
I'm a huge Dota fan, and have been playing since it was a custom wc3 map. I've mostly followed OG, enjoyed Wings Gaming's wild TI6 run, and have recently enjoyed watching Tundra. I'm stoked that TI10 is happening this year and can't wait to watch.
Would love to hear back on this issue from any of you, and get started on some pull requests. Please feel free to assign this issue to me.
Thanks for the reply @howardchung, I'll get started. Looking forward to contributing.
This pr adds fixes in the header, footer, and homepage sponsor section without introducing any visual changes.
Future PRs will include fixes for other pages in the application.
This pr adds fixes to some of the markup so screenreaders can provide better context and navigation to assistive technology users.
This pr adds some fixes to the Combo page to help screen readers provide better context to assistive tech users.
I will probably add new issues for these specific findings, as they require relatively more significant effort to address:
- Datepicker in the explorer receives keyboard focus but isn't keyboard accessible. Only way to change the date is with a mouse or trackpad.
- Hero select on the combo page isn't keyboard accessible. Tabbing through hero portraits provides no visual feedback, and current team selections aren't currently focusable, so keyboard users can't actually remove heroes from teams without refreshing the page.