search

WordPress / theme-experiments

Experimenting with themes made out of blocks.
GNU General Public License v2.0
546 stars 179 forks source link

TT1 blocks: Multiple <h1> #290

Open TeBenachi opened 2 years ago

TeBenachi commented 2 years ago

There are three <h1> tags on pages and single posts when using the default templates. It is recommended to start the main content with <h1> for better accessibility. Also, the accessibility requirements require themes to have no more than one <h1> tag on a single page.

  1. Consider using <p> for the site title in the footer instead of <h1>

  2. For the site title in the header, the classic themes traditionally have the mechanism of having <h1> on the homepage, <div> on all other pages. FSE themes could have multiple headers to achieve this, but it’s not ideal. Perhaps this is a concern with GB.

aristath commented 2 years ago

It is recommended to start the main content with <h1> for better accessibility.

+1

Also, the accessibility requirements require themes to have no more than one <h1> tag on a single page.

I'm not sure that's valid anymore... 🤔 Perhaps the requirement should change? AFAIK having multiple H1 elements has been valid for years (in HTML5). If I'm not mistaken in was invalid in HTML4 - which is not a concern.

For the site title in the header, the classic themes traditionally have the mechanism of having <h1> on the homepage, <div> on all other pages. FSE themes could have multiple headers to achieve this, but it’s not ideal. Perhaps this is a concern with GB.

I'm not 100% sure but I don't think that's "best practice" anymore... It's what we've been doing for years, but that doesn't make it right 😅

websitegenii commented 2 years ago

Also, the accessibility requirements require themes to have no more than one <h1> tag on a single page.

I'm not sure that's valid anymore... 🤔 Perhaps the requirement should change? AFAIK having multiple H1 elements has been valid for years (in HTML5). If I'm not mistaken in was invalid in HTML4 - which is not a concern.

For the site title in the header, the classic themes traditionally have the mechanism of having <h1> on the homepage, <div> on all other pages. FSE themes could have multiple headers to achieve this, but it’s not ideal. Perhaps this is a concern with GB.

I'm not 100% sure but I don't think that's "best practice" anymore... It's what we've been doing for years, but that doesn't make it right 😅

I was very curious about this as I too was under the impression that multiple H1 tags are very bad for SEO in general. Though Matt Cutts here explains that it's not going to destroy your SEO.

Though if you read between the lines what it really sounds like he's saying, is the main body of your content should only have 1 but since there are so many websites and Google wants to index them all they will still try and figure out the topics of the page.

So stuff like having the H1 in the logo is less concerning to me now but at the end of the day I do feel like "why". Why put multiple H1 tags, if we are trying to be clear about structure anyway, regardless of SEO then why would we put multiple main titles on a page regardless?

carolinan commented 2 years ago

The accessibility requirements are decided by the accessibility team. If you have feedback on the requirements please share that feedback with the team for their consideration.

TeBenachi commented 2 years ago

Thank you for the insights. While WCAG does not disallow having multiple H1 and Google doesn’t seem to mind having multiple H1, MDN, Deque, and among others recommend using a single H1. I also have a conflicting feeling about having multiple H1.

I agree with consulting the accessibility team about the heading requirement. Although TT1 is not an accessibility-ready theme, I think it is a good idea to get some insights about the multiple H1 as well.