Contrib.social

H4 in page.html.twig Causes Accessibility Error

Open on Drupal.org →
Created on 17 August 2021, over 3 years ago
Updated 14 March 2024, 10 months ago

Problem/Motivation

The core pager template has an H4 header for a visually hidden title. This occurs on line 37. 

<nav class="pager" role="navigation" aria-labelledby="{{ heading_id }}">
 <h4 id="{{ heading_id }}" class="visually-hidden">{{ 'Pagination'|t }}</h4>
  <ul class="pager__items js-pager__items">

The issue is accessibility crawlers mark this as a Headings are not structured issue if an h1, h2, and h3 does not come before it.

Steps to reproduce

Proposed resolution

Is there a reason the h4 is needed? The nav tag has it's role set to navigation and the aria-labelledby is set to the heading_id. Although, the heading_id is spaced by hyphens, so that may not be ideal.
This issue, https://www.drupal.org/project/drupal/issues/1912608 → , initially states:
"Add a visually hidden h4 element for announcing the section title, link it to the nav wrapper element via a aria-labelledby attribute."
So if we need to keep this line, can we not change the h4 to a span tag?

Remaining tasks

User interface changes

API changes

Data model changes

Release notes snippet

🐛 Bug report
Status

Closed: duplicate

Version

11.0 🔥

Component
Markup  →

Last updated about 2 months ago

No maintainer
Created by

🇺🇸United States Breesy

Live updates comments and jobs are added and updated live.
  • Accessibility

    It affects the ability of people with disabilities or special needs (such as blindness or color-blindness) to use Drupal.

Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024