Skip to content

Fix duplicate banner landmark: replace second <header> with <div> (#333). Fix #328, #328, #331 - #333

Merged
thibaudcolas merged 3 commits into
mainfrom
copilot/fix-accessibility-issue-banner-landmark
Jul 3, 2026
Merged

Fix duplicate banner landmark: replace second <header> with <div> (#333). Fix #328, #328, #331#333
thibaudcolas merged 3 commits into
mainfrom
copilot/fix-accessibility-issue-banner-landmark

Conversation

Copilot AI commented Jul 3, 2026

Copy link
Copy Markdown
Contributor

Pages had two <header> elements, both mapped as ARIA banner landmarks by assistive technologies — violating the landmark-no-duplicate-banner best practice.

Change

  • sphinx_wagtail_theme/layout.html: The inner <header class="row align-items-baseline"> (containing breadcrumbs and theme controls) is changed to a <div>. The breadcrumbs already render a <nav>, so no semantic information is lost.
-<header class="row align-items-baseline">
+<div class="row align-items-baseline">
     <div class="col">
         {% include "breadcrumbs.html" %}
     </div>
     ...
-</header>
+</div>

The primary site <header class="container-fluid bg-primary"> remains unchanged as the sole banner landmark.

Also addresses related landmark violations #325, #328, #331.

Replaces the second `<header>` element in layout.html with a `<div>` to
resolve the axe accessibility rule `landmark-no-duplicate-banner`.

The second header (containing breadcrumbs and theme controls) was being
treated as a banner landmark alongside the primary site header. Since it
already includes a `<nav>` via breadcrumbs.html, a plain `<div>` is
sufficient.

Fixes #327. Also fixes #325 #328 #331.
Copilot AI changed the title [WIP] Fix accessibility issue with multiple banner landmarks on admonitions page Fix duplicate banner landmark: replace second <header> with <div> Jul 3, 2026
Copilot AI requested a review from thibaudcolas July 3, 2026 13:51
@thibaudcolas
thibaudcolas marked this pull request as ready for review July 3, 2026 13:58
@thibaudcolas

Copy link
Copy Markdown
Member

@copilot pls add a ## Unreleased section at the start of the CHANGELOG and add a line item for this fix in there

@thibaudcolas thibaudcolas left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice!

Copilot AI commented Jul 3, 2026

Copy link
Copy Markdown
Contributor Author

@copilot pls add a ## Unreleased section at the start of the CHANGELOG and add a line item for this fix in there

Done — added an ## Unreleased section with a ### Fixed entry for this change (commit Add Unreleased section to CHANGELOG for banner landmark fix).

Copilot AI requested a review from thibaudcolas July 3, 2026 14:02
@thibaudcolas thibaudcolas changed the title Fix duplicate banner landmark: replace second <header> with <div> Fix duplicate banner landmark: replace second <header> with <div> (#333). Fix #328, #328, #331 Jul 3, 2026
@thibaudcolas
thibaudcolas merged commit e7acb50 into main Jul 3, 2026
3 checks passed
@thibaudcolas
thibaudcolas deleted the copilot/fix-accessibility-issue-banner-landmark branch July 3, 2026 15:14
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.

Accessibility issue: Document should not have more than one banner landmark on /en/latest/examples/admonitions.html

2 participants