Accessibility features

Documentation sections

• Making the player accessible
• Accessibility features description
• Keyboard controls

Making the player accessible

Radiant Media Player supports accessibility features according to the WAI-ARIA recommendations. We test our player with the free NVDA screen reader.

We need your help! Making our player more accessible is a work-in-progress. Any suggestion or feedback you may have on this aspect is more than welcome. Please contact us to share your findings!

Accessibility features description

The player container is equipped with an aria-label attribute (set with player setting contentTitle) and an aria-describedby attribute (set with player setting contentDescription through a label element). The player container has an "application" role. The player can be focused with a click/touch or by cycling page elements with the tab key.

Once the player is focused you can cycle through a selection of UI elements using the tab key. Those elements currently are:

• Play/pause: "button" role with updatable aria-label (space/enter key to play/pause when focused)
• Seek bar: "progressbar" role with aria-label (left/right key to seek into content when focused)
• Volume: "button" role with aria-label (space/enter key to mute/unmute when focused - up/down key to adjust volume level)
• Fullscreen: "button" role with updatable aria-label (space/enter key to enter/exit fullscreen when focused)

We plan on adding more focusable elements with future player releases.

Keyboard controls

Below is a list of keyboard keys that can be used to control the player when the player has focused (either when clicked or selected with the tab key).

space : Play or pause the media

f : enter fullscreen

escape : exit fullscreen

left arrow : seek 10 seconds backward in the media

right arrow : seek 10 seconds forward in the media

m : mute/unmute media content

up arrow : Up volume by 10%

down arrow : Reduce volume by 10%

Disabling keyboard controls: you may want to implement your own keyboard controls based on our player API. In order to do so you will first need to disable the default player keyboard controls. This is done by setting disableKeyboardControl (Boolean) to true (default: false). As a rule of thumb we recommend to always have a keyboard controls strategy so only disable it if you are using your own custom implementation.