Accessibility issues with Captivate

Report · Apr 27, 2015

We are creating a course using Adobe Captivate 8.0 that needs to be ADA compliant. We are facing a few issues to ensure ADA compliance. Any guidance to resolve these issues will be very helpful and appreciated.

We are not able to define tab order and enable keyboard navigation within activities(such as MCQ, drop down, etc.), clickable texts (to reveal pop-ups), hyperlinked texts.
We are not able to use keyboard to navigate to the TOC button in the published output.
Some unnecessary elements are getting focus when we use keyboard to navigate within the screen. We are not able to disable keyboard navigation from these unnecessary elements.
If a scroll appears in the menu bar, keyboard navigation is working but we can’t see the text that is placed below the screen display area (which will be visible if the user scrolls down using a mouse).
We could not find an option to increase the size of image in the table of contents area (left side menu bar)
Clickable elements are not working when the element is selected the 2^nd time – this issue occurs only when using a keyboard and not mouse.

Report · Apr 27, 2015

We are not able to use keyboard to navigate to the TOC button in the published output.

Do you mean the little button that show/hides the TOC at the top left? My first suggestion would be to make a button that show/hides the TOC using an Advanced Action. (Normally I'd suggest a smart shape button set to display rest of project, but I am not sure anymore which button types are accessible-- it has been a long time since I sat down and tried to figure out Captivate's accessibility quirks.)

Report · Apr 27, 2015

Hello,

I am just getting started with Captivate 8 (coming from a Flash background), while I have found some good and bad things in Captivate in regards to accessibility (Flash is much more accessible), I'll try to pass along a few things I have discovered in Captivate:

1. We are not able to define tab order and enable keyboard navigation within activities(such as MCQ, drop down, etc.), clickable texts (to reveal pop-ups), hyperlinked texts.

- I believe the only thing you can set the tab order of are interactive buttons. You cannot set the tab order of click boxes, etc. making them virtually useless in terms of accessibility.

2. We are not able to use keyboard to navigate to the TOC button in the published output.

- It is my understanding that the TOC is not keyboard accessible.

3. Some unnecessary elements are getting focus when we use keyboard to navigate within the screen. We are not able to disable keyboard navigation from these unnecessary elements.

- Try clicking on the "unnecessary" element then go to the icon in the upper right of the properties panel and click on "Accessibility." You will probably see the "Auto Label" is automatically checked,

uncheck this and see if it resolves your problem (don't put anything in the name box). This is somewhat similar to the Accessibility box in Flash and I suspect works somewhat like it, if you uncheck it, you

are essentially telling Captivate, don't read this item, it may take it out of the tab order. (in Flash we leave the box that says "Make Objects Accessible" checked and then in code write

myButton.tabEnabled = false;) This way the screen reader would read the text but it would not be tabbable but keep tab index for the correct "read" order. There are many things you can do in code in

Flash to control how a screen reader works.

4. If a scroll appears in the menu bar, keyboard navigation is working but we can’t see the text that is placed below the screen display area (which will be visible if the user scrolls down using a mouse).

- Sorry, I don't have an answer for you on this one.

5. We could not find an option to increase the size of image in the table of contents area (left side menu bar)

- Not sure on this one but as I stated before, it is my understanding that the TOC is not accessible.

6. Clickable elements are not working when the element is selected the 2^nd time – this issue occurs only when using a keyboard and not mouse.

- If the clickable element is an interactive button, it shouldn't be a problem, if it is not a button, who knows, that may be the issue (just a guess).

Hope some of this can be of some help. If you know how to make a quiz question keyboard accessible, please let me know, I have not been able to.

One thing I wish Adobe would do is change Captivate so that the Tab Index window and the "Accessibility" window (should really be named the "screen reader text" window) would stay up all the time instead of having to close it to click an item on the stage and see what it was named.

One of the good things I have found is the Slide Notes. Put all of your text in the slide notes and then you can use that to generate a narrator "voice" for the project slides AND as an added bonus, use the slide notes to populate the "Accessibility" (should be "screen reader text") window.

dave

Report · May 03, 2016

