From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/html/element/track/index.html | 182 +++++++++++++++++++++++++++++ 1 file changed, 182 insertions(+) create mode 100644 files/ja/web/html/element/track/index.html (limited to 'files/ja/web/html/element/track') diff --git a/files/ja/web/html/element/track/index.html b/files/ja/web/html/element/track/index.html new file mode 100644 index 0000000000..0ba661085e --- /dev/null +++ b/files/ja/web/html/element/track/index.html @@ -0,0 +1,182 @@ +--- +title: ': 埋め込みテキストトラック要素' +slug: Web/HTML/Element/track +tags: + - Accessibility + - Cues + - Element + - HTML + - HTML embedded content + - HTML5 + - Multimedia + - Reference + - TextTrack + - Web + - a11y + - track +translation_of: Web/HTML/Element/track +--- +
{{HTMLRef}}
+ +

HTML の <track> 要素はメディア要素 ({{HTMLElement("audio")}} および {{HTMLElement("video")}}) の子として使用します。この要素は自動的に処理される字幕など、時間指定されたテキストトラック (または時系列データ) を指定することができます。トラックは WebVTT (Web Video Text Tracks) 形式 (.vtt ファイル) を用います。

+ +
{{EmbedInteractiveExample("pages/tabbed/track.html", "tabbed-standard")}}
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
コンテンツカテゴリなし
許可されている内容なし。この要素は{{Glossary("empty element", "空要素")}}です。
タグの省略空要素であるため開始タグは必須、また終了タグを置いてはなりません。
許可されている親要素 +

メディア要素、 {{HTMLElement("audio")}} または {{HTMLElement("video")}}

+
暗黙の ARIA ロール対応するロールなし
許可されている ARIA ロール許可されている role なし
DOM インターフェイス{{domxref("HTMLTrackElement")}}
+ +

属性

+ +

この要素にはグローバル属性があります。

+ +
+
{{htmlattrdef("default")}}
+
この属性は、別の track が適切であるとユーザーの設定が示さない限り有効にすべき track であることを表します。この属性はメディア要素ごとに 1 つの track 要素のみで使用できます。
+
{{htmlattrdef("kind")}}
+
どのように使用するトラックであるかをを表します。省略した場合、デフォルトの種類は subtitles です。属性に無効な値が含まれている場合は metadata を使用します (バージョン 52 より前の Chrome は、無効な値を subtitles として扱っていました)。以下のキーワードが利用できます。 +
    +
  • subtitles +
      +
    • 字幕は、視聴者が理解できないコンテンツの翻訳を提供します。例えば、英語の映画における英語以外の言語による会話やテキストです。
      • +
    • 字幕には追加コンテンツ、一般的には付加的な背景情報を含む場合があります。例えばスターウォーズの冒頭のテキストや、シーンの日時および場所です。
      • +
    +
    • +
  • captions +
      +
    • クローズドキャプションは書写、あるいは音声の翻訳を提供します。
      • +
    • これは音楽のキューやサウンドエフェクトといった重要な非言語情報を含む場合があります。これはキューのソース (例: 音楽、テキスト、キャラクター) を示すでしょう。
      • +
    • 耳が不自由なユーザーや音声をミュートしている場合に適しています。
      • +
    +
    • +
  • descriptions +
      +
    • テキストによる動画コンテンツの説明です。
      • +
    • 目が不自由なユーザーや動画を視聴できない場合に適しています。
      • +
    +
    • +
  • chapters +
      +
    • チャプタータイトルは、ユーザーがメディアリソースの操作を行う際に使用することを意図しています。
      • +
    +
    • +
  • metadata +
      +
    • スクリプトが使用するトラック情報です。ユーザーには見えません。
      • +
    +
    • +
+
+
{{htmlattrdef("label")}}
+
使用可能なテキストトラックを一覧表示する際にブラウザーが使用する、ユーザーに見せるテキストトラックのタイトルです。
+
{{htmlattrdef("src")}}
+
トラック (.vtt ファイル) のアドレスです。有効な URL であることが必要です。この属性は定義する必要があり、 URL の値は文書として — track 要素の親要素である {{HTMLElement("audio")}} または {{HTMLElement("video")}} が crossorigin 属性を持たない限り — 同じオリジンを持たなければなりません。
+
{{htmlattrdef("srclang")}}
+
テキストデータの言語です。有効な BCP 47 言語タグであることが必要です。kind 属性に subtitles を設定した場合は、srclang 属性を定義しなければなりません。
+
+ +

使用上の注意

+ +

トラックのデータの種類

+ +

track 要素でメディアに付加するデータの種類は kind 属性で設定します。使用できる値は subtitles, captions, descriptions, chapters, metadata です。この要素は、ユーザーが付加データを要求した際にブラウザーが提供する、時間指定テキストを含むソースファイルを指示します。

+ +

メディア要素は kind、srclang および label が同一の track を複数持つことができません。

+ +

キューの変更の検出

+ +

{{page("/ja/docs/Web/API/TextTrack/cuechange_event", "On the track element")}}

+ +

例

+ +
<video controls poster="/images/sample.gif">
+   <source src="sample.mp4" type="video/mp4">
+   <source src="sample.ogv" type="video/ogv">
+   <track kind="captions" src="sampleCaptions.vtt" srclang="en">
+   <track kind="descriptions"
+     src="sampleDescriptions.vtt" srclang="en">
+   <track kind="chapters" src="sampleChapters.vtt" srclang="en">
+   <track kind="subtitles" src="sampleSubtitles_de.vtt" srclang="de">
+   <track kind="subtitles" src="sampleSubtitles_en.vtt" srclang="en">
+   <track kind="subtitles" src="sampleSubtitles_ja.vtt" srclang="ja">
+   <track kind="subtitles" src="sampleSubtitles_oz.vtt" srclang="oz">
+   <track kind="metadata" src="keyStage1.vtt" srclang="en"
+     label="Key Stage 1">
+   <track kind="metadata" src="keyStage2.vtt" srclang="en"
+     label="Key Stage 2">
+   <track kind="metadata" src="keyStage3.vtt" srclang="en"
+     label="Key Stage 3">
+   <!-- Fallback -->
+   ...
+</video>
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG','embedded-content.html#the-track-element','track element')}}{{Spec2('HTML WHATWG')}}
{{SpecName("HTML5 W3C", "semantics-embedded-content.html#the-track-element", "track element")}}{{Spec2("HTML5 W3C")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("html.elements.track")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf