website icon indicating copy to clipboard operation
website copied to clipboard

Fix list structures

Open atsansone opened this issue 1 year ago • 0 comments

From https://buganizer.corp.google.com/issues/337264374

Observed Results

Navigating through the left menu specifically through the lists inside drop downs, I noticed how they are verbalized by SR.

Expected Results

Ensure that the lists from drop downs should have a correct structure in this way they will be announced better in screen readers.

<ul> and <ol> must only directly contain <li>, <script> or <template> elements

User Impact

Screen reader and Cognitive users are affected because they do not have clearly how many items are inside every list.

Steps to Reproduce

  1. Enabled VoiceOver using Command + F5 also ChromeVox using Ctrl + Alt + Z
  2. Open the following pages:
    • https://docs.flutter.dev/
    • https://docs.flutter.dev/get-started/install
  3. Continue the linear navigation using the Tab key and reach the left menu.
  4. Expanded the drop downs and listen to how the displayed list are verbalized by SR.

GAR Assessment

Flutter Docs

GAR Details

1.16. (c) Without Visible Screen (With Screen Reader)

Environment Details

Machine: MAC/ChromeBook Browser: Chrome Version 120.0.6099.272 (Official Build) (64-bit) Screen reader: VoiceOver / ChromeVox. Bug filling time: 15 mins.

atsansone avatar May 08 '24 21:05 atsansone