Subtitles

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 srclang attribute — browsers need it to identify the language.
  • Using the wrong file path to the VTT file.
  • Using kind="captions" instead of kind="subtitles" — they have different semantics.
  • Not setting the default track with the default attribute.

Try it now — free & private

No uploads. No account. Works in your browser.

Convert SRT to VTT
Субтитры

Как добавить субтитры к видео на сайте через 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