Introductory sections require h2-6, despite not needing a header

[ProgramMax]

Description of problem

<section class="introductory"> errors on a missing first header element. But the documentation clearly says this is not to be linked from the ToC, which means the header-as-section-title concept shouldn't apply.

Adding class="notoc" does not help.

URL to affected spec or repo:

https://w3c.github.io/PNG-spec/#4Concepts.PNGImageTransformation

What happened (e.g., it crashed)?:

All sections must start with a h2-6 element.
How to fix: Add a h2-6 to the offending section or use a <div>.

Occurred 9 times at:

[<section>](https://w3c.github.io/PNG-spec/#4Concepts.Introduction) element
...

Expected behavior (e.g., it shouldn't crash): h2-6 tag shouldn't be required for introductory sections

[ProgramMax]

I think I can create a pull request to fix this. But before I do, can you confirm that I'm not just holding the tool wrong? :D Are we expected to add <h2>Introduction</h2>?

[sidvishnoi]

this is not to be linked from the ToC, which means the header-as-section-title concept shouldn't apply.

Every section should have a heading, regardless if it's linked from ToC or not. I think this is the correct behavior, specially in context of a11y.

In particular case of PNG-spec above, I am not sure why <section id="4Concepts.Introduction" exists as a sub-section of <section id="4Concepts.PNGImageTransformation" instead of being its direct content. If it needs to be a nested-section, you can add a heading such as "Introduction". If the sub-section exists just to add an ID for referencing, you can add it on first paragraph or wrap it in a div instead.

---

From https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section:

Sections should always have a heading, with very few exceptions.

Circumstances where you might see <section> used without a heading are typically found in web application/UI sections rather than in traditional document structures. In a document, it doesn't really make any sense to have a separate section of content without a heading to describe its contents. Such headings are useful for all readers, but particularly useful for users of assistive technologies like screenreaders, and they are also good for SEO.

[ProgramMax]

I'm not sure I follow.

Suppose there was no <section id="4Concepts.Introduction"> and the contents were directly in <section id="4Concepts.PNGImageTransformation">. Visually, it would be the same. The contents similarly wouldn't show up in the ToC. And the section-heading problem would be solved.

If that were the case though, what is the point of class="introductory"?

The docs says "When set on a section" and give an example of <section class="introductory">. It seems like a nested section with introductory content is the intended use.

And since this is an introduction to the concept named by the parent section, renaming it or just spelling out "Introduction" doesn't seem terribly useful.

It seems like class="introductory" perhaps shouldn't be put on a section. In either case, we should probably update the docs to either show a header being used in the section or to apply the class to a div, right?

[sidvishnoi]

If that were the case though, what is the point of class="introductory"?

I'm also not sure why it was ever added. I couldn't find rationale in https://github.com/w3c/tr-design either. @marcoscaceres might know.

And since this is an introduction to the concept named by the parent section, renaming it or just spelling out "Introduction" doesn't seem terribly useful.

Correct.