<track>要素
Technical Summary
trackは、audioまたはvideoに外部の時間付きテキストトラックを関連付けます。字幕、キャプション、映像の説明、章、スクリプトで使うmetadataなど、用途はkindで表します。
trackを追加したことだけでは、字幕が必要な利用者に完全な情報が届くことや、アクセシビリティ基準への適合は確認できません。仕様上のtrackモデル、ファイルとcue、ブラウザーUI、支援技術での利用、メディア自体のアクセシビリティを別々に評価します。
Definition / Categories
| 項目 | 定義 |
|---|---|
| 意味 | メディア要素に明示的な外部text trackを指定する要素 |
| Categories | なし |
| 配置 | audioまたはvideoの子で、flow contentより前 |
| Content model | Nothing。要素内にテキストや子要素を置かない |
| 終了タグ | なし |
| DOM interface | HTMLTrackElement。関連するTextTrackをtrackプロパティから取得 |
kindで示す用途
kindは、時間付きテキストの用途をユーザーエージェントに伝えます。字幕とキャプションは役割が異なります。
kind | 仕様上の用途 | 表示・利用の境界 |
|---|---|---|
subtitles | 音声は聞こえるものの理解できない場合などの、会話の文字起こしや翻訳 | 映像上に重ねる想定。言語を示すsrclangが必要 |
captions | 会話に加えて、効果音・重要な音楽・その他の理解に必要な音声情報を含める | 音声が使えない、または聞き取りにくい場合を想定 |
descriptions | 映像の情報をテキストで記述する | 画面が使えない場合などに音声合成する用途。対応状況の観測が必要 |
chapters | メディアの章を表す時間付き情報 | 章選択UIや利用方法はユーザーエージェントの実装も確認する |
metadata | スクリプトから利用する時間付き情報 | 通常の字幕表示を目的としない |
kindを省略した場合の仕様上の既定値はsubtitlesです。不明な値はmetadata状態になります。属性の既定値と、ブラウザーが実際にどのtrackを表示・選択するかは分けて扱います。
Attributes and content model
| 属性 | 仕様上の役割 | 条件・境界 |
|---|---|---|
src | text trackデータのURL | 必須。空でない有効なURLを指定する |
kind | 字幕、キャプション、説明、章、metadataの用途 | 既定値はsubtitles。有効な値以外はmetadata状態 |
srclang | text trackデータの言語 | 有効なBCP 47言語タグを指定。kind="subtitles"では必須 |
label | 利用者がtrackを選ぶ際に使う説明的な名前 | ユーザーエージェントが字幕・キャプション・音声解説を一覧にするときに使う |
default | 他のtrackが利用者の設定により適切でない場合に有効化する候補 | 利用者の設定を無視して強制表示する指定ではない。字幕/キャプション、説明、章ごとに指定数の上限がある |
メディア要素にsrcがある場合も、子要素としてtrackを置けます。srcがない場合は、source候補の後にtrackを並べられます。どちらの場合も、trackはメディア要素の子です。sourceの候補選択と属性条件はsource要素ページを参照してください。
<video controls>
<source src="/media/lesson.webm" type="video/webm">
<source src="/media/lesson.mp4" type="video/mp4">
<track kind="captions" src="/media/lesson.ja.vtt"
srclang="ja" label="日本語のキャプション" default>
</video>WebVTT cues and APIs
WebVTTは、時刻とcue本文を持つtext track形式です。以下は、動画の開始から2秒間に表示するcueの例です。音が聞こえない場合にも内容が分かるキャプションでは、必要な効果音なども本文に含めます。
WEBVTT
00:00:00.000 --> 00:00:02.000
ドアが閉まる音。
00:00:02.000 --> 00:00:04.000
話者: こんにちは。HTMLTrackElement.readyStateは、trackデータの取得状態を示します。
| 値 | 状態 |
|---|---|
NONE (0) | まだ読み込まれていない |
LOADING (1) | 読み込み中 |
LOADED (2) | 読み込み完了 |
ERROR (3) | 読み込み失敗 |
HTMLTrackElement.trackから関連するTextTrackにアクセスできます。メディア要素のtextTracksには関連trackがあり、スクリプトで追加するtrackやメディアリソース内のtrackも区別します。cueを取得・処理するAPIの挙動は、仕様・実装・利用環境ごとに確認します。
Accessibility and conformance boundary
WCAG 2.2のSC 1.2.2は、適用範囲に入る録画済み同期メディアの音声にキャプションを求めます。SC 1.2.3は録画済み動画の時間依存メディア代替または音声解説を、SC 1.2.5は録画済み動画の音声解説を扱います。どの基準が適用されるかは、同期/単独メディア、ライブ/録画、伝達される情報、明示されたテキスト代替かどうかなどに依存します。
trackは字幕や説明を提供する仕組みの一つですが、cueの正確さ・完全さ、視覚だけで伝わる情報の説明、音声のみの録音に必要なテキスト代替までは自動で保証しません。ブラウザーがcueをどう表示するか、アクセシビリティツリーやWindows APIにどう公開するか、NarratorやNVDAなどでどう利用できるかは別の観測対象です。
Fact / Evidence（主張 / 根拠）
| 種別 | 主張 | 条件・範囲 | 状態 | 根拠 |
|---|---|---|---|---|
| SPEC | trackはメディア要素の子で、外部の時間付きテキストを関連付ける。終了タグや要素内のcontentはない。 | HTML Living Standardのtrack要素。HTMLの構文・content modelの範囲。 | 確認済み | HTML Standard: track |
| SPEC | kindは5用途を表し、srclang・label・defaultには個別の条件がある。 | 字幕とキャプションの定義、BCP 47言語タグ、利用者設定を含む既定track選択を区別する。 | 確認済み | HTML Standard: track attributes |
| SPEC | HTMLTrackElement.readyStateは未読み込み・読み込み中・完了・失敗の4状態を返す。 | 0から3までの定数を使用する。fixtureで観測した値は規範上の定義と分けて記録する。 | 確認済み | HTML Standard: HTMLTrackElement |
| SPEC | WebVTTは時間付きcueを定義し、WCAGの時間依存メディア基準はコンテンツ条件ごとに適用される。 | track要素やファイルの存在だけで、コンテンツのアクセシビリティ適合は判定できない。 | 確認済み | WebVTT · WCAG 2.2 SC 1.2.2 |
Evidence
- HTML Living Standard: The track element — content model, attributes, kind states, selection, and HTMLTrackElement
- HTML Living Standard: Timed text tracks — text-track model, cues, loading, and APIs
- WebVTT: The Web Video Text Tracks Format — cue format and parsing rules
- WCAG 2.2 SC 1.2.2, SC 1.2.3, and SC 1.2.5 — criteria for prerecorded synchronized media
- HTML-AAM 1.0 Working Draft — 今後のmapping調査に使う参照先。このページではtrack固有のplatform mappingを主張していません
- Web Platform Tests: media-elements/track — test discovery entry point; this page does not claim that the directory was run
Implementation Evidence
規範上の主張と実装観測を分けます。video-v1を使ったChromeの部分観測とtrack関連WPT 2件の結果を記録し、他ブラウザーやWindows API・支援技術の未確認範囲も残します。
| 種別 | 観測範囲 | 記録する条件 | 状態 |
|---|---|---|---|
| IMPL | video-v1のChrome fixtureでcaptions track 1件の読み込み、readyState、cue、字幕描画を観測 |
2026-09-24 / Chrome 153.0.8010.50 / Windows NT 10.0.26200.0。video-v1 fixtureでkind=captions、label=English captions、language=en、mode=showing、readyState=2、cue 1件を確認し、cueが映像上に描画された。fixtureはload後にmodeをshowingへ設定。別browser・別条件は未観測。 詳細なfixture・Chrome観測はvideoのImplementation Evidenceを参照。 | 部分観測（Chrome 153 / video-v1） |
| WPT | track file loading / readyStateとdefault attributeに関する選定WPT |
2026-09-24 / Chrome 153.0.8010.50 / Windows NT 10.0.26200.0 / wpt.live。track-load-from-src-readyState.html (1/1 pass) と track-default-attribute.html (1/1 pass) を実行。track-mode.htmlとerror-sequence.htmlは最終Harness summaryがなく未集計。全directoryと他browserは未実施。実測時のテスト版は未記録です。リンク先の内容は変わることがあり、当時と同じテストで再確認できるとは限りません。 |
部分実行（2/2 pass） |
| AAM | video-v1の字幕cue描画とChrome Accessibility Tree上の公開 | 2026-09-24 / Chrome 153.0.8010.50 / Windows NT 10.0.26200.0。cueは映像上に描画されたが、取得したsnapshotでは独立nodeとして確認できなかった。このsnapshotに限る観測。Windows platform API、Narrator / NVDA等の支援技術、他browserは未観測。 詳細はvideoのAAM観測を参照。 | 部分観測（Chrome AX Tree） |
IMPLとAAMはvideo-v1を使ったChrome 153の限定観測、WPTはtrack関連2件の結果です。別ブラウザー、Windows platform API、支援技術、全WPT directoryの結果へ一般化しません。
Coverage / Open Issues
- 仕様確認済み要素の位置・content model、5種類の
kind、属性条件、HTMLTrackElement - 仕様確認済みWebVTT cueの位置付けとWCAG 2.2の時間依存メディア基準の適用境界
- 部分観測 / 未確認IMPL: Chrome 153のvideo-v1で字幕cue 1件の読み込みと映像上の描画を観測。他ブラウザー、選択・error条件は未確認
- 部分実行 / 未完了WPT: 選定2ファイルで2/2 pass。track-mode等の未集計test、全directory、他ブラウザーは未確認
- 部分観測 / 未確認AAM: Chrome Accessibility Tree snapshotではcueの独立nodeを確認できず。Windows platform API、支援技術、他ブラウザーは未観測
このページは規範仕様と限定Evidenceの初期整理です。部分観測からブラウザー間の互換性や、字幕ファイル・コンテンツのアクセシビリティ適合は主張しません。
Related surface
初心者向けの字幕とWebVTTの例はYugienのtrack解説を参照してください。映像再生全体はvideo、音声再生とテキスト代替はaudioで確認できます。