climatechoice icon indicating copy to clipboard operation
climatechoice copied to clipboard

Multiple h1s on pages

Open BNewing opened this issue 5 years ago • 1 comments

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:

image

And in the 'Impact makers' footer card:

image

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! :)

BNewing avatar Oct 29 '19 00:10 BNewing

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!

ThePaulMcBride avatar Oct 31 '19 14:10 ThePaulMcBride