Prerequisites

• Make sure the ADA Box Controls for Screen Readers V2 extension is installed in your Digioh account.

Configuring Images for Screen Readers

To make images accessible and compliant with ADA standards, you must add alternative text (alt text) that describes the image. Here’s how to set this up:

Step 1: Configure Alt Image Metadata in the Campaign Editor

Within the Campaign Editor, click on the image and locate the element metadata section.

• Metadata Key: alt
• Value: product image

Replace product image with a brief, descriptive text that accurately describes the image and its context on your site.

Example: If you have an image of a “Blue Cotton T-shirt,” your metadata configuration will look like this:

• Metadata Key: alt
• Value: Blue Cotton T-shirt

Step 2: Save Changes

1. Click the Save button to save the changes.
2. Publish the account to make the changes live.

Step 3: Verifying Your Configuration

1. Visit the page containing the image using a screen reader tool.
2. Ensure the screen reader reads out the alt text as you navigate through the images.

Metadata Controls

The ADA Box Controls for Screen Readers V2 extension includes metadata controls that let you customize certain accessibility behaviors on a per-Campaign basis. These settings are configured in the Campaign Editor under the campaign-level metadata section.

Disable Screen Reader

If there is a Campaign you want to opt out of the extension entirely, you can disable it using the following metadata:

• Metadata Key: disable_screen_reader
• Value: true
• Level: Campaign (This can be accessed from the Campaign Editor > Settings > Campaign Settings > Campaign metadata) or Page level (From the Layout tab)

Disable External Tabindex

By default, the extension assigns tabindex values to site elements that appear after an inline Campaign on the page. If your accessibility auditor requires that no tabindex greater than 0 is added to elements outside of the Digioh Campaign, you can disable this behavior using the following metadata:

• Metadata Key: disable_external_tabindex
• Value: true
• Level: Campaign (This can be accessed from the Campaign Editor > Settings > Campaign Settings > Campaign metadata)

Disable Focus Trapping on Popups

Focus trapping is enabled by default for popup Campaigns. This ensures that keyboard focus stays contained within the popup while it is open, looping back to the first element rather than escaping to the browser or background page, in line with WAI-ARIA dialog modal guidelines.

To disable focus trapping, use the following metadata:

• Metadata Key: disable_focus_trap
• Value: true
• Level: Campaign (This can be accessed from the Campaign Editor > Settings > Campaign Settings > Campaign metadata) or Page level (From the Layout tab)

Conclusion

Setting the correct alt text for images is crucial for accessibility and compliance with ADA standards. By following these steps, you can ensure that all visitors, regardless of their ability, have a better and more inclusive experience on your site.