All Collections
Layout Manager
DIGIDECK Accessibility
DIGIDECK Accessibility

How to set Accessibility Labels (aria-label)

Will Matysik avatar
Written by Will Matysik
Updated over a week ago

Some presentations will benefit from the inclusion of Accessible Rich Internet Applications (ARIA) labels to help screen readers understand and narrate what the content of a slide is to a viewer with a visual impairment. Many components available through the DIGIDECK have ARIA label capabilities built-in, which can be easily accessed through the component's settings menu. Any text entered in this text field will be read out loud to a viewer who has a screen reader enabled in their browsing experience. The full list of supported components include:

Next Slide Button Component

Previous Slide Button Component

Presentation Logo Component

Logo Lockup Component

To locate the Image Accessibility Label per each component, begin by clicking Layout at the bottom left, select the component you wish to enable Accessibility for, and then click Settings:

Next, within the component settings find the Image Accessibility Label and insert the corresponding text. Click Save within the menu and the text you have entered will now be read by all ARIA capable screen readers.

Leveraging Tabindex for Accessibility=

Keyboard accessibility is one of the most critical aspects of web accessibility. People who use a modified keyboard or have a visual impairment rely on the keyboard tab index to navigate web pages and access content. Setting a unique number for each component's tab index determines the order in which that element will become selected as the user tabs through the page. The full list of supported components include:

Rich Text Component

Next Slide Button Component

Previous Slide Button Component

Chapter Slide Menu Component

Chapter Menu Component

Chapter Image Menu/Display Component

Presentation Logo Component

Logo Lockup Component

Image Rotator Component

Audio Player Component

Video Player Component

To locate the Tab Index per each component, begin by clicking Layout at the bottom left, select the component you wish to enable Accessibility for, and then click Settings (same first step as above).

Next, within the component settings find the Tab Index field. This number determines how many times a viewer would need to select Tab before landing on this component.

Did this answer your question?