Side Navigation: Decorative images not hidden for screen reader users

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The decorative images are not hidden for screen reader users.

      Steps to Reproduce

      1. Open the Homepage of Confluence Cloud.
      2. Navigate to the mentioned decorative images in the "Side Navigation" section.
      3. Inspect the code of the mentioned decorative images.
      4. Notice that decorative images have textual description that is describing the decorative images. 

      Screen Recording

      https://jira.atlassian.com/secure/attachment/485191/Decorative%20images%20screen%20recording.mp4

      Actual Results

      Decorative images, such as "Home", "Recent", "Starred", and others, present in the "Side Navigation" section, have been given unnecessary textual descriptions that do not convey any additional or important information to screen reader users.

      As a result, these images receive focus from the screen reader.

      Expected Results

      Ensure that decorative images are hidden from screen readers. 

      In this case, add aria-hidden="true" to the <span> element containing the decorative images.

      Alternatively, remove the role="img" and aria-label attributes from the <span> element.

      Code Snippet 1:

      <span aria-hidden="true" role="img" aria-label="Home">
      (...)
      </span>

      Code Snippet 2:

      <span>
      (...)
      </span> 

      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 Sonoma 14.7
      Operations - Windows11
      Chrome - Version 133.0.6943.127 (Official Build) (64-bit)
      Safari- Version 18.0
      Firefox- Version 135.0 (64-bit)
      JAWS- Version 2023
      NVDA- Version 2024.4.2
      VoiceOver - Version Latest

            Assignee:
            Erika Joun
            Reporter:
            Chirag Goyal
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Created:
              Updated:
              Resolved: