Description
title: An HTML attribute, or JS property to isolate a heading tree
date: 2022-06-24T14:05:57.948Z
submitter: Joppe Kroon
number: 62b5c4c5ab5a06005b562fbb
tags: [ ]
discussion: https://github.com/WebWeWant/webwewant.fyi/discussions/
status: [ discussing || in-progress || complete ]
related:
- title:
url:
type: [ article || explainer || draft || spec || note || discussion ]
The outline algorithm, i.e. restarting a heading tree in a
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements#multiple_h1_elements_on_one_page
But with the lines between the web and native applications blurring (PWAs), and web components promoting reuse, there is a need now more than ever for developers to be able to create heading structures that are sane without relying on nothing more than luck.
More and more, you see content/components being produced of which the author does not exactly know in which context it is going to show up. So they have to be very careful and choose a low heading level like h5 to hopefully not interfere with the heading structure of their potential contexts, thereby hamstringing the ability to structure their own content.
If you could specify on your webcomponent that the content re-starts a heading tree, you could now safely use h1 and friends again in the places where it makes sense. Without relying on acrobatics through the Light DOM, or JS to indicate what level to start off from.
If posted, this will appear at https://webwewant.fyi/wants/62b5c4c5ab5a06005b562fbb/