a11y: listing category filter h5 breaks heading-order

Open Beginner friendly
#14,384 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
76/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Quiet
Tech stack
javascript
Domain
accessibility

Research direction

Start from the listing template that renders the category filter title when categories: true, using the linked accessibility repro as the entry point. Run the axe heading-order check on a listing page with an h1 and no intermediate headings; done means the category title no longer breaks the heading hierarchy.

Written by the indexing model from the issue text.

Description

accessibility bug

Reported in #14373.

Repro: https://github.com/alexpghayes/quarto-accessibility-reprex

axe rule: heading-order · impact: moderate · tag: best-practice
Target: <h5 class="quarto-listing-category-title">Categories</h5> on listing pages with categories: true.

The listing template renders the category filter title as <h5> regardless of the surrounding heading context. On a listing page whose own title is <h1> with no intermediate h2–h4, jumping to h5 breaks the heading hierarchy. Should use <h2> (or match the current heading depth) so screen reader users get consistent navigation.

Part of #8706.

Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 8h
Merged PRs (30d)
42

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from quarto-dev/quarto-cli

All issues in quarto-dev/quarto-cli

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.