How to Add Subtitles to HTML5 Video (Step-by-Step)
Published: July 3, 2025 · 4 min read
Adding subtitles to your website video improves accessibility, boosts SEO, and reaches international audiences. HTML5 video supports subtitles natively, but only in WebVTT format.
Why HTML5 video needs VTT
The HTML5 <track> element requires WebVTT format. SRT files will not work directly — you need to convert them first.
Step 1: Convert your SRT file
Use a browser-based converter to transform SRT to VTT. No software installation needed.
Step 2: Add the track element
Add a <track> element inside your <video> tag pointing to the VTT file:
<video controls>
<source src="video.mp4" type="video/mp4">
<track kind="subtitles" src="subtitles.vtt" srclang="en" label="English">
</video>
Common mistakes
- Forgetting the
srclangattribute — browsers need it to identify the language. - Using the wrong file path to the VTT file.
- Using
kind="captions"instead ofkind="subtitles"— they have different semantics. - Not setting the default track with the
defaultattribute.
Как добавить субтитры к видео на сайте через HTML5
Опубликовано: 3 июля 2025 г. · 4 мин чтения
Добавление субтитров к видеороликам на веб-страницах улучшает доступность контента (accessibility), повышает вовлеченность пользователей и положительно влияет на SEO-показатели. Браузеры поддерживают субтитры нативно через HTML5, но исключительно в формате WebVTT.
Почему для HTML5 нужен формат VTT
Стандартный тег <track> спецификации HTML5 не принимает файлы .srt. Браузер отклонит SRT из-за отличий в синтаксисе таймкодов, поэтому исходные субтитры необходимо предварительно перевести в VTT.
Шаг 1: Конвертируйте ваш SRT-файл
Воспользуйтесь нашим конвертером SRT в VTT для мгновенного преобразования без загрузок на сервер.
Шаг 2: Вставьте тег <track>
Разместите элемент <track> внутри контейнера <video>:
<video controls>
<source src="video.mp4" type="video/mp4">
<track kind="subtitles" src="subtitles.vtt" srclang="ru" label="Русский" default>
</video>
Частые ошибки
- Пропуск атрибута
srclang— браузеру необходим код языка - Неверный относительный путь к файлу .vtt
- Использование неподдерживаемой кодировки — сохраняйте файлы строго в UTF-8
Попробуйте прямо сейчас — бесплатно и безопасно
Без загрузок на сервер. Без регистрации. Работает в вашем браузере.
Конвертировать SRT в VTT