diplodoc-platform / diplodoc-platform/cli

Minor accessibility issues: lack of text labels and required roles

Open
#479 0 comments 0 reactions 0 assignees View on GitHub
a11y enhancement good first issue help wanted
Dominant language
TypeScript
Stars
123
Forks
51
Avg merge
10h 50m
Merged PRs (30d)
38

Description

Hi! Thanks so much for this easy-to-use and functional documentation tool!

I have noticed several issues that may make it difficult for blind users of screen readers, such as NVDA for Windows or VoiceOver on iOS/macOS, to read the documentation.

1. There are no text labels and `aria-expanded` attributes on the buttons for showing/hiding the table of contents and opening display options (in the header). It's necessary to add clear text labels (by using `aria-label`, for example), as well as the `aria-expanded` attribute, which should change its value depending on the state of the button.
2. In the table of contents, the subsections that expand by click do not have the "button" role and are not focused using Tab. It is necessary to add to such elements (to the corresponding divs) `role="button"` and `tabindex="0"`, or use the native tag ``. It would also be great to add `aria-expanded` changing the value.
3. It would also be great if the section that the user is currently reading would not only be highlighted in the table of contents, but also reported by the screen reader as the current one. To do this, add the attribute `aria-current="true"` to the section of the table of contents that is currently open.

I hope this can be implemented soon - it seems the fixes are very simple. Thanks again!

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.