Add accessibility/WCAG2/ARIA support
ttaranov opened this issue · 10 comments
Reproduction link
https://escvxj.run.stackblitz.io/
Steps to reproduce
almost all components documented on https://ng.ant.design/components/form/en have web accessibility issues, according to WCAG and ARIA standards:
https://www.w3.org/TR/WCAG21/
https://www.w3.org/TR/wai-aria-1.1/
What is expected?
- add appropriate aria-* roles defined and managed appropriately on actions (e.g. on drop down expand/collapse),
- input items should should have labels (or aria labels)
- keyboard navigation support
- WCAG 2.0 color schemes
What is actually happening?
all required ARIA roles and labels are missing, keyboard and navigation support could be improved
| Environment | Info |
|---|---|
| ng-zorro-antd | 8.5.2 |
| Browser | any |
Support of a11y is listed in our milestone #3667. We would like any help from the community. ❤️
Hello @ttaranov. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please fill the Pull Request Template here, provide documentation/test cases if needed and make sure CI passed, we will review it soon. Appreciate it advance and we are looking forward to your contribution!
你好 @ttaranov, 我们完全同意你的提议/反馈，欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请务必填写 Pull Request 内的预设模板，提供改动所需相应的测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献！
@ttaranov @wendellhu95 How much of this should be handled by Ng-Zorro and how much should be handle by the consumer?
Is it an issue specific to the docs? Consumers can add aria labels to their inputs and adjust their themes. I imagine some aria attributes are harder for the consumer to specify.
@krokofant The React version could be a good reference. They already have aria-* supported.
would really love this to be implemented. Also focus trap on submenus.
The above PR is stale and probably won't get any updates. If someone want's to pick it up it's encouraged.
It should be a priority nowadays to ensure a11y support in such a popular UI lib. The "accessible website" became standard and choosing between e.g. Angular Material or AntD is so much harder (with a huge advantage of Material) in case of lack of basic A11Y support in very good and complex components you've created. Please add support (or enhance/fix) for nzSelect, nzDropdown and other components to become THE BEST in Angular UI Lib World :) It's really tough to fix each component in ANTD lib with directive, working as "overlay" to deliver aria-attributes and required keyboard support.
+1
+1
@wzhudev last time I worked with NG-ZORRO was back in early 2020, when it seemed like major contributors were from Alibaba.
Looking at the commits/PRs it seems the organization structure has changed a bit, is it correct? Or do you still maintain the role you had back then? I'm asking so that I can figure out how to approach the library, and if I have to allocate time for contributions - in case there isn't a lot of activity.