馃晪 Website
The Get Started page renders four <h1> elements, so the document has four competing top-level headings instead of one.
https://pytorch.org/get-started/locally/
h1 Get Started
h1 Installing on macOS
h1 Installing on Linux
h1 Installing on Windows
The three install headings come from this repo, and each opens with a markdown #:
_get_started/installation/mac.md_get_started/installation/linux.md_get_started/installation/windows.md
Those files are included into a page that already carries its own h1, so the # becomes a second, third and fourth top-level heading rather than a section heading under it.
Why it matters
Headings are how screen reader users navigate a long page. Most screen readers offer "jump to next heading" and a heading list, and both rely on the levels describing a real outline. Four h1s say the page has four separate documents in it, so the outline stops being useful for exactly the page a new user is most likely to be reading carefully while installing something.
This is WCAG 2.2 1.3.1 Info and Relationships, Level A.
To Reproduce
- Go to https://pytorch.org/get-started/locally/
- Run in the console:
[...document.querySelectorAll('h1')].map(h => h.textContent.trim())
- Four headings are returned rather than one.
Expected behavior
One h1 per page. The three install headings become ##, which puts them under "Get Started" where they belong and leaves the rendered page looking the same.
Two things I could not determine from outside
Both are about the page chrome rather than the content, and I suspect they are not owned by this repo, so I am asking rather than reporting:
- There are two
role="contentinfo" landmarks on every page I checked, one on div.nectar-global-section.before-footer and one on #footer-outer. There should only be one, otherwise landmark navigation offers two "footers".
- The homepage
h1 is "JOIN US", which is a conference banner rather than a description of the page.
Both look like they come from the WordPress theme wrapping the Jekyll content, not from this repository. If that is right, I would be glad to know where they should be raised instead.
Happy to open a pull request for the # to ## change if that is useful.
馃晪 Website
The Get Started page renders four
<h1>elements, so the document has four competing top-level headings instead of one.https://pytorch.org/get-started/locally/
The three install headings come from this repo, and each opens with a markdown
#:_get_started/installation/mac.md_get_started/installation/linux.md_get_started/installation/windows.mdThose files are included into a page that already carries its own
h1, so the#becomes a second, third and fourth top-level heading rather than a section heading under it.Why it matters
Headings are how screen reader users navigate a long page. Most screen readers offer "jump to next heading" and a heading list, and both rely on the levels describing a real outline. Four
h1s say the page has four separate documents in it, so the outline stops being useful for exactly the page a new user is most likely to be reading carefully while installing something.This is WCAG 2.2 1.3.1 Info and Relationships, Level A.
To Reproduce
Expected behavior
One
h1per page. The three install headings become##, which puts them under "Get Started" where they belong and leaves the rendered page looking the same.Two things I could not determine from outside
Both are about the page chrome rather than the content, and I suspect they are not owned by this repo, so I am asking rather than reporting:
role="contentinfo"landmarks on every page I checked, one ondiv.nectar-global-section.before-footerand one on#footer-outer. There should only be one, otherwise landmark navigation offers two "footers".h1is "JOIN US", which is a conference banner rather than a description of the page.Both look like they come from the WordPress theme wrapping the Jekyll content, not from this repository. If that is right, I would be glad to know where they should be raised instead.
Happy to open a pull request for the
#to##change if that is useful.