Closed umbrabot closed 1 year ago
Happy to look at this one
so this exposes a wider issue with how headings have been nested within the backoffice.
It's simple enough to fix technically - but it's hard to be consistent and thorough.
Example - If you open the back office and tab past the navigation - the first heading you reach is a H5 'Content' - which when activated opens up a contextual modal which contains an H1.. yes an H1
I'm guessing each section will be the same.
If I were to guess I would say that the headings have been chosen because of their visual size as opposed to their semantic value as a heading
So instead I now need to look at the whole heading structure
So I think this refers to the group-panel elements within the editor view. Therefore I have submitted a PR that fixes this issue by:
Adding a H2 tag to the section header. H2 because H1 is used within the left column (presuming that the PR I submitted for #42 is accepted)
I have attached additional styling to the section header to match it's previous style.
Please take a look at the PR and give comments :)
Steps to replicate:
Issue: No missing headings: Text that looks like a heading must be coded as a heading
Section text Content, Footer etc.
Why it matters: People with good vision can quickly scan a page to identify headings based solely on their appearance, such as large or bold font, preceding white space, or indentation. Users of assistive technologies can't find headings that aren't properly coded.
How to fix: Re-implement using a heading tag. (You could add role="heading" to a different element, but the first rule of ARIA is to use native HTML elements where possible, instead of repurposing an element by adding ARIA.)
W3 reference: https://www.w3.org/WAI/WCAG21/Understanding/headings-and-labels.html