Descriptive text transcript

A descriptive text transcript is a full text equivalent of the content in a video — that is, of all the meaningful audio and visual information presented in the video.

A descriptive text transcript is a text alternative that exists outside the video, either somewhere else on the page or in a separate file. It can be accessed by search engines and assistive technologies.

In WCAG, a descriptive text transcript is called an alternative for time-based media.

A descriptive text transcript is not just a copy of the captions. It includes both the script in the audio track and a description of any meaningful visual content in the video. The idea is that it can be read instead of watching and listening to the video, without losing any of the important information.

For more information on descriptive transcripts, see Transcripts — W3C.

How a descriptive text transcript makes a video more accessible

Descriptive text transcripts provide access to video content for people who:

• are hearing or visually impaired
• prefer to read, scan or search the text version of the video’s content
• do not have enough mobile data to stream the content.

For people who are deafblind, the descriptive text transcript will be their only access to the content of the video. This enables the content to be translated by Braille devices.

How to create a descriptive text transcript

You can use the caption file for the video as the basis for creating the descriptive text transcript.

If the caption file was generated using YouTube.com, download it from the site. 

When writing the descriptive text to accompany the dialogue in the video, imagine that you’re writing a screenplay for a film. Make sure to:

• include text descriptions of any and all meaningful visual information communicated in the video
• identify the speaker when speakers change.

The more description you provide, the less need there is for an audio description.

Implementation options

There are multiple ways to implement descriptive text transcripts on the web, such as:

• putting the descriptive text transcript inside a disclosure or accordion immediately following the video
• providing a link immediately following the video to a separate web page that contains the descriptive text transcript.

Programmatically associate a video with its descriptive text transcript

Programmatically associating a video with its descriptive text transcript can inform screen reader users that a transcript is available, and it can assist in navigating from a video to its transcript.

Consider using the following techniques to programmatically associate a video to its descriptive text transcript:

• use the aria-details attribute on the video and set its value to the id of:
• the element that contains the descriptive text transcript, or
• the link that takes users to the descriptive text transcript
• group the video and its descriptive text transcript using a <figure> element.

<figure aria-labelledby="video-caption">
  <figcaption id="video-caption">
    Video: Descriptive text transcript
  </figcaption>
  <iframe class="video" width="560" height="315" src="[YouTube URL]" title="YouTube video: Example" frameborder="0" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen  aria-details="video-transcript"></iframe>
  <details id="video-transcript">
    <summary>
      Video transcript
    </summary>
    [transcript content here]
  </details>
</figure>

Additional visual information in descriptive text transcripts

In addition to the spoken words and important sounds in the video, a descriptive text transcript includes meaningful visual elements like:

• words that appear on the screen without being spoken — for example, the written words on a sign, like ‘Caution, enter at your own risk’
• where the scene is taking place — for example, in a cave
• who is in the scene and what’s happening — for example, Jane and Rex are climbing a rock wall side by side.