Skip to main content

VTT Format Export

Export captions in WebVTT format - the modern web standard for HTML5 video.

What is WebVTT?​

WebVTT (.vtt) is the HTML5 caption standard:

  • Web standard: Native browser support
  • Advanced features: Styling, positioning
  • Metadata support: Chapters, descriptions
  • CSS styling: Full formatting control

VTT Format Example​

WEBVTT

1
00:00:00.000 --> 00:00:02.500
<v John>Welcome to our tutorial video

2
00:00:02.750 --> 00:00:05.000
<v Mary>Today we'll learn about captions

NOTE This is a comment

3
00:00:05.250 --> 00:00:08.000 align:center
Let's get started!

Exporting to VTT​

From Caption Editor​

  1. Click Export
  2. Select WebVTT format
  3. Choose options:
    • Include styles
    • Include speaker tags
    • Include metadata
  4. Click Download

VTT Features​

Speaker Tags​

<v John>Hello everyone
<v Mary>Hi there!

Text Styling​

<b>Bold text</b>
<i>Italic text</i>
<u>Underlined text</u>

Positioning​

00:00:00.000 --> 00:00:02.000 align:start
Left-aligned caption

00:00:00.000 --> 00:00:02.000 align:center
Centered caption

00:00:00.000 --> 00:00:02.000 line:0%
Top of screen

00:00:00.000 --> 00:00:02.000 position:50%
Custom position

CSS Styling​

WEBVTT

STYLE
::cue {
  background-color: black;
  color: white;
  font-family: Arial;
}

::cue(v[voice="John"]) {
  color: cyan;
}

1
00:00:00.000 --> 00:00:02.000
<v John>Styled caption

VTT vs SRT​

FeatureSRTVTT
Browser support❌✅
Text styling❌✅
PositioningLimitedFull
Metadata❌✅
CompatibilityUniversalModern only

Common Uses​

Web Platforms​

  • HTML5 <video> element
  • YouTube (uploads as VTT)
  • Vimeo
  • Modern CMSs

Streaming​

  • HLS (HTTP Live Streaming)
  • DASH
  • WebRTC

Best Practices​

File Header​

Always start with:

WEBVTT

Optional description:

WEBVTT - English captions for Tutorial Video

Timing Format​

VTT uses periods (not commas):

00:00:01.500  ✓
00:00:01,500  ✗ (SRT format)

Speaker Identification​

Use voice tags:

<v Speaker Name>Caption text

Advanced Features​

Chapters​

WEBVTT

CHAPTER
00:00:00.000 --> 00:01:00.000
Introduction

00:01:00.000 --> 00:05:00.000
Main Content

00:05:00.000 --> 00:06:00.000
Conclusion

Descriptions​

00:00:00.000 --> 00:00:05.000
NOTE Audio description
[Soft music playing in background]

Multiple Languages​

Link language-specific VTT files:

<video>
  <track kind="captions" src="video.en.vtt" srclang="en" label="English">
  <track kind="captions" src="video.es.vtt" srclang="es" label="Español">
</video>

Converting Between Formats​

VTT to SRT​

Scriptix can convert automatically:

  1. Export as SRT
  2. Styling removed
  3. Format adjusted

SRT to VTT​

  1. Export as VTT
  2. Add WEBVTT header
  3. Adjust timing format
  4. Add styling if desired

Next Steps​

VTT is the best choice for modern web platforms!