Heading levels should only increase by one #13310
mikeslinkman
started this conversation in
Ideas
Replies: 1 comment 1 reply
-
Possibly related to: #13295 |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Current situation
At the moment when using a filament resource on a listing page the resource title is a
<h1>
and the next heading element is a<h3>
for the table heading (if set). Considering A11Y the recommended approach is to only increasing heading levels by one to make the structure of a page more clear, see details below.It is considered a best practice and not an actual rule, but I feel it might be a improvement
Why it matters
The underlying purpose of headers is to convey the structure of the page. For sighted users, the same purpose is achieved using different sizes of text. Text size, however, is not helpful for users of screen readers, because a screen reader identifies a header only if it is properly marked-up. When heading elements are applied correctly, the page becomes much easier to navigate for screen reader users and sighted users alike.
Proposed solutions
h3
for ah2
but this might result in undesired style changes. This might only be an issue for people using the tables independantly.h3
to ensure backwords compatibility. Maybe we could provide a enum we can incremently introduce where ever this can be used.References
https://dequeuniversity.com/rules/axe/4.9/heading-order?application=AxeFirefox
Curious what you think @danharrin maybe there are also other options I didn't think of since I haven't seen big chunks of the existing code base. Depending on the chosen solution I might be able to work on the feature by adding it to the backlog of the sprint of my company.
Beta Was this translation helpful? Give feedback.
All reactions