[wp-meta] [Making WordPress.org] #7645: Skip to Content Button Not Working

[Making WordPress.org]

#7645: Skip to Content Button Not Working
--------------------------+--------------------
 Reporter:  sharonlynn    |      Owner:  (none)
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:
Component:  Handbooks     |   Keywords:
--------------------------+--------------------
 The "Skip to Content" button is not functioning as expected. When clicked,
 it does not navigate to the main content area. This issue impacts keyboard
 users and screen reader users, hindering accessibility compliance.


 **Steps to Reproduce:**
 Open this link: https://make.wordpress.org/core/handbook/
 Press the "Tab" key until the "Skip to Content" button is focused.
 Press "Enter" to activate the "Skip to Content" button.


 **Expected Behavior:**
 The page should scroll to the main content area, providing a direct link
 for users to skip repetitive navigation links.


 **Actual Behavior:**
 The button does not perform any action. The page does not scroll to the
 main content area.


 **Possible Cause:**
 The main content area is wrapped in a div with the ID #primary. The "Skip
 to Content" button may not be targeting this ID correctly.


 **Technical Details:**
 Page URL: https://make.wordpress.org/core/handbook/#content


 **Skip to Content Button HTML:**
 <a id="wporg-skip-link" class="skip-link screen-reader-text user-typed"
 href="#content" data-selector="#content">Skip to content</a>


 **Main Content Area HTML:**

 {{{
 <div id="primary">
 <!-- Main content goes here -->
 </div>
 }}}


 **Suggested Solution:**
 Update the "Skip to Content" button to target the correct ID:

 {{{
 <a href="#primary" class="skip-link">Skip to content</a>
 }}}


 **Environment:**
 Browser(s): Chrome: Version 125.0.6422.61, Safari: Version 17.4.1 and
 Firefox (more issues with keyboard tabbing with the most of the navigation
 unable to reach Skip Content button, and the first part of the navigation

 **OS:** Apple M1 Pro
 **Device:** Desktop, Mobile
 **Screen Reader:** VoiceOver


 **Additional Notes:**
 This issue affects the accessibility of our website. Resolving it will
 ensure compliance with accessibility standards and improve the user
 experience for all visitors.

-- 
Ticket URL: <https://meta.trac.wordpress.org/ticket/7645>
Making WordPress.org <https://meta.trac.wordpress.org/>
Making WordPress.org