Forum Discussion
Storyline missing WCAG 2.1 compliance
Hi.
We produce e-learning for Norwegian government organizations.
They have strict rules on following the WCG 2.1 specification for accessibility.
You state that Storyline 360 follow these rules, but their review has revealed some points that do not comply with the specification:
- List items – If we format text as a list in a text box, screen readers do not recognize it as a list, indicating that it do not use the proper HTML codes (<ul> and <li> tags). We have not found any way to fix this inside Storyline.
We then fail to comply with the WCAG 4.1.1 Parsing specification. - When the uses go through a test result, viewing if their answer was correct or incorrect, a tick mark is shown to indicate what was the correct answer. It is not possible for someone with a screen reader to get this information.
We then fail on WCAG 3.3.3 Error Suggestion. - The exported HTML in the story.html also have some validation errors:
- Element style not allowed as child of element body in this context.
- Stray start tag script outside of <body>
This also fails the WCAG 4.1.1 Parsing specification.
We ask you to fix these issues so we can report to our client and the Norwegian Authority for Universal Design of ICT that the e-learning content we produce in Storyline is fully WCAG 2.1 AA compliant?
Regards
Morten
Hello Morten,
Thanks for reaching out!
For the first item, I created a simple list in Storyline 360 and tested it using NVDA, and I can confirm that the screen reader could recognize the bullet points as a list. NVDA could read the text "as a list with four items" in my sample link. Since the behavior for lists appears to be the same, I'd like to ask the following to help troubleshoot the behavior:
- Which version of Storyline 360 do you have installed?
- What screen reader are you using to read the text?
Additionally, would you be willing to share a copy of your project file so we can test the text that you have on your slides to see if we encounter the same behavior?
I opened a support case on your behalf so we can get you in touch with our support engineers. They'll be able to help test the other issues you raised and will be reaching out to you via email shortly. Feel free to share any additional details and your project file there!
- MediaFarmCommunity Member
Hi
I used version Build 3.19.29010.0.
This Project was an old project from 2016, and upgraded to this version.
Textboxes was then set to "Accessible text".
You have just the list in the text box in your test. What happens if you have a leading text in the same text box?
For example:
These countries are not a member of the EU:
-
- Norway
- Switzerland
- Iceland
I used NVDA with Norwegian voice.
Morten
Hi Morten,
Thanks for the additional details. I added this to the support ticket that I opened for you. It looks like my colleague Johnrey has already reached out - can I ask if you were able to receive his email? If you haven't responded yet, please check your spam or trash in case the message may have been filtered there.
- SarahWestphalCommunity Member
Hey Jose :)
Could you please share the project with us in which you created an unordered list? We are currently having troubles in creating a list that gets recognized by the screen reader as such an element. We already updated our project and made sure the following settings are applied to the text box:
We created a list that consists of bullet points but is not recognized as a list element because the aria label is set to hidden:true.
Any help is much appreciated at this point!
-
- SarahWestphalCommunity Member
Is anyone else here who can help me and can share a project file that contains an HTML list available for screenreaders?
- MikeB-2fa1936a-Community Member
Sarah, I was having a similar problem. I have no idea why, but JAWS was not correctly reading text blocks that only contained bullet items. The trick I've used is to make sure there is some non-bulleted text ahead of the bulleted list, such as:
Things you should do include:
- Bullet point one
- Bullet point two
- Bullet point three
Everything works fine after doing that. Hope that helps.