WebVTT
副檔名 |
.vtt |
---|---|
網路媒體型式 |
text/vtt |
開發者 | 全球資訊網協會 (W3C) |
首次發布 | 2010年8月10日[1] |
最新版本 | 2019年4月4日 |
格式類型 | Timed text |
延伸自 | SRT |
標準 | W3C WebVTT |
自由格式? | 是 |
免費格式? | 是 |
網站 | (VTT) |
WebVTT(網路視訊文字軌,英語:Web Video Text Tracks)是一個用來顯示與HTML5<track>
元素相關的timed text的全球資訊網協會 (W3C)標準。
此規範的早期草稿是由WHATWG於2010年在討論HTML5應支援哪種字幕格式後所編寫的,主要選項是相對成熟,以XML為基礎的定時文字標記語言 (TTML),或是全新但更輕量,以廣泛使用的SubRip格式為基礎的標準。最後決定使用新的標準,一開始稱為WebSRT (Web Subtitle Resource Tracks)。[2]其共享了.srt
副檔名,並擴充了SubRip格式,雖然並不完全相容。此格式後來更名為WebVTT。[3][4]在2011年1月13日的HTML5草稿報告中,引入了<track>
元素並更新了規範以記錄WebVTT字幕文字呈現規則。[5]WebVTT規範仍處於草稿階段,但所有主要瀏覽器都支援基本功能。
與SubRip最大的不同
- WebVTT的第一行在選擇性的UTF-8位元組順序記號之後以WEBVTT開頭
- 第一行與第一個字幕文字間有選擇性標頭資料的空間
- 時間碼的小數部份是用句號而非逗號分隔
- 時間碼的小時部份是選擇性的
- 時間碼之前的畫面編號/識別字串是選擇性的
- 可新增由單字NOTE所註記的註解
- 元資料資訊可使用JSON風格的格式新增
- 可選擇指定章節資訊
- 僅支援將字元延展為UTF-8
- 使用C標籤的配套HTML檔案中定義的獨立檔案CSS代替FONT元素
- 字幕設定允許在視訊上自訂字幕位置[6]
相容性
瀏覽器 | 字幕文字標籤 | 字幕位置 | CSS樣式 |
---|---|---|---|
Chrome | 35+ | ||
Android stock browser | 5.0+ | ||
Opera | 22+ | ||
Safari | 7+ (iOS: 8+) | ||
Firefox | 31+ (Android: 32+) | 不適用 | |
Microsoft Edge | 12+ | 不適用 | |
Internet Explorer | 10+ | 不適用 |
Firefox在Firefox 24的Nightly版本中實作了WebVTT,但一開始並未預設啟用。該功能必須在Firefox的"about:config"頁面中透過將"media.webvtt.enabled"值設定為true以啟用。[9]YouTube於2013年4月開始支援WebVTT。[10]字2014年7月24日的Firefox 31起,Mozilla已在Firefox上預設啟用WebVTT。[11]
.vtt檔案中的字幕會在線上顯示,但儲存在本機磁碟時並不會顯示。
WebVTT格式的範例
WEBVTT Kind: captions Language: en 00:09.000 --> 00:11.000 <v Roger Bingham>We are in New York City 00:11.000 --> 00:13.000 <v Roger Bingham>We are in New York City 00:13.000 --> 00:16.000 <v Roger Bingham>We're actually at the Lucern Hotel, just down the street 00:16.000 --> 00:18.000 <v Roger Bingham>from the American Museum of Natural History 00:18.000 --> 00:20.000 <v Roger Bingham>And with me is Neil deGrasse Tyson 00:20.000 --> 00:22.000 <v Roger Bingham>Astrophysicist, Director of the Hayden Planetarium 00:22.000 --> 00:24.000 <v Roger Bingham>at the AMNH. 00:24.000 --> 00:26.000 <v Roger Bingham>Thank you for walking down here. 00:27.000 --> 00:30.000 <v Roger Bingham>And I want to do a follow-up on the last conversation we did. 00:30.000 --> 00:31.500 align:end size:50% <v Roger Bingham>When we e-mailed— 00:30.500 --> 00:32.500 align:start size:50% <v Neil deGrasse Tyson>Didn't we talk about enough in that conversation? 00:32.000 --> 00:35.500 align:end size:50% <v Roger Bingham>No! No no no no; 'cos 'cos obviously 'cos 00:32.500 --> 00:33.500 align:start size:50% <v Neil deGrasse Tyson><i>Laughs</i> 00:35.500 --> 00:38.000 <v Roger Bingham>You know I'm so excited my glasses are falling off here.
其他功能
2013年6月,規範中新增了一個範例,其中包含了新的「區域」設定。[13]此功能自Firefox 59與Safari 14.1(iOS上則是14.5)開始支援此功能,但其他瀏覽器均不支援。[14]
參考資料
- ^ WebSRT. [2015-02-12]. (原始內容存檔於2010-08-16).
- ^ WebVTT versus TTML: XML considered harmful for web captions?. [2015-02-16]. (原始內容存檔於2018-10-21).
- ^ Kennedy, Antony; de Leon, Inayaili. Pro CSS for High Traffic Websites. Apress. 2011 [2022-07-17]. ISBN 978-1-4302-3288-9. (原始內容存檔於2020-01-26).
- ^ Pfeiffer, Silvia. Recent developments around WebVTT. 2011-06-27 [2022-07-17]. (原始內容存檔於2011-07-06).
- ^ HTML5. www.w3.org. [2022-07-24]. (原始內容存檔於2022-07-24).
- ^ WebVTT cue settings. W3C. [11 February 2015]. (原始內容存檔於2015-10-06).
- ^ WebVTT support in browser. W3C. [2017-02-06]. (原始內容存檔於2019-03-06).
- ^ WebVTT Styling. JWPlayer. [2017-02-06]. (原始內容存檔於2016-04-20).
- ^ 629350 - (webvtt) [meta] Tracking bug for WebVTT implementation. bugzilla.mozilla.org. [2022-07-24]. (原始內容存檔於2019-04-02) (英語).
- ^ 受支持的字幕文件 - YouTube帮助. support.google.com. [2022-07-24]. (原始內容存檔於2022-07-24).
- ^ Firefox for Android 31.0, See All New Features, Updates and Fixes. Mozilla. [2022-07-24]. (原始內容存檔於2022-07-24) (英語).
- ^ WebVtt: The Web Video Text Tracks Format. w3.org. The World Wide Web Consortium. 2018-05-10 [2018-09-16]. (原始內容存檔於2018-05-15) (英語).
- ^ Added region example to Introduction section under "Other features". · w3c/webvtt@4255ed4. GitHub. [2022-07-24]. (原始內容存檔於2019-12-16) (英語).
- ^ VTTCue.region - Web APIs | MDN. developer.mozilla.org. [2022-07-24]. (原始內容存檔於2022-05-14) (美國英語).