landmark contentinfo needs to be top-level

This accessibility report identifies a moderate-severity violation of WCAG 1.3.6 (Identify Purpose) occurring on roughly 5% of the site's pages, where error message containers are incorrectly assigned the contentinfo landmark role while nested inside other landmarks. The contentinfo role (typically used for a page footer) is intended to be a top-level landmark; nesting it within other regions like or contradicts its semantic purpose and can confuse screen reader users who rely on landmarks for high-level page navigation. To resolve this, the Drupal message template should be updated to remove the role="contentinfo" attribute from the .messages--error div, perhaps replacing it with a more appropriate ARIA role like alert or status, which would better communicate the nature of the error message without breaking the structural integrity of the page's landmark map.

Note: AI was used to create the scripts that created this scanner and the corresponding report.

Pattern ID: DRU-2E022F2F
Rule: axe-core - landmark-contentinfo-is-top-level
Axe Rule URL: https://dequeuniversity.com/rules/axe/4.11/landmark-contentinfo-is-top-level
Severity: Medium (axe impact: moderate)
WCAG SC: 1.3.6 - Identify Purpose (Level A)
Frequency: 22 of 452 pages (5%)
Selector: .messages--error
XPath: //[contains(@class,"messages--error")]
*Parent Context: N/A

Affected URLs (full list):

• https://drupal-core.ddev.site/admin/appearance
• /admin/modules
• /message

Conditions:

• admin (dark desktop, dark mobile, light desktop, light mobile), claro (dark desktop, dark mobile, light desktop, light mobile)

HTML Snippet

<div data-drupal-messages="" class="messages-list">
  <div class="messages__wrapper">
                      
      <div role="contentinfo" aria-labelledby="message-error-title" class="messages-list__item messages messages--error">
                  <div class="messages__header">
                          <h2 id="message-error-title" class="messages__title">
                Error message
              </h2>
                      </div>
                <div class="messages__content">
                      Your version of Drupal is no longer supported. Upgrading is strongly recommended! See the <a href="/admin/reports/updates">available updates</a> page for more information.
                  </div>
        <button type="button" class="button button--dismiss js-message-button-hide" title="Hide" data-once="gin-messages-dismiss">
          <span class="icon-close"></span>
          Hide
        </button>
      </div>
                                  
      <div role="contentinfo" aria-labelledby="message-warning-title" class="messages-list__item messages messages--warning">
                  <div class="messages__header">
                          <h2 id="message-warning-title" class="messages__title">
                Warning message
              </h2>
                      </div>
                <div class="messages__content">
                      There are updates available for one or more of your modules or themes. To ensure the proper functioning of your site, you should update as soon as possible. See the <a href="/admin/reports/updates">available updates</a> page for more information.
                  </div>
        <button type="button" class="button button--dismiss js-message-button-hide" title="Hide" data-once="gin-messages-dismiss">
          <span class="icon-close"></span>
          Hide
        </button>
      </div>
                  </div>
</div>

Description

Fix any of the following:
The contentinfo landmark is contained in another landmark and it should be a top level landmark.

Contentinfo usually applies to things like footers.

For warnings it might be better to change from role="contentinfo" to the alert role.

The alert role is added to the node containing an alert message, not the element causing the alert to be triggered. Alerts are assertive live regions. Setting role="alert" is equivalent to setting aria-live="assertive" and aria-atomic="true". As they don't receive focus, focus does not need to be managed and no user interaction should be required.

More about ARIA alerts.

The Status role might be better for just regular errors. It is less certain though as they are described differently here.

Steps to Reproduce

1. Go to https://drupal-core.ddev.site/admin/appearance
2. Use the matching context from Conditions: admin (dark desktop, dark mobile, light desktop, light mobile), claro (dark desktop, dark mobile, light desktop, light mobile)
3. Open browser DevTools and run axe.run() in the Console.
4. Confirm rule landmark-contentinfo-is-top-level on selector .messages--error.

Expected Behaviour

Element and interaction meet the mapped WCAG success criterion.

Actual Behaviour

Fix any of the following:
The contentinfo landmark is contained in another landmark.

Impact

users with disabilities

Suggested Fix

See axe documentation.

Additional References

• Deque Axe Rule: https://dequeuniversity.com/rules/axe/4.11/landmark-contentinfo-is-top-level
• WCAG Understanding: https://www.w3.org/WAI/WCAG22/Understanding/136.html
• ACCESSIBILITY.md Trusted Sources: https://mgifford.github.io/ACCESSIBILITY.md/examples/TRUSTED_SOURCES.yaml
• WAI - Page structure and landmarks: https://www.w3.org/WAI/tutorials/page-structure/landmarks/
• Search related Drupal accessibility issues (rule + selector/template): https://www.drupal.org/project/issues/search?text=landmark-contentinfo-is-top-level%20messages--error&projects=Drupal+core&assigned=&submitted=&project_issue_followers=&status%5B%5D=Open&issue_tags_op=%3D&issue_tags=Accessibility

Testing Environment

• Browser: Chromium (via Playwright)
• OS: macOS
• Tool: axe-core via @axe-core/playwright
• Base URL: https://drupal-core.ddev.site

Tracking IDs

• Pattern ID: DRU-2E022F2F
• Instance IDs: INS-176AF555, INS-1E1F5949, INS-F35573C5, INS-90DB76B9, INS-C77800EB, INS-E1083638, INS-33B07066, INS-8F094E37, INS-35544EB1, INS-83F42AFC, INS-54574906, INS-20150FA9, INS-32AE2346, INS-6340BB49, INS-8EA427CF, INS-44531B14, INS-B015FF40, INS-91297A72, INS-73E2EA66, INS-216CF774, INS-EBE0F49A, INS-FF71DDFC