One caveat to your last comment concerning Slide Notes, Dave - this is the same area that gets populated when you are using close captioning in Cp 8 (not sure about 9 yet, just got our upgrade last week). If you have CC text on the slide, you can't add content in here

Report · Apr 14, 2017

Thanks, Dave. Your suggestions are very helpful.

Report · May 03, 2016

We are not able to define tab order

Tab order is established in Cp8 for the highest level of an interactive item - if you use one of the widgets, you can tab to the widget - within it, the tab function may or may not work based on how it was developed (it may use other keys, such as the arrows, shift, enter, etc.) and the ordering inside the widget will revert to the default z-read behavior. Inside a Captivate project, that default is from the upper left corner of the project and slightly up and across to the the right. That means anything "tab-enabled" will disrupt the flow - even though it doesn't show up in your tab order pop-up listing your interactives. For example, If you have active text or an image to the left and a column of interactive buttons to the right, the reader will read the text, then jump to the button that is just below the end of the text item, not directly to the top of your new column.

and enable keyboard navigation within

activities(such as MCQ, drop down, etc.) - these are only navigable using combinations of the arrow keys, the enter key, and the space bar. You're going to need to add an explanation on the specialized navigation for these items if you're using them in your course.

clickable texts (to reveal pop-ups) and hyperlinked texts - the answer is simple here (just intensely frustrating) - don't make the text active, overlay it with a transparent button - you can set your tab order, insert text in the accessibility box that make the action to be selected clear and understandable, and avoid the frustrations associated with inconsistent accessibility of hyperlinked or active text.

We are not able to use keyboard to navigate to the TOC button in the published output

The TOC is not 508 compliant, period. Even if you can tab to the button, once you're in there, there is no way to leave without tabbing through the entire TOC. A selected page will open, but the overlay will still be active and you will not be able to get to that content. Build a TOC page with "jump to" buttons for each page if you absolutely have to have a TOC, otherwise you're out of luck. As far as resizing/hiding and/or formatting the TOC open and close button, it's possible if you want to dig into the jquery.css files and find the correct lines. Haven't done that since my last foray into freelance work (they didn't need a 508 complaint format)

Some unnecessary elements are getting focus when we use keyboard to navigate within the screen. We are not able to disable keyboard navigation from these unnecessary elements.

Dave is absolutely correct on this one - if you want the screen reader to ignore the object, open the accessibility box, uncheck the auto label box and leave the TEBs blank - the screen reader will ignore the item.

If a scroll appears in the menu bar, keyboard navigation is working but we can’t see the text that is placed below the screen display area (which will be visible if the user scrolls down using a mouse).

This is why many federal agencies mark the scroll bar as a failure of 508 compliance testing. The tab behavior can't be customized to jump out of the content to the scroll bar command in the skin and then back into the content where you left off. If you have seamless tabbing enabled, the focus is going to stay inside the content and not access that second level control in the skin. The only answer is to build the screens so you don't need the scroll bar if this is an issue.

We could not find an option to increase the size of image in the table of contents area (left side menu bar)

Again, the TOC will fail 508 testing every time, but - if you want to customize the TOC image, it requires you to customize the jquery.css file associated with the TOC. you can do anything you want to the TOC (except create functionality using ARIA scripting in the widget), if you have the time, patience, skill set and money necessary to run a full custom style sheet edit.

Clickable elements are not working when the element is selected the 2^nd time – this issue occurs only when using a keyboard and not mouse.

What clickable elements aren't working?

Hope this helped a little.

Justenuf

Report · Apr 14, 2017

Thank you very much for responding to the issues. Your comments are very helpful.

Report · Oct 24, 2017

Hi,

I'm having an issue where I had alt text for my text boxes (I created them as buttons and deleted the hover and selected states). Now I need to hide those text boxes from the screen reader, but I can't do it. I have deleted the alt text, I have checked auto-label, and unchecked autolabel and left them blank. But they are still visible in the tab order and I can't seem to hide them now that they have been visible once upon a time.

Has anybody successfully fixed this issue?

Report · Oct 24, 2017

Ok I just figured it out. I just needed to uncheck the "use as button" checkbox and now they are no longer seen.