Subtitles, telling Google about your business, and the rel family
Captions on your videos, the small block of text that puts your prices and opening hours into Google, and every rel value worth knowing.
By the end you can
- Caption a video so it works with the sound off
- Describe your business in a form search engines can use
- Mark paid links and visitor links honestly
- Speed a page up without wasting anyone's data
Easier if you did first
step 1 of 4
Captions and subtitles
Think about the last time you watched a video on your phone with the sound off. On a bus, in class, in a waiting room. Without captions you got nothing from it.
Now think about someone who is deaf. For them, every video with no captions is like that, every time.
You add captions with <track>, written inside the video. It points at a small text file that lists what is said and when.
There are two kinds, and the attribute says which you have. kind="captions" is for people who cannot hear the sound. It includes the speech and the sounds that matter, like a door closing or music starting. kind="subtitles" is a translation for people who can hear fine but do not speak the language.
srclang is the language code, like en or fr. label is the name people see in the subtitles menu. default marks the one to switch on automatically, and only one track may have it.
The caption file is plain text you can write in any editor. The first line says WEBVTT. Then come blocks: a start time, an arrow, an end time, and the words. The arrow is typed as two hyphens and a greater-than sign.
Add English captions and French subtitles to the video on the right.
the markup, and the start of the caption file
<video controls width="480" poster="cover.jpg">
<source src="tour.mp4" type="video/mp4" />
<track kind="captions" src="tour-en.vtt" srclang="en" label="English" default />
<track kind="subtitles" src="tour-fr.vtt" srclang="fr" label="Français" />
</video>
WEBVTT
00:00:01.000 --> 00:00:04.000
Welcome to our kitchen in Kumasi.What these words mean
- track
- A text file of captions or subtitles for a video. A video can have several.
- kind="captions"
- Speech plus important sounds, for people who cannot hear.
- kind="subtitles"
- A translation, for people who cannot follow the language.
- srclang
- The language of this track, as a short code: en, fr, tw.
- label
- What the viewer sees in the subtitles menu.
- default
- Switch this one on without being asked. Only one track may have it.
- WebVTT
- The caption file format: the word WEBVTT, then times and lines of text.
Easy to get wrong
Burning the captions into the video picture
A separate .vtt file
Captions baked into the picture cannot be turned off, cannot be translated, cannot be made bigger by someone with weak eyesight, and cannot be read by Google. A text file can do all four.
default on every track
default on one track at most
Only one track can show at a time. Mark two and the browser chooses for you, usually not the one you meant.
What we check
- The video has a captions track
- The track names its language
- It has a label for the menu
- One track is switched on by default
- There is a translated subtitles track too