Section 508 Compliance with the JavaScript API?

7794
30
06-25-2015 10:23 AM
Kathleen_Crombez
Occasional Contributor III

We have several web mapping applications built with the ESRI JavaScript API that are now required to be WCAG 2.0 AA / Section 508 compliant.

There are several issues I am running into.

1 - How do I bring focus to the map with the tab key?

I have tried this...

<div id="mapDiv" tabindex="0" onkeyup="document.getElementById('mapDiv_container').focus()"></div>

This solution will (sort of) work after pressing enter and the down arrow several times...

However, this only works when the mouse is hovering over the map.

This seems silly, because it really defeats the purpose of keyboard navigation.

2 - How can I make the keyboard navigation work when the mouse is not hovering over the map?

3 - How can I set focus to the zoom slider buttons?

4 - How can I add alt tags to the images that are rendered for the map layers?

5 - How can I add widget roles to the map container, graphics layers, and the zoom slider buttons?

I am using the AInspector add on for firefox to test my site.

These are all issues that are coming up on the most simplest map you can make with the JavaScript API.

More complex maps have additional issues, but I am interested if anyone knows how to handle these basic issues that every map has.

Any help would be most appreciated.

0 Kudos
30 Replies
SteveCole
Frequent Contributor

I don't have an answer for making a JS API app compliant but perhaps give this ESRI produced PDF a look:

ArcGIS Online Voluntary Product Accessibility Templates (VPATs)

It's a link off of a more general page (this and this). Perhaps one could argue that if even ESRI states that certain aspects of a web map cannot be 508 compliant, maybe they'll be less hardline about the entire app being compliant.

Steve

Kathleen_Crombez
Occasional Contributor III

Steve,

I appreciate your reply, but...

I have some very customized applications that are not easy to duplicate in ArcGIS Online.

For example, when a user selects a tax parcel, I do some advanced queries to display a table with all the tax information, along with the taxing districts that spatially intersects the parcel, and additional information contained in separate SDE tables and layers. Sure I could add all the layers, turn on the popups and force the user to tab through all the popups. But that is not as user friendly as displaying all the information in a nicely formatted table.

Additionally, most of the issues I have with the JavaScript API also come up as errors in ArcGIS Online. As a matter of fact, there are even more issues with ArcGIS Online maps because I find them difficult to customize and even when using the Web App Builder for Developers, we don't have access to all the source code.

So, I really don't understand how ESRI can claim ArcGIS Online is Section 508 compliant. You still cannot navigate the map with the keyboard unless the mouse is hovering over the map. What if the user does not have a mouse due to limited mobility?

This is even an issue with the WCAG Application Template.

I think ESRI needs to test some of their applications with some of the ADA heuristic tools available (such as AInspector, WAVE, etc...) and clean up their code to meet the standards we are being forced to comply with.

0 Kudos
SteveCole
Frequent Contributor

I'm sorry this wasn't more clear- my intent with sharing the link was just to provide some supporting documentation about 508 compliance and web maps, and specifically the point (which you get) which is that there are just some things inherent with web maps that just can't be made accessible. ESRI states this in the document, and I thought it might be of some value in your discussions with those above you whom are instructing you to make your apps compliant.

Certainly you CAN add alt text to images (your point #4) via JS but I don't see how that is useful for rendered image depictions of the map. Certainly a form of parcel information such as what you described in your follow up example is a different story and for that, you can use SPAN tags and utilize the title attribute.

Interesting behavior that you describe with ArcGIS Online. I've used ArcGIS Explorer Online (which I think is slated for replacement) and in that application, you CAN use the map without the mouse physically being over the map. It seems to work as long as the browser tab is active. Anyways, I was hoping to provide some ammo to possibly help you get out of having to do some of this work.

Kathleen_Crombez
Occasional Contributor III

I do appreciate all the information and replies.

Unfortunately, we were "randomly selected" to be audited from the US Department of Justice. Their initial agreement they sent us was super strict and required 100& compliance within 3 months. Thankfully we were able to negotiate the timeline but we really couldn't get them to budge on the requirements.

For the most part, ESRI has done a good job with making ArcGIS Online compliant. There are just certain things that could easily be fixed on their end, that makes life very difficult to developers.

For example, the search <input> box for the geolocator does not have a label. Certain widgets do not have roles. The site does not have a language code. No Landmarks are defined. These are just a few issues I have found.

And maybe I am being naïve, but I am finding it difficult to access the embedded DOM elements that do not have an id.

ChrisSergent
Regular Contributor III

For ArcGIS Online, have you considered downloading Web AppBuilder for ArcGIS (Developer Edition) - Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers

You publish your ArcGIS Online web map into a web app and then modify the application's code for compliance.

0 Kudos
Kathleen_Crombez
Occasional Contributor III

Yes, we are using the WAB Developer Edition. but you are limited to what you can modify. ESRI does not seem to provide full access to all the source code.

0 Kudos
ChrisSergent
Regular Contributor III

If there is code that you can't access, Robert Scheitlin, GISP​ could probably help you with that. I thought that I couldn't access code until I realized I did not have the Dev Edition which displayed after I installed it.

0 Kudos
Kathleen_Crombez
Occasional Contributor III

Everyone has provided some interesting discussion about ArcGIS Online.

But I really need a solution that is easy and intuitive for navigating the map via keyboard only that works in the JavaScript API.

RobertScheitlin__GISP
MVP Emeritus

Kathleen,

   If you have specific questions regarding WAB the WAB community will be more than happy to assist, Just post questions to the WAB space Web AppBuilder for ArcGIS