Making a video element with no sound accessible

Question

I am currently working on a web page with a silent video banner.

I am using the aXe Chrome browser plugin that highlights potential accessibility issues with the content of the page and it's throwing two issues related accessibility for the video element:

• Ensure <video> elements have captions
• Ensure <video> elements have audio descriptions

I just wanted to know if there are any recommendations in communicating that the video element has no audio in an accessible way.

Answer 1

video accessibility has two concerns : captions for replacing sound, and audio decription (or textual alternatives) for describing the images.

The fact that your video is silent does not mean that you do not need a textual description of what appears in the video.

1. In your case, I would look at the attribute controls="muted" which can be an hint for indicating assistive technologies that a video does not have currently any sound.

2. I will choose between one of the following:

   a) I will set the aria-describedby attribute on the video element to point to the div containing the description.

   b) OR If your video is only decorative, then I would set the aria-hidden=true attribute on a parent element