Context-aware headings in HTML

Title “Context-aware headings in HTML” next to the author’s photo, with two browser windows showing nested headings labeled H1, H2, and H3 in the Firefox accessibility inspector.

Manuel Matuzović explores headingoffset, a new HTML attribute that offsets descendant heading levels in the accessibility tree without changing the tags. Wrap a section in headingoffset="1" and its <h1>s become <h2>s for assistive tech. Pair with headingreset to opt out. Especially useful for web components that render headings in Shadow DOM. Available in Firefox Nightly behind a flag.

matuzo.at/blog/2026/content-aware-headings