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) (美国英语).