JAWS and other 508 issues

Jun 12, 2013

Hi, everyone! We recently had some Storyline prototypes reviewed by 508 compliance experts, and they discovered a few issues that we can't find solutions to. We exported for web (with no HTML5 output) and posted these on a test server.

I'm hoping for any suggestions for workarounds or ways that we can reprogram these things to work more smoothly. Any help is greatly appreciated!

Here are the issues they discovered:

1. JAWS does not see anything in the Storyline player in Firefox. It reads only "story.swf embedded object" and nothing else. When the tester tried to tab to the swf object, his keyboard locked up and he had to close the window. (This is a major problem for us!)

2. As you can see in #1 above, JAWS reads the words "embedded object" after every button, image, and text box in Firefox and IE.

3. The reading order (order of elements in the presentation as seen by the screen reader) is different from the tab order (order of elements seen when tabbing from one to the next).

4. Player controls on the embedded video are unlabeled, so it isn't clear what the controls do.

5. The "treeview" on the menu tab loses focus a lot and in some browsers, you can not "click" on the slide titles listed with keystrokes.

Thanks everyone!

6 Replies
Matthew Paquette

We are having this same issue, if I create a new story, and place a text field and a shape on the slide, and give the shape alt text, it will read the text as "text"+"graphic" and it reads the alt text in the same way "alt text graphic". While it is annoying that it keeps declaring graphic for each object I can live with that since its reading my text and alt text descriptions, but in our fully developed course it's calling everything "embedded object".

I also noticed the behavior is slightly different, with the ones it reads, when I hit spacebar my screenreader (NVDA) stops reading, in the other one it instead repeats "embedded object". Additionally our custom buttons (images with multiple states and triggers) do nothing when tabbed to and we press spacebar or enter.

Steve Flowers

Hi Matthew -

IE used to offer the only support for Flash based outputs and screen readers. The other browsers have improved but they still have lots of problems passing object descriptions to the reader. Firefox and Chrome are unusable by the screen reader when Flash is embedded for me. Nothing is being read consistently. Given these problems, I've seen plenty of folks recommend IE for consuming courseware content with a screen reader. NVDA and IE are reading tabbed objects OK for me and allowing for space bar activation of the object.

Chrome and FF unusable in the reader but this isn't unusual with Flash content. Preview will also fail to pass anything to the reader (NVDA at least). Not a Storyline / Articulate specific problem.

In IE, the space bar is being trapped by the storyline player properly. I am also getting the "description" + graphic. I believe they're using this convention because a button is read as "description" + button. I agree with you, this is pretty annoying. Would you mind putting in a feature request to improve this? I will too. Every vote counts.

The window controls (next / previous) are also not announcing when tab selected. This is a problem. But this one is surmountable with the addition of onslide or offslide buttons at the top of the slide. Advantage / disadvantage, these are read when each slide is loaded.

Matthew Paquette

Did some more testing today and come to find out, if a .story file contains a web object, 508 is kaput.

I created a new .story file, threw a text field and an image with alt text on a slide and published, NVDA read them perfectly and could even trigger click action with spacebar, I add a web object to a canvas animation and BAM, no more screenreader support at all, I can tab, but in total silence with no spacebar/enter functionality. I will be making a few feature requests, It has also bugged me that you cant layer things on top of web objects, they always assume the topmost layer no matter where they are in the timeline/layers...

Edit: Just realized you meant a feature request for NVDA, I noticed that it only says "graphic"+text when i use the arrow keys to navigate, if you simply tab to a text field it simply reads it, I'm thinking this is to let you know where you are, but it's not altogether to helpful when it considers almost everything to be the same type, although that might be because of how articulate publishes.

Steve Flowers

Hey Matthew,

Wow. That's an interesting issue. Probably has something to do with the Flash player losing focus. Might be able to add some script to the contents of the web object to make the Flash object regain focus. Need to play. Is it just for the slide that contains the web object or does the web object break the reader for the whole story?

Hadn't noticed the behavior. Thanks for pointing it out.

Kevin Dixon

I have had to worry about a lot of 508 problems using storyline. I find as far as screen readers go none of them work all the time. So I have just started recording audio files of the said object. ( i.e. describing the picture or the button in my own voice.) and playing that file with a hotspot when mouse over. also works if you tab to the hotspot. As far as the menu goes to avoid that problem I don't use it and tell client to lock down the content so the student has to visit each slide and can't jump around. And if you record your voice when it plays (it is not that 1980's War Games would you like to play a game voice) it is much more pleasant.

Matthew Paquette

Adding a web object to a course changes the swf players window mode from window to opaque, opaque window mode does not support screen readers.

I changed the window mode in story.html, it is declared as g_strWMode around line 134 of my story.html.

This makes the screen reader work again, but breaks my transparency, well not a huge deal for me web objects already assume the topmost level so now I just need to embed the background and any text that needs to appear on the animation, and then I can add hotspots behind it in articulate for 508.

But then... clicking on the web object and then on a block of text from articulate makes the whole web object disappear >.<

It's still there and if I open the dev tools and select the element selector and select ANY div in the hierarchy it instantly re-appears.

It has to have something to do with focus, anyone got any ideas on how I can make it stay on screen while in the "window" window mode?

I thought about doing something like adding a function to refocus whenever focus is lost but then I imagine the screenreader would be stuck on that element. I tried adding a z-index but that doesnt seem to be what the problem is.

EDIT: Spent all day trying to track down something in the js that changes the stacking order onfocus or onblur, there is nothing, setting z-indexes doesn't help this really feels like z-fighting to me but because it's caused by the WMode I am not inclined to think it's HTML or JavaScript related, it has to be something with the player swf's internal ordering/focusing, but I'm not positive, since at the same time I am able to target the iframe and canvas in the DOM so i would think that it's something there.

The swf gets put into a div inside of a table, the divWebObjects sits in the same level of the body as that table and contains the divs for the iframe and canvas, I've set z-indexes all throughout that and they dont seem to matter.

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