ADA and AODA compliance using Sitecore Content Hub Image Alt tags

We are currently working with one of our customer on the AODA compliance. As we are migrating content from our Sitecore XP to Sitecore Content Hub, we realized that the Image Alt tags which are usually different from the Name or the Title of the image.

In our case, the Title of the image is used by the Content Authors for searching and internal purposes. This meant that we need to use the custom Alt field on Content hub as the Alt, when an image is selected on Sitecore XP.

First, we tried looking into customizing the Sitecore DAM Connector. The Sitecore DAM connector has two parts, one which is implemented as Commands and the other which is implemented using JavaScript.

When you upload your Images to Sitecore Content Hub DAM, it adds the Filename and Title automatically while processing the upload. The results differ based on the metadata of your images. Here is an example. Content Hub DAM Upload

In our case, we added an additional field called Alt to store the proper compliant text. Once we add it to the M.Asset schema, we can add a value in the field. Content Hub DAM New Alt Text

Lets take a look at how this looks in the Sitecore XP by using the Sitecore Content Hub DAM Connector. Insert from Sitecore DAM

Choose a Public Link

Improper Alt Tag

As you can see, it uses the title by default. As mentioned, we tried to find a solution by customizing the Sitecore Content Hub DAM connector. Thanks to Yannick Wautelet and Sumith Damodaran, we found a solution which did not need any code but you do need the Super User access to your Sitecore Content Hub instance.

Go to the Manage section and select the Pages section. Select Sitecore DAM Connect page. You would have to do the following actions on Approved Assets and Pending Approval.

sitecore dam connect page

search component

output section

choose file to insert

select public link

Here change it to the Alt field you want to use. change to alt field

Also add the Alt field to the fields collection. add alt field

Once this is done, head back to your Sitecore CMS and select the asset. You will see the value from your Alt showing up. correct alt text

Accessibility for Ontarians with Disabilities Act - AODA

The standards of the AODA mandate how organizations must remove and prevent barriers for people with disabilities. The AODA standards govern how organizations can offer services that meet the needs of all Ontarians, including citizens with disabilities.

Section 14 Accessible Websites and Web Content - defined the requirement for the website content.

By January 1, 2021, all internet websites and web content must conform with WCAG 2.0 Level AA

The Americans with Disabilities Act - ADA

The Department of Justice published revised ADA Compliance regulations for Titles II and III of the Americans with Disabilities Act of 1990 (ADA) in the Federal Register on September 15, 2010. These ADA Compliance regulations adopted revised, enforceable accessibility standards called the 2010 ADA Standards for Accessible Design “2010 Standards”.

If you have any questions, please get in touch with me. @akshaysura13 on twitter or on Slack.

Web Content Accessibility Guidelines (WCAG)
The Act (AODA)
Complying with AODA WCAG 2.0 Distinguishable Content
Image text alternatives (“alt text”)

Follow us on Twitter
Follow us on LinkedIn
Follow us on YouTube