Skip to content

Fix heading hierarchy across all pages#28

Merged
plx merged 1 commit intomainfrom
plx/fix-heading-hierarchy
Mar 15, 2026
Merged

Fix heading hierarchy across all pages#28
plx merged 1 commit intomainfrom
plx/fix-heading-hierarchy

Conversation

@plx
Copy link
Owner

@plx plx commented Mar 15, 2026

Summary

  • Add screen-reader-only <h1> on home page (was missing entirely)
  • Convert <div> page titles to <h1> on blog, briefs, and projects index pages
  • Change <h5> section headings to <h2> (was skipping h2-h4)
  • Add configurable headingLevel prop to ContentCard for correct nesting
  • Refactor contentCardHelpers to use options object pattern
  • Fix heading levels in markdown content (### -> ## where h2 was skipped)
  • Fix list numbering and indentation issues in content files
  • Remove excessive blank lines in draft content

Context

These issues were originally discovered by Playwright QA tests (PR #22) that enforce WCAG heading hierarchy rules. This PR fixes the underlying content/structural issues.

Test plan

  • Verify each page has exactly one <h1>
  • Verify no heading levels are skipped (h1 -> h3 without h2)
  • Verify just build passes
  • Verify just lint passes
  • Visual check that heading sizes haven't changed (these elements use explicit Tailwind sizing, not semantic heading sizes)

🤖 Generated with Claude Code

- Add sr-only h1 on home page
- Convert div page titles to h1 on blog, briefs, projects index pages
- Change h5 section headings to h2 on home page and briefs index
- Add configurable headingLevel prop to ContentCard component
- Refactor contentCardHelpers to use options object pattern
- Fix heading levels in content markdown (h3 -> h2 where h2 was skipped)
- Fix list numbering in hdxl-xctest-retrofit
- Fix list indentation in agentic-navigation-guide
- Remove excessive blank lines in decision-execution-pattern

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@github-actions
Copy link
Contributor

PR Validation ✅

All checks passed! Ready for review.

Checks Performed:

✓ Linting
✓ Spell check (source)
✓ Type checking & Build
✓ Spell check (HTML)
✓ Internal link validation
✓ Artifact upload

This is a complete dry-run of the deployment process, ensuring your changes will deploy successfully when merged.

@claude
Copy link

claude bot commented Mar 15, 2026

PR Review

This is a clean, well-scoped fix for the heading hierarchy issues. The changes are straightforward and the intent is clear. A few notes:


Bug: briefs/[category].astro still skips a heading level

The category detail page has an h1 for the category name (line 71), but cards inside default to h3 — skipping h2. This is the exact same problem being fixed elsewhere in this PR.

projects/index.astro correctly passes headingLevel: 2 for its direct-children cards, but briefs/[category].astro was not updated similarly:

<!-- briefs/[category].astro:83 — should be headingLevel: 2 -->
<ContentCard {...getBriefCardProps(brief, false, { maxLines: 3 })} />

Fix:

<ContentCard {...getBriefCardProps(brief, false, { maxLines: 3, headingLevel: 2 })} />

Minor: HeadingLevel type is duplicated

HeadingLevel is defined independently in both ContentCard.astro and contentCardHelpers.ts. If the valid range ever needs to change, it has to be updated in two places. Consider extracting it to a shared location (e.g., src/lib/types.ts or alongside the card helpers) and importing from there.


Everything else looks good

  • The CardOptions options-object refactor is a clean improvement — the old positional maxLines parameter was already showing strain once headingLevel needed to be added.
  • The HeadingTag dynamic element pattern in Astro is idiomatic and correct.
  • The sr-only h1 on the home page is the right approach for an implicit page title.
  • Content fixes (list renumbering in hdxl-xctest-retrofit, list indentation in agentic-navigation-guide, extra blank lines in decision-execution-pattern, ##### in the swift-warts brief) are all correct.
  • All call sites for the refactored helper functions are updated consistently.

The category page heading skip is worth fixing before merging, since it would leave one page still failing the WCAG hierarchy check this PR is meant to resolve.

@plx plx mentioned this pull request Mar 15, 2026
4 tasks
@plx plx merged commit d33e514 into main Mar 15, 2026
3 checks passed
@plx plx deleted the plx/fix-heading-hierarchy branch March 15, 2026 18:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant