Background

With the addition of several new features (TOC, sticky header) and many accessibility updates (i.e. landmarks, menus) to modern Vector, we want to collect feedback from screenreader users. These changes should be tested with the most common screenreader/browser combinations.

TODO

• Define the list of questions that we want to answer.
• Review T311294 for any additional questions

Sign off steps

• Ensure the process is kicked off to get answers to these questions

Questions to answer:

https://docs.google.com/document/d/1JHxp5fvQt8i_coBapA9kyzI6ZS7G1BCfTAmmPLfiDYQ/edit

How are your impressions of the landmark regions in modern vs legacy Vector (more context)?
How are your impressions of the heading structure in modern vs legacy Vector?
How are your impressions of the ordering of elements in the DOM and general semantic structure in modern Vector vs legacy Vector?
Modern Vector moves the page toolbar below the page titlebar and into <main>. This has resulted in keyboard users needing to tab through more elements before reaching the article text (more context). What’s the best approach to maintain the experience for keyboard users while adhering to accessibility best practices?
How important is it for the TOC to be inside <main>? (more context)
Modern Vector uses the checkbox hack to implement dropdown menus that support no-js users. How accessible are our dropdown menus for screenreader users (code)? Specifically the user menu dropdown and the language dropdown in modern Vector.
Additionally, what are your thoughts on this alternate option, which uses aria-hidden on <label> to avoid repeating the label for screen readers, but hides a visible element (code)?
How does the accessibility of the table of contents compare in modern vs legacy Vector? Including the collapsed table of contents on viewports under 1000px.
Modern Vector shows a sticky header when scrolling down the page. We chose to hide it entirely from screen reader users given it contains purely duplicated content (more context). What do you think of this approach?
How accessible is the contents of the language dropdown in modern Vector?
Does modern Vector’s search field fulfill user expectations in regards to keyboard and screen reader accessibility and is beneficially usable?

Example article:
Modern Vector - https://en.wikipedia.org/wiki/Polar_bear?useskin=vector-2022&tableofcontents=1&vectorlanguageinmainpageheader=1&vectorlanguageinheader=1&vectorstickyheader=1
Legacy Vector - https://en.wikipedia.org/wiki/Polar_bear?useskin=vector