Obstructive Tab order on Skip Links, Enter doesn't confirm Focusable selection, Page order flow not as expected.

Created on 7 March 2025, about 1 month ago

Problem/Motivation

When navigating the site via keyboard, selecting the Skip to Main Content skip link then takes me to the #main-content id selector of the page, but then the moment I continue to navigate the site via tabbing, I'm taken back up to the top of the page to the Search Site Skip Link instead of being able to freely navigate the website's headings and content. Continuing to tab through I then am forced to tab through the main menu, when the whole idea of the skip to main content skip link was to bypass that.

I've attached screenshots from my Andi Web Accessibility Testing Tool showing the tab order and where it's supposed to skip to and stay at.

Steps to reproduce

  1. Go the main page, or any page from https://new.drupal.org/home and do not use your mouse. Use only your Tab key to navigate the website. Doing so immediately brings up the 'Skip to Main Content link'.
  2. Issue: Pressing Enter to confirm doesn't take me to the #main-content part of the page.
  3. Pressing Space Bar does confirm my choice and takes me to the #main-content part of the page as is the intended behavior.
  4. Issue: Press Tab again, the expected behavior is to be able to continue to tab through the Focusable areas in the #main-content area through to the end of the page, then return back up to the top of the page and go through the main menu and content that's above the #main-content - but that's not the behavior that's happening - I'm taken out of the expected order or flow of the page and taken back up to the top and forced to the Skip to Search link, which isn't able to be elected/confirmed by pressing enter either, then trying to continue to tab through the focusable elements I'm forced to go through the main menu and all that just to return back to the #main-content area and further below the page.

Proposed resolution

  • Adjust the ability to use the Enter key to confirm focusable elements interaction
  • Adjust the Skip Link tab order - possibly allow me to choose when I'm first presented with Skip to Main Content or Skip to Search, after which, I'm then able to go to the #main-content and continue to digest the page and not forced to go through the header, main menu, etc.

The whole purpose of the 'Skip to Main Content' link is to be able to then explore the content in that area, not then unexpectedly be taken out of that page flow and be forced to Search or Tab through the entire header, menu, and content above the #main-content.

Remaining tasks

User interface changes

API changes

Data model changes

πŸ› Bug report
Status

Active

Version

1.0

Component

Accessibiilty

Created by

πŸ‡ΊπŸ‡ΈUnited States sarahlorenzen Bend, OR

Live updates comments and jobs are added and updated live.
  • Needs accessibility review

    Used to alert the accessibility topic maintainer(s) that an issue significantly affects (or has the potential to affect) the accessibility of Drupal, and their signoff is needed (see the governance policy draft for more information). Useful links: Drupal's accessibility standards, the Drupal Core accessibility gate.

Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024