Fixing Accessibility Scan Errors in a StoryMap

Question

Hi, I'm trying to get my agency's StoryMaps into compliance with WCAG 2.2 AA. I'm currently doing accessibility scans based on WCAG 2.0 and getting some recurring errors. Are any of these fixable? 1) the contrast for text & background of embedded cards is too low. But if I try to edit the secondary background color in the custom template, I get a red circle with a line through it. Is this something I can change? Editing to add that I found a post saying this is not an option. Can I edit the text color, in that case? 2) "ARIA commands must have an accessible name (7): The focusable div elements (

that have button role attributes are not labeled." I'm not sure what is triggering this flag. Is this something a user can change or is it an inherent element of the app? 3) "Interactive controls must not be nested: The map of slider button (

) is nested inside of a focusable div element that has a button role attribute." Is this something a user can change or is it an inherent element of the app? Also, is there a WCAG 2.2 StoryMap issue checklist of issues and best practices anywhere? This would be hugely helpful and go along way toward promoting our continued use of StoryMaps. Any and all thoughts and recommendations are welcome!

AbbyE_Esri · Accepted Answer

Hi @CaitlynDavey , Thanks for  sending over your accessibility questions!

For #1, at the moment, authors are not able to change the secondary background color. However, this is something that we are hoping to allow customization for in the near future. I will keep you updated on this, but for now, making the Text color a bit darker/lighter should allow for a higher contrast between the text and background.

For #2, it's a bit harder to tell where in your item this is coming from.. Do you happen to have some inline images, a swipe element with images within it, or map tour images within your story? Based on the next point, I'm assuming you may have a swipe element.

For #3, this swipe slider was recently updated to allow proper focusable navigation on the slider element. Is this a live evaluation, or was this feedback from an accessibility check a couple of months ago?

Thanks for your patience on this response, and let me know if changing that text color for #1 works as a temporary solution!

--Abby