Highlighted

TOC and 508 issues

Community Beginner ,
Jun 12, 2018

Copy link to clipboard

Copied

Hello All!

I am creating a course that has to be 508 compliant. I am using Captivate 2017 v10.0.0.219. I am exporting to HTML5.

For the most part Captivate handles this wonderfully, however when using the TOC a host of issues arise.

The largest of which is having to navigate, by keyboard, through the entire TOC if you have it open or are starting navigation. This will cause the screen reader to read every entry in the TOC, which for the current course is close to 43 slides.

Does anyone know of a way, other than creating a completely custom TOC, to get it to behave similar to the swf exported version?

Let me know your thoughts and maybe we can figure this one out.

Thanks!

Views

158

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

TOC and 508 issues

Community Beginner ,
Jun 12, 2018

Copy link to clipboard

Copied

Hello All!

I am creating a course that has to be 508 compliant. I am using Captivate 2017 v10.0.0.219. I am exporting to HTML5.

For the most part Captivate handles this wonderfully, however when using the TOC a host of issues arise.

The largest of which is having to navigate, by keyboard, through the entire TOC if you have it open or are starting navigation. This will cause the screen reader to read every entry in the TOC, which for the current course is close to 43 slides.

Does anyone know of a way, other than creating a completely custom TOC, to get it to behave similar to the swf exported version?

Let me know your thoughts and maybe we can figure this one out.

Thanks!

Views

159

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Most Valuable Participant ,
Jun 12, 2018

Copy link to clipboard

Copied

This is not an answer to your question, but just want tell you that you are not using the most recent version which is 10.0.1.285. Please upgrade, using Help, Updates.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 12, 2018

Copy link to clipboard

Copied

Updated, will check.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
Jun 12, 2018

Copy link to clipboard

Copied

If you are going for 508 compliance the general consensus is that you need to ditch the Captivate TOC and skin.  Create your own navigation inside the stage area.  The TOC is not 508 compliant at this point.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 12, 2018

Copy link to clipboard

Copied

Yeah, this is the answer I was leaning towards as well, but I was hoping someone would have found some way to use the built in stuff, for convenience.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Community Beginner ,
Jun 13, 2018

Copy link to clipboard

Copied

I found a solution using some JavaScript that I tack on after publish. Its a bit convoluted, but it works with some of the other things we already had added onto our project. See Below.

We have a initialize function on the first slide. I added

document.getElementById("tocContent").style.height = "535px";

document.getElementById("tocFooter").style.display = "none";

document.getElementById("fullBookmark").style.display = "none";

var bookmarks = document.getElementsByClassName("tocBookmark");

for(var i=0; i<bookmarks.length; i++){

  bookmarks.style.display = "none";

}

document.getElementById("toc").style.height = "610px";

This allows me to edit the width and height of the TOC and remove the bookmarks so that screen readers and keyboard navigation ignore them.

Then in my OpenTOC function, custom but using the cpCMNDToggleTOC (or whatever its called), I added this when the TOC is closed:

document.getElementById("toc").style.width = "255px";

document.getElementById("tocHeading").style.width = "255px";

document.getElementById("tocContent").style.width = "255px";

This allows me to set the display to none which lets Screen Readers and keyboard navigation skip the TOC when it is "closed"

I know its a bit convoluted and extra, but it is workable solution, so I am posting it.

Leaving this as open for anyone who wants to add on their solution for this issue.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Resources
Captivate User Guide
New Group