Select to view content in your preferred language

ARIA Labels

109
2
Wednesday
ShareUser
Esri Community Manager

I saw that Experience Builder now allows ARIA. This is great, but I am curious about a few things. From what I understand, the first rule of ARIA is to only use it when absolutely necessary.

  • After looking at the a11y templates, I noticed it wasn't landmarked. When should we landmark our apps? Always? Depends on something?
  • Are ARIA labels always on? For example, I noticed sometimes when I don't have the ARIA label box filled in, it uses the widget name
  • Are there any examples of apps with landmarks and labelling?
0 Kudos
2 Replies
ShareUser
Esri Community Manager

For ADA, aria is generally advised to give that supplemental feedback to nonsighted viewers. Doing auto and manual testing upon implementing screen reading improvements can give you some clarity on how the supplemental text impacts the use of your app for those individuals using a screenreader. 

Automated Testing: AX Tools was suggested as the automatic auditing software. Once you enable A11Y, those new ADA settings appear in each supported element and you can start building better, more compliant, tools for the public. By installing AX Tools extension and inspecting a web page in the extensions via browser's inspector window, you will be able to see what critical and non-critical warnings appear for your application.

Some false positives can show up and that is when you will want to shift to manual testing via NDVA. Specifically, you want to see exactly what order the screen reader explores your app. This is controlled through layout configuration on experience builder, but thereafter you can explore if certain elements give you problems like accordion elements, etc.  


Manual Testing: NDVA is the suggested manual auditing software to audit a web app / experience builder app for compliance. The application is lightweight and configuration rich. You can have screen reading text show up in a dialog window to expedite review. 

Anyways, I hope this helps. Take a look at this unofficial (non-ESRI) informational webpage from State of Massachussets. It pertains to the June EB Update for Aria: GIS accessibility guidance: Experience Builder | Mass.gov
I'd reference this, and follow up here if you had more quesitons about ARIA. 

0 Kudos
KlaraSchmitt
Esri Regular Contributor

Great questions. You're right that the general guidance for ARIA is to use native HTML semantics whenever possible and only add ARIA where it provides additional value. However, in the case of Experience Builder the ARIA label helps provide meaningful context to assistive technologies based on each widget's defined role. Due to each widget's defined role it's generally recommended to provide a descriptive ARIA label to each widget to help communicate the widget's purpose to more audiences. For instance, if you have two navigation menus, one might be header navigation, whereas another might be data navigation.

Regarding landmarks it is recommended to use the "Main" landmark to identify the primary content area of an ArcGIS Experience Builder application, typically below the header and above the footer. There should only be one main landmark on a page. How it is defined will be dependent on each use case/solutions.

For both labels and regions to be set you must enable the Accessibility settings for a widget, using the Accessibility (A11Y) button at the bottom of the Experience Builder interface.

As for examples, while they can certainly be helpful, there aren't universal examples that could apply to each use case. Setting labels and specifying labels should be evaluated based on the specific purpose and structure of each application to ensure your app is accurately communicating its purpose to more individuals. An example that works well for one implementation may not be appropriate for another, so it's best to apply landmarks and labels according to the needs of each individual app. Hope that helps!

0 Kudos