Header: Bookmark links do not work

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The "Skip to: Top Bar," "Main Content," "Sidebar," and "Space navigation" links are not keyboard-operable.

      Steps to Reproduce

      1. Open the Jira Cloud homepage.
      2. Navigate to the header section and press Shift+Tab to access the skip links.
      3. Use the Tab key to sequentially navigate through the "Top Bar," "Main Content," "Sidebar," and "Space Navigation" links.
      4. Try to activate each link using the Enter key.
      5. Observe that the focus remains on the activated link.

      Screenshot

      Screen Recording

      https://www.loom.com/share/da714223f8444e5c9430e33ad917d1da

      Actual Results

      The bookmark links in the skip navigation, including "Top Bar," "Main Content," "Sidebar," and "Space Navigation," are non-functional. These links use dynamically generated href attributes such as "#_R3i9955jal9" instead of stable, predictable IDs. Also, the target elements are missing or lack the attribute tabindex="-1," preventing keyboard focus from moving when activated. As a result, when activating these links, the keyboard focus remains on the links themselves instead of moving to the respective section.

      This resulted in keyboard-only and screen reader users not being able to navigate to different sections of the page quickly.

      Expected Results

      When users activate the bookmark links, focus should move to the respective section. 

      Apply the following changes ->

      • Provide a unique "id" attribute to the target container.
      • Ensure that the href attribute of <a> tag properly references the target container.

      Code Snippet:

      <!-- Top bar -->
      <header id="skip-target-topbar" tabindex="-1" aria-label="Top bar">
        ...
      </header>
      (...)
      <ol>
      <li><a href="#skip-target-topbar">Top bar</a></li>
      ...
      </ol>

      Note: This code example is intended only as a general illustration of how to address the violation and should not be considered a complete or production-ready solution. If you have any questions, please attach this ticket to a #help-accessibility request.

      Workaround

      Currently there is no known workaround for this behavior. A workaround will be added here when available.

      Environment

      MacBook Pro (16 inch, 2021)
      macOs 26.5.1
      Windows - 11 pro
      Chrome - Version 148.0.7778.97 (Official Build) (arm64)
      Safari - Version 26.5 (21624.2.5.11.4)
      JAWS - Version 2026
      NVDA - Version 2024.4.2.35031
      Voiceover - Version Latest

              Assignee:
              Unassigned
              Reporter:
              Anusooya .
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

                Created:
                Updated: