生成 WebVTT 字幕——W3C 網路影片標準

格式正確的 VTT 檔案,具有點號時間戳分隔符、WEBVTT 標頭和適用於 HTML5 <track> 元素、HLS 串流及所有現代瀏覽器的 cue 結構。

拖放文件到此處或點击浏覽

.mp3, .wav, .m4a, .aac, .ogg, .flac, .mp4, .mov, .avi, .mkv, .webm·最大 500MB

WebVTT:網路真正使用的字幕格式

WebVTT(Web Video Text Tracks)是 W3C 制定的 HTML5 影片字幕標準。與 SRT 不同,VTT 支援透過 ::cue 偽元素的 CSS 樣式、cue 定位和對齊設定、NOTE 註解區塊和章節標記。它是 HLS(HTTP Live Streaming)的強制字幕格式——如果您在串流影片,您需要 VTT,而非 SRT。Vocova 從任何音訊或影片來源生成符合規範的 WebVTT 檔案。

使用方法

1

上傳任何音訊或影片檔案

拖放任何媒體檔案。我們接受所有主要格式並提取語音用於字幕生成。

  • 所有音訊:MP3、WAV、M4A、AAC、OGG、FLAC、WMA
  • 所有影片:MP4、MOV、AVI、MKV、WebM、WMV
  • 支援最大 500 MB 的檔案
2

AI 轉錄並格式化為 VTT

語音被轉錄並分段為 WebVTT cue,具有正確的時間、強制的 WEBVTT 標頭,以及符合 W3C 規範的點號分隔時間戳。

  • 帶可選元數據區域的 WEBVTT 標頭
  • 點號分隔的毫秒(HH:MM:SS.mmm)
  • Cue 按自然閱讀流程分段
3

檢閱並下載您的 VTT 檔案

預覽每個 cue,需要時編輯文字,然後下載可用於 HTML5 影片播放器、HLS 串流或網路平臺的 VTT 檔案。

  • 匯出前編輯 cue 文字
  • 全程符合 W3C 標準的結構
  • UTF-8 編碼支援所有語言

功能特色

CSS ::cue 樣式支援

WebVTT 字幕可使用 ::cue 偽元素透過 CSS 設定樣式。更改字型、顏色、大小、背景和透明度。您還可以使用 ::cue(b)、::cue(i) 和語音選擇器進行逐元素樣式設定。這是相對於 SRT 的關鍵優勢,SRT 沒有標準的樣式機制。

Cue 定位與對齊

VTT cue 支援位置、對齊、大小和行位置設定。將說話人標識字幕放在螢幕頂部,描述放在左側,或將標準對話置中。這些定位控制是 VTT 規範的一部分,不是修補方法。

NOTE 區塊用於元數據

WebVTT 支援 NOTE 註解區塊——在檔案中可見但不在螢幕上顯示的元數據。用於翻譯備註、編輯上下文、語言資訊或版本追蹤。SRT 沒有同等功能。

HLS 串流的強制格式

Apple 的 HLS 規範要求字幕使用 WebVTT——HLS 清單中不支援 SRT。如果您透過 HLS 交付影片(包括大多數 iOS 影片、Apple TV 和許多 CDN),您必須使用 VTT。我們的檔案已準備好用於 HLS 整合。

正確的 MIME 類型處理

VTT 檔案必須以 MIME 類型 text/vtt 提供。許多網頁伺服器預設以 text/plain 提供 .vtt 檔案,這導致瀏覽器拒絕它們作為字幕軌。我們在輸出中注明這一點,以便您知道正確配置伺服器——這是一個常見的陷阱,會無聲地破壞字幕。

為什麼選擇 Vocova

為 HTML5 影片添加字幕

在 <video> 標籤內使用 <track> 元素原生添加字幕。WebVTT 是 HTML5 <track> 元素唯一支援的字幕格式——SRT 在這裡不起作用。一行 HTML 即可為您的影片添加字幕。

為 HLS 影片串流添加字幕

HLS 強制要求 WebVTT 字幕。如果您使用 AWS MediaConvert、Cloudflare Stream、Mux 或任何 HLS 管線,您需要 VTT 檔案。從源媒體生成它們並包含在您的 HLS 清單中。

用您品牌的 CSS 設定字幕樣式

使用 ::cue 偽元素以您品牌的字型、顏色和背景處理設定 WebVTT 字幕樣式。移除預設的黑色背景方塊、更改文字顏色、調整字型大小——全部透過標準 CSS。

符合網路無障礙標準

WCAG 2.1 建議網路影片字幕使用 WebVTT。從您的影片內容生成 VTT 檔案,以滿足 WCAG Level A(預錄媒體字幕)和 Level AA 要求。

誰能受益

網頁開發人員

在您網站的 HTML5 影片播放器中添加 WebVTT 軌道。使用帶有 kind='captions' 或 kind='subtitles' 的 <track> 元素。透過 CSS ::cue 設定樣式,獲得原生外觀的字幕體驗。

串流基礎架構工程師

為 HLS 和 DASH 字幕軌生成 VTT 檔案。為自適應位元率清單分段 VTT 檔案。WebVTT 是 HLS 原生支援的唯一字幕格式。

線上學習平臺開發者

在 LMS 平臺中為課程影片添加字幕。大多數現代 LMS 系統(Canvas、Moodle、Blackboard)使用 HTML5 影片並期望 WebVTT 作為字幕軌。

在網路發布的內容創作者

為嵌入在您部落格、作品集或媒體網站上的影片生成 VTT 字幕檔案。WebVTT 在所有現代瀏覽器中無需外掛或 JavaScript 函式庫即可運作。

常見問題

免費開始轉錄

上傳檔案或粘貼來自 YouTube、TikTok 和 1,000 多個平臺的連結——幾分鐘內獲得準確的轉錄文本。無需信用卡。

免費 WebVTT 字幕產生器 — Vocova