Forum Discussion
All images use aria-hidden="true" preventing users of screen reader to know what is presented.
Reviewing our vpat we had this error - All images use aria-hidden="true" preventing users of a screen reader to know what is presented.
How does Storyline 360 tag images as aria-hidden="true" and how do you remove them?
5 Replies
Grouping 2 elements in the latest update automatically uses aria-hidden for images ( or something else ) now. That for sure cannot be the intention as it makes those elements not readable for screen readers as that was not the case with the ungrouped elements.
This error message then shows in the console.
Blocked aria-hidden on an element because its descendant retained focus. The focus must not be hidden from assistive technology users. Avoid using aria-hidden on a focused element or its ancestor. Consider using the inert attribute instead, which will also prevent focus. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.Hi MathNotermans-9,
Sorry to hear you've run into this snag! I appreciate you sharing with us what you're experiencing when grouping images and being unable to have the screen reader announce these elements on your end.
Please share your .story file and a screen recording of this behavior so we can see the error message and investigate this behavior further. You can share these materials in this thread or privately in a support case.
Looking forward to hearing from you!
Hi Todd!
It sounds like you’re trying to ensure objects in your course are visible to a screen reader. I can provide a solution for that!
The way to find the label that an object has is to right-click the element, select the accessibility tab, and then you will see the Alt Text field.
This is the label that is read by the screen reader. If it is a text button, by default the Alt Text is the text content of the button.
However, before changing the Alt Text name, I would suggest making sure the box for Object is visible to accessibility tools is selected.
If that doesn’t do the trick, please let me know and I’d be happy to troubleshoot this further with you!
Thanks for reaching out!
Steve - this is not working for me either. The method above has been confirmed as turned on. But it is not fixing the issue (win 10, storyline 3.9.32893.0) I used an empty story file and add 2 images. It seems that Storyline is adding an SVG-something on top of the jpg file and that is what is failing andi. Read somewhere that SL may be compressing everything, including live text, into SVG pieces to reduce files size. That sure complicates things with accessibility.
Hi Caralyn,
Happy to help!
The "Alternative text" field in your screenshot is empty, so there is nothing for the screen reader to read. Can I ask if you've tested the behavior after adding alternative text to your objects, and is the behavior the same when you do?
