• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

How to make variables in Captivate accessible?

Explorer ,
Apr 28, 2021 Apr 28, 2021

Copy link to clipboard

Copied

Greetings,

 

ISSUE:

Ok, so I need to make my Captivate output 508 compliant. I use variables in my files (Titles, 1 of <variable>, and many other use cases). However, screen readers read the variable and not the content ascribed to the variable.

 

ASK:

Is there a way to get screen readers to read the content and not the variable? Something with JavaScript to change the aria-label?

 

I will be indebted to anyone who has a good solution!

 

Thanks,
Matt

Views

496

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
community guidelines
Advisor ,
Apr 28, 2021 Apr 28, 2021

Copy link to clipboard

Copied

You could change the aria-label of something with the following script.

$("#itemName").attr("aria-label","newAriaLabel");

In the example above - itemName is the name of the item whose aria-label you want changed.

newAriaLabel would be what you want to change the aria-label to be.

 

Not quite sure how that would work for a variable, though... that is not an object on the stage.

How are you using the variable that allows it to be picked up by the screen reader?

Votes

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
community guidelines
Explorer ,
Apr 28, 2021 Apr 28, 2021

Copy link to clipboard

Copied

Thanks! I will have to figure out how to use this. Some of my titles are variables and for flashcards I use variables for the (1 of $$totNum$$).  The screen reader reads this as "One of dollar sign dollar sign ...." instead of the actual number.

Votes

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
community guidelines
Community Beginner ,
Jan 05, 2023 Jan 05, 2023

Copy link to clipboard

Copied

hello @CaliforniaSurfer were you able to figure out a solution to this? Thanks

Votes

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
community guidelines
Explorer ,
Feb 06, 2023 Feb 06, 2023

Copy link to clipboard

Copied

I execute this javascript everytime my variable changes to update the aria-label in the output.

document.getElementById('MyObjectsName').setAttribute('aria-label', MyVariablesName);

 

Votes

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
community guidelines
Community Beginner ,
Feb 06, 2023 Feb 06, 2023

Copy link to clipboard

Copied

thanks for your response @ffami . Your script makes sense, and I'd like to do this on a project-wide basis for items like the Slide Titles and page numbers, which change each time a learner enters a new slide. So would you set up a set of these set scripts to run "on-enter" of each slide. I have tried that and it didnt work, but did work when I attached the script as an action on button-click of a smart object. Which does not work well for the global project variables like Slide Title. Any thoughts? Thank you  

Votes

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
community guidelines
Explorer ,
Feb 06, 2023 Feb 06, 2023

Copy link to clipboard

Copied

LATEST

I use this to show the learners current progress in percent, which is recalculated on every slides on enter action. This would work for slide titles and page numbers as well. But it won't work for a variable as part of a longer text.
Maybe a timeout will help to make sure the object is there before trying to modify it.

setTimeout(function(){ document.getElementById('MyObjectsName').setAttribute('aria-label', MyVariablesName); }, 0200);

I guess I didn't need this because my progress bar and percentage is set to display for the rest of the project.

Please keep in mind, I don't know much about javascript, I just fiddle with stuff to fix Captivates shortcomings 😄

Votes

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
community guidelines
Contributor ,
Apr 13, 2022 Apr 13, 2022

Copy link to clipboard

Copied

Hello Captivate folks!

Say, I noticed there has not been much said about automatically getting Captivate variables to be read nicely by  readers...so I did some exploring/hacking during the ole pandemic....and wanted to share a very simple test project with you all......

 

Use the link below to test your accessibility readers to see if they will read you back actual variable values instead of the usual reading of...$$varname$$...etc.

 

NOTE: this is a very very basic demo to see how my basic idea works......if it seems to be working and you are intrested....I'd be happy to share my algorithm I came up with........I did not put tons of time in making the demo look nice and etc....its just to the point for example and testing purposes. 

 

ALL Items in highlighted in YELLOW are all objects that contain one or more Captivate variables.....

 

Very basic demo URL: https://bit.ly/3jCl0fw

 

Again, this is just a test to see how well my search and replace algorithm works.  My tests have all seem to be working smoothly.    This for sure will be geared toward advanced Captivate users who have a basic understanding of JavaScript and Captivate's internal data structures.

 

Just seeking feedback on if it works or not....if the idea seems to be working correctly....I'll share how it was done so that others better than I can make it even better....

 

Thanks in advace for your time and feedback.

 

Votes

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
community guidelines
Explorer ,
Sep 28, 2022 Sep 28, 2022

Copy link to clipboard

Copied

I'll love if you shared how you did this!  Thanks in advance.

Votes

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
community guidelines
Community Beginner ,
Jan 04, 2023 Jan 04, 2023

Copy link to clipboard

Copied

Hello. @OH_CP_Lover_&_Hacker great demo! It seems to work as intended and I'm testing with NVDA screen reader. Would you be able to share how you made it work? Thanks

Votes

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
community guidelines
Resources
Help resources