heading-hierarchy

Installation
SKILL.md

Use logical heading hierarchy

Screen reader users navigate by headings like a table of contents—skipping levels or poor hierarchy makes content impossible to understand and navigate.

Quick Reference

  • Use exactly one h1 per page for the main title
  • Never skip heading levels (h1 → h2 → h3, not h1 → h3)
  • Heading text should describe the content that follows
  • Don't use headings for visual styling—use CSS instead

Check

Verify pages have exactly one h1, headings follow sequential order without skipping levels (h1 → h2 → h3), and heading text clearly describes the content that follows. Use accessibility tools to generate a heading outline.

Fix

Structure headings to reflect content hierarchy. Start with h1 for the page title, use h2 for major sections, h3 for subsections. Never skip heading levels or use headings purely for visual styling.

Installs
1
GitHub Stars
73.0K
First Seen
7 days ago
heading-hierarchy — thedaviddias/front-end-checklist