Heading Hierarchy

Heading hierarchy is the semantic outline created by a page's headings, usually the HTML elements `<h1>` through `<h6>`. A heading's rank represents the level of its section, not its font size: an `<h1>` commonly identifies the main page topic, `<h2>` elements introduce its major sections, and lower ranks identify nested subsections. Browsers and assistive technologies can expose this structure for orientation and in-page navigation.

Why it matters: Use concise headings that describe the content that follows, mark visual headings with semantic elements, and do not use a heading merely to obtain its default styling. In most documents, begin the main content with an `<h1>` and nest new subsections one level at a time. Exactly one `<h1>` is a useful convention for many pages, not an absolute accessibility requirement. Skipping from `<h2>` to `<h4>` when opening a subsection can obscure the relationship, while returning from `<h4>` to `<h2>` correctly closes nested sections. Fixed site regions may keep consistent ranks across templates. Review the headings in DOM order and with assistive technology, because appearance alone and automated skipped-level warnings cannot determine whether the outline reflects the content. A meaningful hierarchy helps people scan and navigate; it is not a standalone search-ranking formula.