Perhaps screen readers can be set to read out the major headings to help people figure out what part of the document they want to read. This would have a level of detail or verbosity control.
First you read h1, find the right header. Then h2 with 2 levels of detail, which hits h2 and h3. You miss the sub-section you wanted because it was marked h4 instead of h3.
It's a broken tree structure... that'll cause problems any time somebody wants to do a logical traversal.
Yes. Screen readers load the page contents into a buffer and allow users to scan headings, links, etc. having a broken outline structure is potentially confusing [1]. This is also why descriptive linked text is important (ie: no "click here") [2]
Screen readers do indeed have a feature that allows the users to browse just the headings.
As others have mentioned, it's likely flagged as an accessibility issue since having an h4 follow an h2 indicates a broken document structure.
It's also probably included in the tool because things like that usually (though not always) mean that the developer is just using the h4 tag based on how it looks as opposed to actual semantic meaning, and the tool is designed to get you to put more thought into what you're actually building.
Remember the size is a consequence but it means it's a header of a subsection of an h3 which is then a header of a subsection of an h2. It could throw off the emphasis used in some screen readers or screw with a reading layout.
It's honestly probably not a big deal but it is an improper use of syntax and could mess with accessibility software in undesirable ways.
Screen readers provide information about headers on a page, and users use that to navigate to the relevant portion of a page. When headers are in sensible hierarchical order, this is easier to do.
That said, while it's a best practice to keep headings in a sensible order, skipping heading levels is not a WCAG AA violation.
<h4> under an <h2> has nothing to do with accessibility. Its just some people think it makes sense to have smaller headings after bigger ones and not the way around. I for one think that it sometimes is important to use an h2 after an h4. This has nothing to do with semantics btw.
Please try and avoid using heading tags for size alone :) If it's for design purposes, just resize some <span>'s, and let headings (even ones hidden off the side of the screen) define the structure of the document (as we explain in the error description).
The reason for this is because many screen-readers have keyboard shortcuts to jump from heading to heading. Many users will map out the page with this key-binding. Keeping the headings in a good order is very important.
Da basics.... You know, separate content from presentation. Content being the HTML page, and presentation being the styling. Semantically right HTML should be the primary goal when writing HTML. You can than style it 40 different ways using CSS.
