WARNING: Accessibility bug in Storyline (WCAG/508 compliance)

Nov 05, 2016

For those of you who think you have created an accessible course in Storyline, I urge you to test your published courses using a screen reader. There are two important bugs you need to be aware of as they may have caused you to breach your contractual obligations in relation to WCAG 2.0/Section 508 compliance (not to mention being extremely frustrating for your learners who rely on screen readers).

Bug #1: If you add Alt text to a button after adding a state, the Alt text doesn't work.

Bug #2: If you update Alt text on a button after adding a state, the Alt text doesn't work.

I've created a video demonstrating these bugs. Click the image below to watch it. 

Articulate Storyline WCAG 508 Accessibility Alt text not working

Articulate are aware of these bugs. While we await a bug fix, the only workaround is to do the following:

  • Ensure you add Alt text before adding states.
  • Do not attempt to duplicate a button and then update the Alt text on the subsequent buttons. Create all buttons from scratch. 
  • If you need to update the Alt text on a button at a later stage, ensure you delete the button and recreate it (and all its states and triggers) again from scratch. 

This workaround is extremely tedious and time-consuming, but at least it's better than finding out that your course is not accessibility compliant!

Please test your published courses using a screen reader (you can download a free one here) and reply to this post if these bugs have impacted on any of your work. Hopefully we can get them bumped up the bug priority list!  

83 Replies
Jeff Forrer

Question about your process used.  Did you Create a new project using the first SL file?  That is what we did, took the Template (first file), made a copy, and used that to import slides from the first one.  The reason we did this, is we duplicated the template to make another module, then removed slides not necessary.  We found the problem when we had to import a model from the Template (First file) that we did not grab initially.  When doing that, it breaks the tab order of items on the slide master only, not ones on the main timeline. Does that makes sense?  Also, used latest version of SL3.

Ashley Terwilliger-Pollard

Hi Jeff, 

Did you mean to share your template, I didn't see it attached here?

