Learn HTML – Part 58 – track Tag – Video Subtitles
The HTML track tag is used to add subtitles, captions, or metadata to video and audio elements.
It improves accessibility and helps users understand media content better.
What is the track Tag?
The track element defines timed text tracks such as subtitles, captions, descriptions, or chapters.
It works inside video or audio elements.
Basic Syntax
<video controls>
<source src="video.mp4" type="video/mp4">
<track src="subtitles.vtt" kind="subtitles" srclang="en" label="English">
</video>
Example – Adding Subtitles
<video width="320" controls>
<source src="video.mp4" type="video/mp4">
<track src="subtitles.vtt" kind="subtitles" srclang="en" label="English">
Your browser does not support video.
</video>
Output:
Important track Attributes
| Attribute | Description |
|---|---|
src | Path to the subtitle file (.vtt format) |
kind | Type of track (subtitles, captions, chapters, descriptions) |
srclang | Language of the track |
label | Name shown to users |
default | Sets the track as default |
Example – Multiple Subtitles
<video controls>
<source src="video.mp4" type="video/mp4">
<track src="eng.vtt" kind="subtitles" srclang="en" label="English">
<track src="fr.vtt" kind="subtitles" srclang="fr" label="French">
</video>
Why Use track?
- Adds subtitles and captions
- Improves accessibility
- Supports multiple languages
- Enhances user experience
The
tracktag provides subtitles and captions for media content.
Common Mistakes Beginners Make
- Not using .vtt file format
- Forgetting to specify srclang
- Using track outside video or audio elements
Conclusion
The HTML track tag is used to add subtitles, captions, and other text tracks to media elements.
It improves accessibility and helps users better understand video content.
What’s Next?
Now that you understand the track tag, the next step is learning about the figure tag, which is used to represent media content with captions.
Next: Learn HTML – Part 59 – figure Tag – Media Content →
Series: Learn HTML Series
