Summary of Axe accessibility issues

[gabalafou]

If you run the accessibility checks right now:

nox -s a11y

It opens several pages and runs the Axe checker against them to find accessibility issues. There are many test failures, but only several root causes.

This issue groups the failures and links to issues to fix them. Note that some of the issues exist outside this repo (in dependencies).

---

• [ ] color-contrast - Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds Root cause: insufficiently strong color palette for the a11y-light Accessible Pygments theme Related GitHub issue: https://github.com/Quansight-Labs/accessible-pygments/issues/30 Pages where this shows up:
  • /examples/kitchen-sink/blocks.html (light theme)
  • /examples/pydata.html (light theme)
  • /user_guide/theme-elements.html (light theme)
  • /user_guide/styling.html (light theme)

---

• [ ] scrollable-region-focusable - Ensure elements that have scrollable content are accessible by keyboard Root cause: tabindex=0 not set by Sphinx on code blocks Related GitHub issue: https://github.com/pydata/pydata-sphinx-theme/issues/1100 Pages where this shows up:
  • /examples/kitchen-sink/api.html
  • /examples/kitchen-sink/blocks.html
  • /examples/kitchen-sink/lists.html
  • /examples/pydata.html
  • /user_guide/styling.html

---

• [x] duplicate-id-aria - Ensures every id attribute value used in ARIA and in labels is unique This is a site-wide issue so it shows up only on /user_guide/page_toc.html page in the test results. Fixed by: https://github.com/pydata/pydata-sphinx-theme/pull/1425

---

The following two site-wide issues are both fixed by the same PR:

• [x] aria-allowed-role - Ensures role attribute has an appropriate value for the element. Fixed by https://github.com/pydata/pydata-sphinx-theme/pull/1426
• [x] listitem - Ensures <li> elements are used semantically. Fixed by https://github.com/pydata/pydata-sphinx-theme/pull/1426

---

There are also some color contrast issues that have to do with running Axe core (the accessibility checker) before certain animations (color transitions) finish running on the page. This results in false positive contrast failures. This is tracked in the following issue:

• [ ] https://github.com/pydata/pydata-sphinx-theme/pull/1427

---

The following violations are site-wide and appear at /user_guide/page-toc.html, which runs Axe against the entire page. These site-wide violations are fixed by #1454:

• [x] landmark-main-is-top-level - Ensures the main landmark is at top level
• [x] landmark-no-duplicate-main - Ensures the document has at most one main landmark
• [x] landmark-unique - Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
• [x] region - Ensures all page content is contained by landmarks

---

The following site-wide violation has to do with the PyData Theme logo in the header. The alt text for the logo is PyData Theme, but text that immediately follows the logo icon is also PyData Theme. This causes the screen reader to say it twice. This issue is fixed in #1472 and #1471:

• [x] image-redundant-alt - Ensure image alternative is not repeated as text

---

This is an issue in Sphinx Design with link cards:

• [ ] link-name - Ensures links have discernible text
  • /user_guide/web-components.html
  • #1633

---

• [ ] https://github.com/pydata/pydata-sphinx-theme/issues/1479

---

• [x] https://github.com/pydata/pydata-sphinx-theme/issues/1478

---

• [x] https://github.com/pydata/pydata-sphinx-theme/issues/1480