facebook / facebook/docusaurus

Accessibility: docs sidebar: superfluous logo and <aside>

オープン
#8,429 コメント 3 件 リアクション 0 件 担当者 0 名 GitHub で見る
bug domain: a11y
主要言語
TypeScript
スター
66.2k
フォーク
10k
平均マージ
1日 3時間
マージ済み PR(30日)
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 を短くまとめたダイジェスト。