Click & Record

Subtitles & editing · 4 min read

How to make accessible tutorial videos: captions, transcripts and narration that work for everyone

Published · Click & Record team

Accessible tutorial videos have accurate captions, a text transcript, narration that describes what happens on screen, and visuals that are readable at a glance. Of those, captions do the most work, and you can generate them for free on your own computer and then correct them in a few minutes.

This checklist is written for people making screen-recorded tutorials, onboarding videos and course content. It is practical guidance, not legal advice; if you have a specific compliance obligation, check the requirements that apply to you.

Who accessible tutorial videos are for

Accessibility is often framed around a single group, but a well-made tutorial helps a wide range of viewers:

  • Deaf and hard-of-hearing viewers rely on captions to follow narration.
  • Blind and low-vision viewers rely on narration that explains what is on screen, and on transcripts that work with screen readers.
  • People with cognitive or learning disabilities benefit from clear pacing, short segments and text they can reread.
  • Non-native speakers follow along more easily with captions.
  • Everyone in a noisy or quiet place where sound is not an option.

What WCAG asks of prerecorded video

The Web Content Accessibility Guidelines (WCAG) are the most widely referenced standard. For prerecorded video, the key success criteria are:

CriterionLevelWhat it means for a tutorial
1.2.2 Captions (Prerecorded)ASynchronized captions for all spoken content and meaningful sounds
1.2.3 Audio Description or Media AlternativeAVisual information available as audio description or a full text alternative
1.2.5 Audio Description (Prerecorded)AAImportant visual information described in the audio
2.3.1 Three Flashes or Below ThresholdANothing flashes more than three times per second

The W3C's Making Audio and Video Media Accessible guide explains each requirement in plain language and is worth bookmarking.

Captions: the biggest accessibility win

Captions are the first thing to get right. The good news is that you no longer need to type them out by hand or pay per minute for a service.

Generate a first draft

Use a speech-to-text tool to create timed cues from your narration. Click & Record includes an on-device Whisper model that transcribes in the browser with no upload and no API key, and the free browser editor does the same for any video file you already have. Our step-by-step guide to adding subtitles to a screen recording for free walks through the process.

Make the captions accurate

Automatic captions are a draft, not a finished product. Review every cue for:

  • Exact UI labels. If the button says "Save changes", the caption should say "Save changes", not "save the changes".
  • Names and jargon. Product names, acronyms and code identifiers are where speech models most often slip.
  • Punctuation and casing. They make captions far easier to read at speed.
  • Meaningful sounds. Add short cues like "[error chime]" or "[notification sound]" if the sound tells the viewer something.

Make them readable

Keep cues to one or two lines, break at natural phrases, and leave each cue up long enough to read. Common practice is roughly 32 to 42 characters per line. If captions would cover an important part of the interface at the bottom of the frame, add padding around the recording in the editor, or use VTT positioning on the web. See SRT vs VTT for which format supports what.

Ship them as a toggleable track

Export captions as an SRT or VTT sidecar file and upload them with the video, so viewers can turn them on, off, or adjust their appearance in the player.

Narration that describes the screen

For tutorials, the cleanest way to meet the audio description criteria is to narrate as you go, so the soundtrack already carries the visual information. A blind viewer should be able to follow along from the audio alone.

  • Say what you click, not just "click here". "Open the Settings menu in the top right, then choose Billing."
  • Read out important text. If an error message appears, read it aloud.
  • Describe results. "The invoice list now shows three rows, sorted by date."
  • Avoid silent stretches where something important happens without comment. If you need a quiet section, add a hand-written caption that explains it, and consider whether narration should be added too.

Visual design checks for screen recordings

Captions and narration cover hearing and sight, but the video itself also needs to be easy to read:

  1. Make text large enough. Record at a sensible window size and zoom in on the area you are working in. Auto-zoom on click helps viewers see small controls; see how to zoom in on a screen recording.
  2. Keep contrast high. Use a light or dark theme with clear contrast, and avoid pale gray text on white.
  3. Avoid flashing. Rapid flicker, strobing transitions or fast blinking cursors at large sizes can be a seizure risk.
  4. Do not rely on color alone. "Click the green button" fails for colorblind viewers; "click Confirm" works for everyone.
  5. Keep the pace humane. Slow down for complex steps. Speed up only the boring parts, like waiting for a page to load.

Transcripts and publishing

A transcript is a text version of the whole video. It helps screen reader and braille users, people who skim, and anyone searching for a step. An easy route is to export your corrected captions, open the file in a text editor, and turn it into a tidy document with headings for each step. Publish it on the same page as the video or link to it directly underneath.

Finally, check that the player itself is accessible: it should be keyboard operable, have labeled controls, and expose the captions toggle. The native HTML <video> element with a <track> is a solid baseline.

Accessible tutorial videos take a little more care, but most of the work happens in a few minutes of editing. Click & Record keeps captioning in the same place as trimming and zooming, entirely on your device. If you teach or publish courses, our guide to screen recording for teachers and online courses covers the rest of the workflow.

Frequently asked questions

Are auto-generated captions enough for accessibility?

Usually not on their own. Automatic captions are a strong first draft, but WCAG expects captions to be accurate, so review them and fix names, terms and punctuation before publishing.

What is the difference between captions and subtitles?

Captions assume the viewer cannot hear the audio, so they include meaningful sounds as well as speech. Subtitles usually assume the viewer can hear and only need the dialogue, often in another language. In everyday use the terms overlap.

Do tutorial videos need audio description?

If important information is only shown visually, WCAG asks for it to be available another way. The simplest fix for tutorials is to narrate what you do on screen, so the audio track already describes the visuals.

Should I provide a transcript as well as captions?

It is good practice. A transcript helps people who use screen readers or braille displays, people who prefer reading, and anyone searching for a specific step.