search

Yoast / YoastSEO.js

Analyze content on a page and give SEO feedback as well as render a snippet preview.
GNU General Public License v3.0
403 stars 170 forks source link

Incorrect warning about H1 tags #2097

Closed Djennez closed 5 years ago

Djennez commented 5 years ago

Please give us a description of what happened.

Incorrect (unnecessary?) warning about H1 tags in beta version of readability check

Please describe what you expected to happen and why.

I frequently need to split my H1 title into multiple lines, hence the warning about multiple H1 tags seemed "natural". However, I now tried limiting the H1 occurrences to a single instance (whereby I do have additional text in a "header"-like section above that H1). However, I now see that I cannot make that "multiple H1 warning" disappear, unless I remove all H1 tags.

I don't think it is acceptable to enforce H1 being the very first thing on a page / Blog post. Furthermore, I think that multiple subsequent H1 tags (a multi-line title) should be OK.

How can we reproduce this behavior?

1. 2. 3.

Technical info

Used versions

Djennez commented 5 years ago

Original issue submitted in the wordpress-seo repo: https://github.com/Yoast/wordpress-seo/issues/12027

I was unable to reproduce this issue with the beta functionality enabled.

Possibly related: #1298

manuelaugustin commented 5 years ago

Thank you for your feedback on the H1 assessment @RolfKyburz! Could you perhaps provide us with sample texts where you experience this problem?

RolfKyburz commented 5 years ago

One example is here: https://www.rolf-musicblog.net/2015-03-27-prokofiev-shostakovich-schnittke/

Essentially, I have this issue with virtually all of my almost 500 blog posts—they all come with a posting / revision note at the top. One may or may not agree with this—I personally think that enforcing H1 to at the very top of a page / post (i.e., with nothing above) is far too restrictive. I used to have a lower level title in the upper left corner, above the centered H1 title—and also that should be perfectly acceptable. IMO,

What may be OK is a warning about multiple, separated instances of H1 tags.

jonoalderson commented 5 years ago

Hello!

We've been discussing this at Yoast HQ, and have the following thoughts.

Some general context:

  1. Most sites (in WordPress, and beyond) have a standard convention where the H1 is at the start of the page, and reflects the name/title of the post.

  2. Most themes do this automatically - the H1 isn't contained within the post content, but rather, PHP logic in the theme outputs it near the top of the page.

  3. Because not all themes do this, we make special efforts to try and evaluate when post content starts with a H1 tag (for scenarios where users write this manually, to begin their post). I should point out that we're already into niche territory here - most themes get this right. So we're not keen on spending significant resource on evaluating edge-case scenarios which won't apply to most users.

Now, for your case specifically:

  1. In the strictest sense, the H1 tag should be before any of your page/post content. In your case, from a purely semantic / document structure perspective, it's not clear what your revisions are about, because they occur before the title.

1a. That said, your technical/specific issue (and the thing the plugin is flagging) is that that content precedes the H1 in the post content - rather than, that it precedes it in the page structure. We have no opinion on layout.

  1. If you're splitting your H1 tag into multiple, distinct tags for the purpose of formatting, then that's also a document structure issue ("This document has two concurrent/competing headings"), and a potential SEO issue - therefore definitely something we should be flagging. There are other/better ways to achieve 'multi-line titles', in a way which is standards-compliant.

  2. I'd consider altering the way your theme works (or changing theme), and:

3a. Output the H1 automatically, in the page structure (based on the page name, or, another field you define), rather than writing it in the post content.

3b. Store the 'by' component of your H1 as a post meta field, which can be output immediately after the H1 (e.g., as a styled <p> tag).

3c. Take your revisions out of the post content, and also manage those as part of the theme (either by pulling in a list of WordPress post revisions, or, as custom meta fields).

E.g.,

<h1 style="text-align: center;">Violin Sonatas from the 20th Century</h1>
<h1 style="text-align: center;">by Prokofiev, Shostakovich, and Schnittke</h1>
<h2 style="text-align: center;">Media Review / Listening Diary 2015-03-27</h2>

Should probably be output by the theme as:

<div class="heading heading__centre>
<h1>Violin Sonatas from the 20th Century</h1>
<p>
 <span>by Prokofiev, Shostakovich, and Schnittke</span>
 <span>Media Review / Listening Diary 2015-03-27</span>
</p>
</div>

Given the above... I don't think that we should change the warnings we're giving - they're correctly identifying that your pages have multiple H1 tags, which is an issue.

