Side Navigation: List mark-up used incorrectly

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      List markup is used incorrectly for the "Content" section list items.

      Steps to Reproduce

      1. Open Confluence home page.
      2. Navigate to the side navigation.
      3. Navigate to the mentioned instances present in "Content" section. 
      4. Inspect the code and observe that list markup is implemented incorrectly.

      Screenshot

      Actual Results

      The list markup is implemented incorrectly for the list items in "Content" section of the side navigation. The parent <div> inappropriately uses role="list" as it contains the "Search by title" textarea and "Create" button along with the <ul> and <li> elements. However, the  <ul> and <li> correctly hold the related list items such as "demo" and "test", so the current structure creates a conflicting list hierarchy.

      As a result, screen reader users found it difficult to understand the information effectively.

      Expected Results

      The related items should be structured using correct unordered list markup so that screen reader can identify the list and list items effectively for their users.

      In this scenario, remove the role="list" from the parent <div> element so the "Search" input and "Create" button are not part of the list. In addition, if required apply styles to maintain the visual presentation of the web page.

      Code snippet:

      <div...>
      (...)
      <input aria-describedby="contentTreeSearchInfo" aria-label="Search by title" placeholder="Search by title" value="" ...>
      (...)
      <ul ...>
      <li ...>
      (...)
      <a href="/wiki/spaces/~712020dd54cd952a914c1e9b51e7057ce13d92/pages/123142146/demo" aria-current="page"...>
      (...)
      </a>
      (...)
      </li>
      </ul>
      (...)
      <button type="button" ...>(...)<span>Create</span>(...)</button>
      (...)
      </div>

      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 - Tahoe 26.6.2
      Windows - 11
      Chrome - Version 151.0.7922.108 (Official Build) (arm64)
      Safari - Version 26.2 (21623.1.14.11.9)
      Edge - Version 152.0.4191.62
      JAWS - Version 2026
      NVDA - Version 2026.1.1
      Voiceover - Version Latest 

        1. image-2026-09-10-18-03-15-320.png
          854 kB
          Neha S V S T
        2. image-2026-10-08-13-44-03-563.png
          748 kB
          Gourishankar Bhadade

              Assignee:
              Jeff Xu
              Reporter:
              Neha S V S T
              Votes:
              0 Vote for this issue
              Watchers:
              5 Start watching this issue

                Created:
                Updated:
                Resolved: