Hi all - I am helping my team meet WCAG 2.0 requirements for a customer with courses created in Articulate Storyline 360. According to the WCAG VPAT for Storyline, the following standard is author controlled: 4.1.2 Name, Role, Value.
How is this controlled/changed/edited, and how could we ensure this is changed through the tool and not through manually changing any of the output (published files/code)?
For example: how would we change the values for the following attributes for aria-describedby="unspoken" or aria-labelledby="label-1-0-5"?
It's a lot to go through, but in short, as the Storyline author you'd want to look at using alt text or on-screen text, especially for interactive objects like text entry. Doing so will ensure that learners with assistive technologies know what that field is for.
Also, as I understand it, ARIA is a subset of standards within WCAG 2.0. WCAG 2.0 and ARIA are not one in the same, and Storyline currently supports the WCAG 2.0 standards.
So if I tab to a hidden button and have alt descriptive text on that hidden button, the screen reader (i.e. JAWS) would read the descriptive text ? Is this correct?
This article outlines how we’ve optimized Storyline 2 and later to support WCAG 2.0 criteria, Levels A and AA.
You may also find this video tutorial helpful on how to make Storyline 360 courses that support Section 508 and WCAG accessibility guidelines using closed captions, tables, alt text, custom tab order, and more.
We're working on a number of accessibility enhancements for Storyline and making great progress. To help with that, we've been consulting our customers about specific needs and have identified a range of improvements we can make, although I don't have specifics to share yet, I'll let them know about your concerns for support of WCAG 2.1.
The WCAG 2.1 statement 1.3.4 on Portrait and Landscape support: SL has that now. Others maybe not yet, and others are up to the author. Statement 1.4.10 Reflow: SL has that now.
Then there are areas I'm not familiar with: 2.1.4 Character Key Shortcuts, 2.5.1 Pointer Gestures, many more. It isn't terrible not to support all these points. How can I get a list of what is supported?
Thanks, Sam. I didn't want to mess with your document formatting, so here's the list of WCAG 2.1 criteria with notations on if it's supported or not applicable to Storyline. The only ones we don't have support for are 1.3.5 and 1.3.6, but we'll keep you posted if that changes!
1.3.4 Orientation (AA) - Supports 1.3.5 Identify Input Purpose (AA) - Does Not Support 1.3.6 Identify Purpose (AAA) - Does Not Support 1.4.10 Reflow (AA) - Supports 1.4.11 Non-Text Contrast (AA) - Supports 1.4.12 Text Spacing (AA) - Not Applicable 1.4.13 Content on Hover or Focus (AA) - Supports 2.1.4 Character Key Shortcuts (A) - Supports 2.2.6 Timeouts (AAA) - Supports 2.3.3 Animation from Interactions (AAA) - Supports 2.5.1 Pointer Gestures (A) - Supports 2.5.2 Pointer Cancellation (A) - Supports 2.5.3 Label in Name (A) - Supports 2.5.4 Motion Actuation (A) - Not Applicable 2.5.5 Target Size (AAA) - Supports 2.5.6 Concurrent Input Mechanisms (AAA) - Supports 4.1.3 Status Messages (AA) - Not Applicable
It would be much more helpful to course authors if there were links to documentation that describes the supported features in detail. For example, I have no idea about learner keyboard shortcuts.
Are you looking for specific shortcuts to use with Storyline and focused on accessibility? It may depend on the browser and any screen reader tools you're using, but keys like Tab, Enter, Space Up/Down arrows are all ones you can use with Storyline and a screen reader to navigate around.
You'll also find a mention in this article on designing accessible courses about how you could add in your own keyboard shortcuts for learners.
HTML and HTML5 websites that offer keyboard shortcuts don't require a screen reader to do the shortcut. Tabs or special keys can step through or invoke specific links like: next page or previous page, pause, play.
So what I've gleaned is that Storyline's player doesn't have built-in keyboard shortcuts for player controls.
Wendy's correct - you can use the tab key (and Enter, Space, Up/Down) arrows to navigate around without a screen reader. You can also easily add in your own keyboard shortcuts if you'd like your learners to navigate with particular keys.
We've worked through all the WCAG 2.1 criteria for Storyline 360, which has more features such as closed captions and custom tab order. If accessibility is important for a course that you're building, especially WCAG 2.1 support, I would recommend using Storyline for its robust accessibility features instead of Studio. Would that be an option for you?
We're still working on additional accessibility enhancements, so until those are finalized we're holding off on updating that documentation and article. We'll keep you posted here!
36 Replies
Hey Tim,
You've got quite the task on your hand, so I'm happy to help break it down further.
I'd start by taking a look at the description of standard 4.1.2 here.
It's a lot to go through, but in short, as the Storyline author you'd want to look at using alt text or on-screen text, especially for interactive objects like text entry. Doing so will ensure that learners with assistive technologies know what that field is for.
Also, as I understand it, ARIA is a subset of standards within WCAG 2.0. WCAG 2.0 and ARIA are not one in the same, and Storyline currently supports the WCAG 2.0 standards.
So if I tab to a hidden button and have alt descriptive text on that hidden button, the screen reader (i.e. JAWS) would read the descriptive text ? Is this correct?
I meant a transparent button not hidden
Hi there Joe,
Yes, that's right! Be sure the button appears on the slide tab order, and JAWS will read the alt text when you tab to the button.
Where is the WCAG VPAT for Sl 360?
This post was removed by the author
Hi Sam,
This article outlines how we’ve optimized Storyline 2 and later to support WCAG 2.0 criteria, Levels A and AA.
You may also find this video tutorial helpful on how to make Storyline 360 courses that support Section 508 and WCAG accessibility guidelines using closed captions, tables, alt text, custom tab order, and more.
Is Articulate planning on including the checklist of compatibility with WCAG 2.1? Other authoring tools have already published theirs.
https://www.w3.org/WAI/standards-guidelines/wcag/new-in-21/
WCAG 2.1 was released January 2017 almost 2 years ago.
We're working on a number of accessibility enhancements for Storyline and making great progress. To help with that, we've been consulting our customers about specific needs and have identified a range of improvements we can make, although I don't have specifics to share yet, I'll let them know about your concerns for support of WCAG 2.1.
The WCAG 2.1 statement 1.3.4 on Portrait and Landscape support: SL has that now. Others maybe not yet, and others are up to the author. Statement 1.4.10 Reflow: SL has that now.
Then there are areas I'm not familiar with: 2.1.4 Character Key Shortcuts, 2.5.1 Pointer Gestures, many more. It isn't terrible not to support all these points. How can I get a list of what is supported?
We have to respond to an RFP with WCAG 2.1 compliance.
We've put a table into Word of the 2.1 points and done our best guess as to what is supported.
Would you take a look at the attached document to let us know if we've overstated anything?
Thanks, Sam. I didn't want to mess with your document formatting, so here's the list of WCAG 2.1 criteria with notations on if it's supported or not applicable to Storyline. The only ones we don't have support for are 1.3.5 and 1.3.6, but we'll keep you posted if that changes!
1.3.4 Orientation (AA) - Supports
1.3.5 Identify Input Purpose (AA) - Does Not Support
1.3.6 Identify Purpose (AAA) - Does Not Support
1.4.10 Reflow (AA) - Supports
1.4.11 Non-Text Contrast (AA) - Supports
1.4.12 Text Spacing (AA) - Not Applicable
1.4.13 Content on Hover or Focus (AA) - Supports
2.1.4 Character Key Shortcuts (A) - Supports
2.2.6 Timeouts (AAA) - Supports
2.3.3 Animation from Interactions (AAA) - Supports
2.5.1 Pointer Gestures (A) - Supports
2.5.2 Pointer Cancellation (A) - Supports
2.5.3 Label in Name (A) - Supports
2.5.4 Motion Actuation (A) - Not Applicable
2.5.5 Target Size (AAA) - Supports
2.5.6 Concurrent Input Mechanisms (AAA) - Supports
4.1.3 Status Messages (AA) - Not Applicable
Well thanks! This is all we need to respond.
It would be much more helpful to course authors if there were links to documentation that describes the supported features in detail. For example, I have no idea about learner keyboard shortcuts.
Perfect - happy to hear it Sam!
I'll let the team know you're hoping for some official documentation and as we add more support, we'll be sure to keep those things updated.
Is there no documentation on the web for keyboard shortcuts?
Hi Sam,
Are you looking for specific shortcuts to use with Storyline and focused on accessibility? It may depend on the browser and any screen reader tools you're using, but keys like Tab, Enter, Space Up/Down arrows are all ones you can use with Storyline and a screen reader to navigate around.
You'll also find a mention in this article on designing accessible courses about how you could add in your own keyboard shortcuts for learners.
HTML and HTML5 websites that offer keyboard shortcuts don't require a screen reader to do the shortcut. Tabs or special keys can step through or invoke specific links like: next page or previous page, pause, play.
So what I've gleaned is that Storyline's player doesn't have built-in keyboard shortcuts for player controls.
Using the tab key will select the player controls Peek
Is there any defacto standard keyboard shortcuts for Prev/Next Play/Pause?
Some player keyboard shortcuts from YouTube and NIH
Hi Sam,
Wendy's correct - you can use the tab key (and Enter, Space, Up/Down) arrows to navigate around without a screen reader. You can also easily add in your own keyboard shortcuts if you'd like your learners to navigate with particular keys.
Will there be any updates to this page regarding WCAG 2.1?
https://articulate.com/support/article/articulate-studio-and-web-content-accessibility-guidelines-wcag
Great question, Jessi!
We've worked through all the WCAG 2.1 criteria for Storyline 360, which has more features such as closed captions and custom tab order. If accessibility is important for a course that you're building, especially WCAG 2.1 support, I would recommend using Storyline for its robust accessibility features instead of Studio. Would that be an option for you?
Hi Alyssa,
I actually do use Storyline and I meant to link this page:
https://articulate.com/support/article/articulate-storyline-and-web-content-accessibility-guidelines-wcag
The page doesn't have the newest WCAG items included. Such as the ones Ashley listed above:
1.3.4 Orientation (AA) - Supports
1.3.5 Identify Input Purpose (AA) - Does Not Support
1.3.6 Identify Purpose (AAA) - Does Not Support
1.4.10 Reflow (AA) - Supports
1.4.11 Non-Text Contrast (AA) - Supports
1.4.12 Text Spacing (AA) - Not Applicable
1.4.13 Content on Hover or Focus (AA) - Supports
2.1.4 Character Key Shortcuts (A) - Supports
2.2.6 Timeouts (AAA) - Supports
2.3.3 Animation from Interactions (AAA) - Supports
2.5.1 Pointer Gestures (A) - Supports
2.5.2 Pointer Cancellation (A) - Supports
2.5.3 Label in Name (A) - Supports
2.5.4 Motion Actuation (A) - Not Applicable
2.5.5 Target Size (AAA) - Supports
2.5.6 Concurrent Input Mechanisms (AAA) - Supports
4.1.3 Status Messages (AA) - Not Applicable
Hi Jessi,
We're still working on additional accessibility enhancements, so until those are finalized we're holding off on updating that documentation and article. We'll keep you posted here!