climatechoice
climatechoice copied to clipboard
Multiple h1s on pages
It looks like there is generally quite a good heading structure across the pages, but sometimes there are multiple <h1>
elements per page. As a general rule, there should only be one <h1>
, and all heading levels underneath should be hierarchal.
This particularly benefits users of assistive technology, such as screen reader users, who can sometimes look at heading levels in isolation, to get a sense of what's on the page.
The main places the multiple <h1>
s seem to come from are in the little share strapline:
And in the 'Impact makers' footer card:
I'd also argue that maybe the strapline in the home page header shouldn't be a <h1>
. A pattern that GOV.UK, the Financial Times and BBC seem to use is to have a visually <h1>
on every page, that says something like 'welcome to X', or just 'X', where X is their organisation's name. Something I've also seen done is having the logo have some visually hidden text, which might work well on this site.
Again happy to make a PR if welcome! :)
Hi @BNewing, we'd be very happy to receive a PR that fixes some of the concerns you have. Feel free to open one and we can figure out how to implement these improvements!