facebook / facebook/docusaurus

Accessibility: docs sidebar: superfluous logo and <aside>

未关闭
#8,429 3 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
bug domain: a11y
主要语言
TypeScript
星标
66.2k
派生
10k
平均合并
1 天 3 小时
30 天内合并 PR
52

描述

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#reporting-new-issues).

### Prerequisites

- [X] I'm using the latest version of Docusaurus.
- [X] I have tried the `npm run clear` or `yarn clear` command.
- [X] I have tried `rm -rf node_modules yarn.lock package-lock.json` and re-installing packages.
- [X] I have tried creating a repro with https://new.docusaurus.io.
- [X] I have read the console error message carefully (if applicable).

### Description

The pseudocode of the docs sidebar (docusaurus website) is:
` [docusaurus logo with tabindex -1] ... `
The effect on the NVDA screen reader is that it reads: "complementary landmark [Docusaurus logo] docs side navigation landmark ..."

First, the logo (if it has tabindex -1 and is not visually present) should not be there, or should be aria-hidden.

Second, the aside element is superfluous. IMO the whole navigation bar incl logo and collapse button should be contained within a single `` element. Putting an additional region around it only clutters the page. Using `` for a navigational sidebar is not common and semantically dubious. Plus, the `` describes the goal of the region much more precisely than ``.

### Reproducible demo

_No response_

### Steps to reproduce

Inspect code of a docusaurus page with docs navigation sidebar

### Expected behavior

Pseudocode should be: `[logo, but only if it is visually present and focusable; aria-hidden otherwise] ... [collapse sidebar button] `

### Actual behavior

pseudocode is: ` [docusaurus logo with tabindex -1] ... [collapse sidebar button] `

### Your environment

_No response_

### Self-service

- [ ] I'd be willing to fix this bug myself.

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。