facebook / docusaurus

Easy to maintain open source documentation websites.
https://docusaurus.io
MIT License
56.63k stars 8.51k forks source link

Admonitions make the Heading hierarchy inconsistent #7344

Closed peirstom closed 2 years ago

peirstom commented 2 years ago

Have you read the Contributing Guidelines on issues?

Motivation

A accessibility review was done by one of our customers and found the following:

The content of a page is structured by headings, among other things. To make this accessible to blind users, for example, HTML heading elements and their correct level hierarchy are an important prerequisite.

In a content document, the headings "Note" are always marked with level 5, although they partly follow headings of levels 1, 2 and 3. I would propose to not even use a Heading element for admonitions.

      <div className="admonition-heading">
        <h5>
          <span className="admonition-icon">{icon}</span>
          {title}
        </h5>
      </div>
      <div className="admonition-content">{children}</div>
    </div>

image

Self-service

Josh-Cena commented 2 years ago

We're aware of this. Our own lighthouse report doesn't reach 100 a11y because of this. (e.g. https://github.com/facebook/docusaurus/pull/7334#issuecomment-1118187475)

However, this admonition is created by an external plugin, which is pretty much dead now. (https://github.com/elviswolcott/remark-admonitions/issues/26)

If we are to fix it, we will need to fork the dependency. Tracked in #6246. However, we have some complications around setting up our fork storage organization (@docusaurus).

Would you be okay if I close this, since it's basically unactionable on our side, and we are fully aware of this problem for over a year now?