Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

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

Description

In issue #6252, an aria region with the label "skip to main content" was placed around the "skip to main content" 'skiplink' which appears at the top of every docusaurus-generated page.

This was done in response to automated accessibility testing tools reporting that all page content should be contained in an aria region.

I agree that the skiplink should be contained in an aria region, but creating a dedicated aria region for the skiplink is a regression from a screen reader user's perspective.

Aria reagions are used to divide the page into multiple blocks of content in order to facilitate easy navigation between such blocks of content by screen reader users. Note that I say blocks, not single elements. If a page were cluttered with regions containing only one or two elements, the value of using aria live regions (i.e. the ability to quickly skip a lot of clutter and 'skim' the page on a high level) is quickly lost.

More importantly, superfluous regions (particularly those with long labels) contribute to information overload which is a major issue when working with a complex website using a screen reader. To understand the problem I'll quote my screen reader's speech output:

• No region: "link skip to main content"
• With region: "skip to main content region link skip to main content [line break] out of region"

In summary: this region not only doubles the number of words I have to listen to, but also introduces a line break to my "view" of the page.

Long story short:

• The dedicated region around the 'skip link' should be removed
• The skip link should be placed in the banner region

Reproducible demo

No response

Steps to reproduce

Use any docusaurus-generated page with a screen reader

Expected behavior

Skiplink is contained within the aria banner region

Actual behavior

Skiplink has a dedicated aria region, complicating navigation and causing screen readers to read a lot of superfluous information

Your environment

• Public source code:
• Public site URL:
• Docusaurus version used:
• Environment name and version (e.g. Chrome 89, Node.js 16.4):
• Operating system and version (e.g. Ubuntu 20.04.2 LTS):

Self-service

• I'd be willing to fix this bug myself.