I'd love to take a look at it, as I tried to follow your steps (listed out below) and my results:

  1.  Create a new project (let's call it File A) with Slide master elements and individual items on the slide, with a custom tab order. 
  2. Create a duplicate copy of that project (called File B). 
  3. Opened File B and chose to import in a few slides from File A - (so now we've got a File BA) noted that the tab order from File a is respected and carried over
  4. Realized I missed a few slides, so imported a couple slides from File A into the combined File BA. - those slides also had the same tab order as the original File A 
  5. Just for fun - I even did the reverse. I opened File A, and imported in all the slides from File BA...tab order consistent across all of them. 

Even if you can't share the slides, a quick screen recording may help us spot something different in our testing steps. If you need to share the file privately, let me know and I'll start a support case for you. 

Jeff Forrer

Hello Ashley.One other note, when you import the slide from the other file, did you get a duplicate slide master?  In our case we do, so we apply layout of imported slide to slide master already in the file we are in, and delete the one that came with it from the other file.  Even though they are the same, it brings a copy of the slide master over from the other file.  Once we apply the slide master to the imported slide, that is when the accessibility gets reordered.Let me know your thoughts.  Thx.  I can record a video as well.

Ashley Terwilliger-Pollard

Hi Jeff, 

Yes, when you import a set of slides, we're going to carry over the slide masters...even if they're the exact same set up in the other file. Storyline is pretty smart...but not that smart to know that they're the same thing. 😉 

Deleting and applying a new master may be the cause here, and then it makes sense that the tab order would get reset as Storyline is treating it as a new set of items and going back to the default.  I would love to see your video to confirm and watch the steps your going through...but it's making a bit more sense now what's happening! 

Erin Vincent

I am also having the same issue.  My team is in the process of converting our SL2 projects into SL3 because SL3 fixes the issues with the feedback layer focus and JAWS.  However, we are now having to manually fix every close button on every slide (depending on the project I am talking hundreds of manual actions) because the Alt Text on the states doesn't pick up the alt text on timeline button.  Any idea when a fix will be made?  This is ridiculously time consuming.

Ashley Terwilliger-Pollard

Hi Erin, 

Two of the issues discussed here have already been fixed in Storyline 360, and so those fixes will be in the next update of Storyline 3 (scheduled to be released early this year, 2018). They are:

  • Fixed how JAWS 18 kept reading "not checked" even after making a selection to a question in the HTML5 output
  •  Fixed how the JAWS screen reader is not recognizing the selected state of a object

The issue with the disabled custom buttons still being accessible through keyboard navigation is something our team is continuing to investigate so we'll keep you posted here. 

Erin Vincent
Ashley Terwilliger-Pollard

Hi Erin,

Taking a look at all the ones you linked too, I think you're looking for this one: 

  •  Fixed how the JAWS screen reader is not recognizing the selected state of a object

That was fixed in Storyline 360, and that fix will be released in the next update of Storyline 3. I don't have a definitive date on the release of that yet, but we're looking at early this year. 

We'll certainly post here once it's available! 

If that's not the issue you're running into, I'd love to have you work with our team one on one. This discussion has gotten a bit long, and I don't want your issue to get lost! 

Darla Woodworth

Mark, so nice that you posted the comment, "The way around it is to edit the state and then put the alt text on the object in the state."  We have an interaction with pictures and NVDA keep reading every picture as "picture 2."  Could NOT figure out where the words "picture 2" were coming from. Now it reads the alt text of picture's selected state.  It works beautifully with NVDA.

Erin Vincent

Following up on the fix for this issue. My team is on pause for conversion from SL2 to SL3 which we need to do for 508 compliancy. I don't want them to convert because the hassle of changing every single "close button" is insane! We are talking about 50-100 manual actions per project and we have over 200+.  See my post from 3 months ago.  I have SL3, not 360.

Thanks

Erin Vincent

Hi Leslie,

Thanks for the quick reply.  The last thing I see is from Ashely Terwilliger (Staff) from 3 months ago which states "The issues was fixed in 360 and a release is the next update of SL3 is coming but we don't have a definitive date, we are looking at early this year.

Just for clarification, the issue we are having is when we convert our SL2 projects to SL3 we have several layers on each slide which include close buttons.  Once the project is converted from SL2 to SL3, the close buttons no longer read close, they read "button 2 button" when using JAWS.  Apparently the conversion from 2 to 3 changes the alt text in the states.  We know how to manually fix it. We have to go into each state of each close button and manually change the Alt Text from "Button 2 button" to "close".  The issue is we are talking about around 100+ manually actions on over 200+ projects.  We simply don't have the man hours to make these adjustments.

Let me know if you would like an example to test with JAWS.

Thank you

Leslie McKerchie

Hi Erin,

Thanks for popping in with some additional details.

I'm not sure I'm fully understanding the issue your are seeing and I want to be sure we do have this reported.

Would you be able to share a sample .story file from Storyline 2 since you mention it is working correctly? We could then update to Storyline 3 for testing.

If you cannot share here in the forums, I recommend sharing here privately so that we can prevent any further confusion as this thread grows.

Erin Vincent

Leslie,

What's happening is in our template in SL2 we have close buttons that have Alt text on the timeline layer and nothing on the state layers (i.e. normal, hover, visited, etc.) and JAWS reads everything fine.  When we convert our projects to SL3, to conversion adds the words "button 2" "button 3" "button 4'' to the states for the close button. When JAWS first gets to the slide the focus is on the "normal" state which reads "button 2" instead of close. Every time we convert a project we have to manually edit every close button on every slide.

See images and projects uploaded

Crystal Horn

Hi Erin - perfect job explaining what you're seeing.  I was easily able to replicate this issue in the conversion of your project to SL3 on my end.

We have this behavior documented, and we're working to prioritize it based on impact.  I've included your experience in our record, especially the effort it takes on your end to manually adjust the alt text.

We'll update this discussion with any new information as we get it.

Bob O'Donnell

Crystal, We had a similar situation in 360. I would think this applies to Erin's issue - assuming I'm reading her procedure correctly. We fixed a single "Close" button and then copied and pasted it across every slide where it appeared. Copy and paste worked fine once a single source button was corrected. We did spot check it initially to make sure it worked so we didn't need to physically edit every button. It too had to be done across many slides but it went quickly using that process.

Maria Aceituno

We are still having this issue, we use Storyline 360 and JAWS as a reader. It is reading the image file name instead of the alt tag. The work around that we had to do was to delete the visibility of all the images, the triggers, and set buttons set back to none. Then we followed Jonathan's advice of putting "an invisible rectangle on top of a real button that has the triggers you originally had on the real button underneath it and remove accessibility from the real button and add the ALT text to what is now essentially an invisible button on top of your real button." This is very tedious work and let me tell you that our team is not happy of having to have to redo so much work because this feature is not working correctly and it has been a known issue for over a year. Please get this bug fixed! 

This discussion is closed. You can start a new discussion or contact Articulate Support.