As such, I'm going to close this issue, but, feel free to continue to the discussion - I'd be happy to help with further suggestions on how to structure and output this content more in line with HTML standards and SEO best practice.

RolfKyburz commented 5 years ago

Hi There, Let me consider moving the revision history below the title (even though that's a lot of work). Still, I think your logic is flawed, for various reasons:

I still think you are patronizing the user by enforcing the posting / title scheme that you have in mind!

jonoalderson commented 5 years ago

Hi @RolfKyburz,

Let me start by apologizing for coming across as patronizing. We're not intending to tell people how to run or structure their websites, however, we are attempting to provide insight and advice on SEO best-practice (and, to a lesser extent, HTML best practice) - and I still think that, in this case, we're doing so correctly.

Essentially, it's unclear what your page is about. These (albeit relatively minor) issue may be impacting your SEO. It's our job to flag that, and to bring it to your attention. Of course, you're welcome to ignore/dismiss this - we're just advising based on our understanding of best practice.

And, I should point out that whilst your code is technically valid in HTML5 (which is more flexible when it comes to multiple headings, and contained sections with their own headings), your page is still structured in such a way which may make the relationship between the headings and content unclear to search engines.

To your specific points:

1) I'm suggesting that you remove / don't add a H1 into the post content area at all, and that the H1 content be handled purely by the theme. In that case, the page only has one H1, which we can evaluate correctly.

2) If the post title isn't suitable as the H1, that's fine. Your theme could be configured to populate the contents of the H1 tag with whicever post variables you like (e.g., post meta values), and output them appropriately. In my previous example, I showed how your current approach could be modified to still provide the user with the detailed context, but where the H1 could be structured in such a way so as to avoid duplication of tags or excessive length.

RolfKyburz commented 5 years ago

thanks for the apology. If I'm reacting nervous, maybe aggressive, then it's because my blog has grown to 500 posts, and it's in the nature of my blog that the articles aren't just there for a couple weeks before they dissipate into the nirvana of the blog archive. Rather, I try very hard to keep my entire blog site consistent from beginning to end, because my viewing records show me that even posts from 5 years ago may be just as popular as new ones. And hence, I'm not just going to switch to a new scheme for new posts (let alone switch theme, which might end up as a total nightmare). Rather, just as an example, if I say I'm moving the post history to appear after the title—that's something I'm going to do to all nearly 500 posts — by hand, which is days of work. Finally: having a little (h2 or h3) pre-title is nothing unusual at all — I see this in newspapers, scientific publications, etc.: the "H1 strictly first" rule is far too rigid.

jonoalderson commented 5 years ago

Hey @RolfKyburz, I totally understand that it's a lot of effort to update all of your historical content, and that much of it is evergreen. We're the same at yoast.com!

That said, I'd still definitely recommend that you tidy things up as you move forward. As your competitors continually invest in improving their site, and as the expectations of your audiences increase, you need to make sure that you're able to keep up - and every little helps!

I do have something super-exciting to share with you, though, with regards to the structure and layout of your headings - we've found a really handy reference in the W3C's guide to subheadings, here - http://w3c.github.io/html/common-idioms-without-dedicated-elements.html#subheadings-subtitles-alternative-titles-and-taglines.

Check out "Example 5", which describes how a heading group containing a H1 tag can contain a 'pre-header', and still be valid. This is definitely something to think about as you assess how your theme might change how/where it outputs the heading of the page (though you'd still want to do this 'outside' of your post content, via your theme code).

RolfKyburz commented 5 years ago

Hi @jono-alderson — thanks for the feedback & suggestions. I have gone through the chore of mending all my almost 500 blog posts to comply with your "ruling", even though I still think you are too rigid in your assessment. The example 5 that you are referring to looks like a workaround that permits breaking a rule that is inappropriately narrow in first place. Also, not all of the proposed suggestions (in the article you are referring to) are easily applicable to an arbitrary theme in WP (as WP has its own way of dealing with HTML), and changing WP theme is not something I would consider lightly, with all my blog history that this might cause to break. I'm more than happy if some day I manage the transition to Gutenberg. Just one last point: it is the result of a carefully considered, conscious decision that I want the "Title" field to be compact and just informative enough for listings and together with excerpts / search engines, etc., where as in the posting itself, I want the H1 header (as viewed together with my wordy, occasionally epic postings) to be more informative, and typically longer than the post title. On to more blogging...