Captivate html5 accessibility - tabbing

[jamesr71028815]

I am publishing files to html5 output with accessibility turned on.  However, I am unable to get tabbing to work (I am unable to tab through screen objects)

Here are some details about my setup and file:

1. Publishing to HTML5 Output
2. When published, accessibility is set to Yes
3. Under Publish Settings, the following settings are defined:
   1. Enable Accessibility - checked
   2. Restrict keyboard tabbing to slide items only (tried with option checked and unchecked)
   3. Hide selection rectangle for slide items in HTML5 (tried with option checked and unchecked)
4. Under skin editor, Captivate 'show playback conrol' is disabled.
5. I have shape buttons that I want to tab through on the screen.  Unfortunately, the selector rectangle is not appearing when I tab through.

Has anyone ever encountered this issue?  Are there any possible workarounds?

Thank you,

JR

[Paul Wilson CTDP]

Have you checked the tab order to see if the shape buttons are available? That would be the first thing I would look at.

[jamesr71028815]

Thank you Paul for stepping in to provide your support!  I am grateful!

- Yes, I am seeing the buttons in the tab order.  I uploaded a quick prototype to demo the issue that I am having.http://learningpowerup.com/tabbingtest/tabbingTest.cptx

You will notice that all works swimmingly when publish to swf.  When I publish to html5?  Nope.

[jamesr71028815]

I'll add that I see tabbing working just fine in Google Chrome on windows (example attached).  However, I am still unable to see the selection box in Firefox or IE in Windows.

[mferguson192291]

Captivate's default keyboard focus field is not visible across most browers. You need to manually fix it in your publish course folder's CSS file. Check out my blog post here for the code: https://elearning.adobe.com/2017/05/maintaining-keyboard-focus-accessibility-tip/

[Justenuf2bdangerous]

If you're using smart shapes as buttons, you're out of luck. Smart shape buttons are not accessible - they do not respond to tabbing nor do they trigger when you select enter or the spacebar.

[jamesr71028815]

Thank you Justenuf2bdangerous.

Is this a documented bug or a conclusion that you have drawn based on your own experience?

[Justenuf2bdangerous]

I have submitted it as a bug for both Captivate 8 and Captivate 9 and had conversations in the Captivate Forum with Adobe staff acknowledging and discussing workarounds for the limitation.  If anyone here or in the Captivate Forum is able to get smart shape buttons to be accessible I would love to hear how they did it - because it would make designing navigation so much easier.

[mferguson192291]

Using Captivate 8 HTML5 format here, I have no issues with using smartshape buttons. It is the only way I can have textboxes included in the tab order. They tab just fine and I have to use Shift + Enter to activate using JAWS and NVDA. Without screen reader, the enter key suffices. I have included instructions in a navigation tutorial and random accessibility prompts throughout the course to remind screen reader users that Shift + Enter is required to activate buttons.