How to Convert SRT to VTT (for HTML5 Video)

If you are developing a website or a modern video app, you cannot use SRT directly in the HTML <track> tag. You need WebVTT (.vtt).

Browsers like Chrome and Safari rely on the VTT standard to display captions natively.

Why VTT is Essential for the Web

The WebVTT standard (Web Video Text Tracks) was built for the internet. Unlike SRT, it supports:

1. Styling: You can use CSS to style your cues (::cue { color: yellow }).
2. Positioning: You can place text align:start or at specific coordinates.
3. Metadata: It allows for headers and notes.

The Conversion Process

Converting SRT to VTT is more than just changing the file extension. You need to:

1. Add the WEBVTT header.
2. Change timecode separators from comma (00:00:20,000) to period (00:00:20.000).

Doing this manually is tedious.

The Easy Way (Free Tool)

1. Sign up or sign in at intlpull.com and create a project.
2. Open the project and use Import to upload your SRT file.
3. Download the formatted VTT file from the project.

If you want translations after conversion, use Add Language in the project to auto-translate.

The Developer Way (FFmpeg)

For CI/CD pipelines:

TerminalCopy
ffmpeg -i caption.srt caption.vtt

Common Pitfalls

• HTML5 Player Compatibility: Ensure your VTT file has the WEBVTT header on the very first line, or browsers will ignore it.
• Encoding: Always format your VTT files as UTF-8.

Other Useful Tools

Once you have your VTT file, you might need to translate it:

• Subtitle Translator - Translate VTT into 100+ languages.
• Subtitle Sync - Fix timing offsets.