imported>Zestbot：/* top */ bot:替換lang-x模板為langx

2025-12-05T15:44:59Z

新页面

{{NoteTA|G1=IT}}
{{Infobox file format
| name = WebVTT
| extension = .vtt
| mime = text/vtt
| developer = [[万维网联盟]] (W3C)
| released = {{start date and age|2010|08|10|df=yes}}<ref>{{cite web |url=http://www.whatwg.org/specs/web-apps/current-work/websrt.html|archiveurl=https://web.archive.org/web/20100816054522/http://www.whatwg.org/specs/web-apps/current-work/websrt.html|title=WebSRT|archivedate=2010-08-16|accessdate=2015-02-12}}</ref>
| latest_release_version = {{start date and age|2019|04|04|df=yes}}
| genre = [[Timed text]]
| extended_from = [[SubRip|SRT]]
| standard = [https://www.w3.org/TR/webvtt1/ W3C WebVTT]
| open = Yes
| free = Yes
| url = (VTT)}}
'''WebVTT'''（網路視訊文字軌，{{langx|en|Web Video Text Tracks}}）是一個用來顯示與[[HTML5]]<code><track></code>元素相關的[[timed text]]的[[万维网联盟]] (W3C)標準。

此規範的早期草稿是由[[網頁超文本應用技術工作小組|WHATWG]]於2010年在討論HTML5應支援哪種字幕格式後所編寫的，主要選項是相對成熟，以[[XML]]為基礎的{{link-en|定時文字標記語言|Timed Text Markup Language}} (TTML)，或是全新但更輕量，以廣泛使用的[[SubRip]]格式為基礎的標準。最後決定使用新的標準，一開始稱為WebSRT (Web Subtitle Resource Tracks)。<ref>{{cite web
|url=http://www.balisage.net/Proceedings/vol10/html/Tai01/BalisageVol10-Tai01.html
|title=WebVTT versus TTML: XML considered harmful for web captions?
|accessdate=2015-02-16
|archive-date=2018-10-21
|archive-url=https://web.archive.org/web/20181021010252/http://www.balisage.net/Proceedings/vol10/html/Tai01/BalisageVol10-Tai01.html
|dead-url=no
}}</ref>其共享了<code>.srt</code>副檔名，並擴充了SubRip格式，雖然並不完全相容。此格式後來更名為WebVTT。<ref>{{cite book
|url=https://books.google.com/books?id=9A6w3ZBDtysC&pg=PA168
|title=Pro CSS for High Traffic Websites
|first1=Antony
|last1=Kennedy
|first2=Inayaili
|last2=de Leon
|publisher=[[Apress]]
|year=2011
|isbn=978-1-4302-3288-9
|access-date=2022-07-17
|archive-date=2020-01-26
|archive-url=https://web.archive.org/web/20200126013656/https://books.google.com/books?id=9A6w3ZBDtysC&pg=PA168
|dead-url=no
}}</ref><ref>{{cite web
|url=http://blog.gingertech.net/2011/06/27/recent-developments-around-webvtt/
|title=Recent developments around WebVTT
|date=2011-06-27
|first=Silvia
|last=Pfeiffer
|access-date=2022-07-17
|archive-date=2011-07-06
|archive-url=https://web.archive.org/web/20110706072751/http://blog.gingertech.net/2011/06/27/recent-developments-around-webvtt/
|dead-url=no
}}</ref>在2011年1月13日的HTML5草稿報告中，引入了<code><track></code>元素並更新了規範以記錄WebVTT字幕文字呈現規則。<ref>{{Cite web |title=HTML5 |url=http://www.w3.org/TR/2011/WD-html5-20110113/spec.html |website=www.w3.org |access-date=2022-07-24 |archive-date=2022-07-24 |archive-url=https://web.archive.org/web/20220724222623/http://www.w3.org/TR/2011/WD-html5-20110113/spec.html |dead-url=no }}</ref>WebVTT規範仍處於草稿階段，但所有主要瀏覽器都支援基本功能。

== 與SubRip最大的不同 ==

* WebVTT的第一行在選擇性的[[UTF-8]][[位元組順序記號]]之後以''WEBVTT''開頭
* 第一行與第一個字幕文字間有選擇性標頭資料的空間
* {{link-en|時間碼|Timecode}}的小數部份是用[[句号]]而非[[逗號]]分隔
* {{link-en|時間碼|Timecode}}的小時部份是選擇性的
* {{link-en|時間碼|Timecode}}之前的畫面編號/識別字串是選擇性的
* 可新增由單字''NOTE''所註記的[[註解 (程式設計)|註解]]
* [[元数据]]資訊可使用[[JSON]]風格的格式新增
* 可選擇指定章節資訊
* 僅支援將字元延展為[[UTF-8]]
* 使用C標籤的配套HTML文件中定義的獨立檔案[[CSS]]代替FONT元素
* 字幕設定允許在視訊上自訂字幕位置<ref>{{cite web|title=WebVTT cue settings|url=http://dev.w3.org/html5/webvtt/#webvtt-cue-settings|publisher=W3C|accessdate=11 February 2015|archive-date=2015-10-06|archive-url=https://web.archive.org/web/20151006080243/http://dev.w3.org/html5/webvtt/#webvtt-cue-settings|dead-url=no}}</ref>

== 相容性 ==
{| class="wikitable"
|+ 瀏覽器支援<ref>{{cite web|title=WebVTT support in browser|url=https://www.w3.org/community/texttracks/2012/08/23/webvtt-support-in-browsers/|publisher=W3C|accessdate=2017-02-06|archive-date=2019-03-06|archive-url=https://web.archive.org/web/20190306184831/https://www.w3.org/community/texttracks/2012/08/23/webvtt-support-in-browsers/|dead-url=no}}</ref><ref>{{cite web|title=WebVTT Styling|url=http://www.jwplayer.com/html5/webvtt/|publisher=JWPlayer|accessdate=2017-02-06|archive-date=2016-04-20|archive-url=https://web.archive.org/web/20160420083635/https://www.jwplayer.com/html5/webvtt/|dead-url=no}}</ref>
! 瀏覽器
! 字幕文字標籤 !! 字幕位置 !! CSS樣式
|-
! Chrome
|colspan=3 {{yes|35+}}
|-
! Android stock browser
|colspan=3 {{yes|5.0+}}
|-
! Opera
|colspan=3 {{yes|22+}}
|-
! Safari
|colspan=3 {{yes|7+ (iOS: 8+)}}
|-
! Firefox
|colspan=2 {{yes|31+ (Android: 32+)}} ||{{n/a}}
|-
! Microsoft Edge
| {{yes|12+}} ||colspan=2 {{n/a}}
|-
!title="on Windows and Windows Phone"| Internet Explorer
| {{yes|10+}} ||colspan=2 {{n/a}}
|}
Firefox在Firefox 24的Nightly版本中實作了WebVTT，但一開始並未預設啟用。該功能必須在Firefox的"about:config"頁面中透過將"media.webvtt.enabled"值設定為true以啟用。<ref>{{Cite web |title=629350 - (webvtt) [meta] Tracking bug for WebVTT implementation |url=https://bugzilla.mozilla.org/show_bug.cgi?id=629350 |website=bugzilla.mozilla.org |language=en |access-date=2022-07-24 |archive-date=2019-04-02 |archive-url=https://web.archive.org/web/20190402102625/https://bugzilla.mozilla.org/show_bug.cgi?id=629350 |dead-url=no }}</ref>YouTube於2013年4月開始支援WebVTT。<ref>{{Cite web |title=受支持的字幕文件 - YouTube帮助 |url=https://support.google.com/youtube/answer/2734698?topic=3014331&ctx=topic |website=support.google.com |access-date=2022-07-24 |archive-date=2022-07-24 |archive-url=https://web.archive.org/web/20220724222624/https://support.google.com/youtube/answer/2734698?topic=3014331&ctx=topic |dead-url=no }}</ref>自2014年7月24日的Firefox 31起，Mozilla已在Firefox上預設啟用WebVTT。<ref>{{Cite web |title=Firefox for Android 31.0, See All New Features, Updates and Fixes |url=https://www.mozilla.org/en-US/firefox/android/31.0/releasenotes/ |website=Mozilla |language=en |access-date=2022-07-24 |archive-date=2022-07-24 |archive-url=https://web.archive.org/web/20220724222628/https://www.mozilla.org/en-US/firefox/android/31.0/releasenotes/ |dead-url=no }}</ref>

.vtt檔案中的字幕會在線上顯示，但儲存在本機磁碟時並不會顯示。

== WebVTT格式的範例 ==
<pre>
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.
</pre>

<ref>{{Cite web |title=WebVtt: The Web Video Text Tracks Format |url=https://www.w3.org/TR/2018/CR-webvtt1-20180510/#introduction-caption |website=w3.org |publisher=The World Wide Web Consortium |accessdate=2018-09-16 |language=en |date=2018-05-10 |archive-date=2018-05-15 |archive-url=https://web.archive.org/web/20180515182156/https://www.w3.org/TR/2018/CR-webvtt1-20180510/#introduction-caption |dead-url=no }}</ref>

== 其他功能 ==

2013年6月，規範中新增了一個範例，其中包含了新的「區域」設定。<ref>{{Cite web |title=Added region example to Introduction section under "Other features". · w3c/webvtt@4255ed4 |url=https://github.com/w3c/webvtt/commit/4255ed479aab5651654e323fd6e52915f951663c |website=GitHub |language=en |access-date=2022-07-24 |archive-date=2019-12-16 |archive-url=https://web.archive.org/web/20191216111012/https://github.com/w3c/webvtt/commit/4255ed479aab5651654e323fd6e52915f951663c |dead-url=no }}</ref>此功能自Firefox 59與Safari 14.1（iOS上則是14.5）開始支援此功能，但其他瀏覽器均不支援。<ref>{{Cite web |title=VTTCue.region - Web APIs {{!}} MDN |url=https://developer.mozilla.org/en-US/docs/Web/API/VTTCue/region |website=developer.mozilla.org |language=en-US |access-date=2022-07-24 |archive-date=2022-05-14 |archive-url=https://web.archive.org/web/20220514034449/https://developer.mozilla.org/en-US/docs/Web/API/VTTCue/region |dead-url=no }}</ref>

== 參考資料 ==

{{reflist|2}}

[[Category:字幕格式]]
[[Category:W3C标准]]

WebVTT - 版本历史

imported>Zestbot：​/* top */ bot:替換lang-x模板為langx

imported>Zestbot：/* top */ bot:替換lang-x模板為langx