Forum Discussion

PaulGlenn's avatar
PaulGlenn
Community Member
2 years ago

Sub-Bullets Not Being Identified by Screen Reader Software

Our courses require accessibility for learners who use screen reading software. When creating a list of nested sub-bullets, we've found that sub-bullets are not identified by NVDA or JAWS, but are i...
storyline 360
PaulGlenn's avatar
PaulGlenn
Community Member
2 years ago

Hi, Eric. Thanks for your reply. I've attached two files, each containing the same nested lists. One is a Storyline file, and the other is an HTML file. Although the content and layout is identical, the screen reader announces them differently. 

Here is a transcript of how NVDA announces each page, with differences noted in bold.

HTML Version

"Each team will have one chance to score."
     "List with four items:"
          "Bullet: The blue team goes first."
          "Bullet: The red team goes second."
               "List with one item:"
                    "White bullet: All players must be on the field."
               "Out of list."
          "Bullet: The green team goes third."
     "Out of list."
"When all teams have attempted to score, the game ends."
 

Storyline Version

"Each team will have one chance to score."
     "List with three items:"
          "Bullet: The blue team goes first."
          "Bullet: The red team goes second."
               "List with one item:"
                    "Bullet: All players must be on the field."
               "Out of list."
          "Bullet: The green team goes third."
     "Out of list."
"When all teams have attempted to score, the game ends." 
 
As the HTML version is coded according to W3 Web Accessibility Initiative guidelines, one assumes that is the correct structure and reading. I just need to figure out what's causing the inconsistency.
 
(Regarding my original comment: This issue was flagged for me by a JAWS user, who noted: "JAWS does not read the indented list as a nested list. Therefore, it appears that it is one long bullet list." I don't think that's what I'm seeing here with NVDA, but the two files are being read differently, at least. I don't have access to JAWS, but a colleague who does is going to review these two test files next week, and I can report back with those results if you like.)
 
Thanks again, and I look forward to your reply.

 

EricSantos's avatar
EricSantos
Staff
2 years ago

Hello Paul!

Thank you for your detailed reply with the HTML file and Storyline project! I looked into it, and I'd like to share my findings. The w3.org code structure for nested lists shows that the sub-bullets should be nested within one of the bullets. The sub-bullet's beginning and closing tags (<ul> ...  </ul>) should be within its enclosing bullet's beginning and closing tags (<li> ... </li>) 

I opened the HTML file you shared in Google Chrome and inspected it to see the code structure. The supposed sub-bullet (<ul> ... </ul>) is not treated as such because the closing tag of the bullet above does not enclose it, and therefore is not treated as a sub-bullet. This explains why the screen reader reads 4 same-level items instead of just 3, with a sub-bullet.

I published the Storyline project to Review 360 and viewed it in Google Chrome. The inspect element shows the correct w3.org structure; there are 3 items (bullets) and one sub-bullet nested within the second item, which the screen reader correctly announces. 

This is reflected in my tests as well using NVDA Version 2023.3.0.29780 with the transcript below:

Each team will have one chance to score.
list with 3 items 
•The blue team goes first.
•The red team goes second.
list with 1 item 
•All players must be on the field.
out of list 
•The green team goes third.
out of list 
When all teams have attempted to score, the game ends.

Please let me know the findings of your colleague as well, and how they are expecting the screen readers to announce the sub-bullets so we can investigate further as needed.

Related Content