Video要素
From Wikipedia, the free encyclopedia
例
この例は、HTML で書かれたウェブページの中に WebM 動画を埋め込む例。
<video src="movie.webm" poster="movie.jpg" controls>
ここは video 要素をサポートしないウェブブラウザのためのフォールバックコンテンツ
</video>
複数ソース
<video poster="movie.jpg" controls>
<source src="movie.webm" type='video/webm; codecs="vp8.0, vorbis"' />
<source src="movie.ogv" type='video/ogg; codecs="theora, vorbis"' />
<source src="movie.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"' />
<p>ここはフォールバックコンテンツ</p>
</video>
ビデオコーデック
HTMLのvideo要素でサポートするビデオコーデックについて、主要ブラウザの開発元の間で意見が分かれている。マイクロソフトやAppleはH.264を支持し、TheoraやWebMをサポートしていない。Google・Mozilla Foundation・Opera SoftwareはTheoraやWebMを支持していたが、のちにH.264もサポートするようになった。
この表は、それぞれのウェブブラウザにおいてサポートされているビデオフォーマットを示している。多くのブラウザではソフトウェアコンポーネントを内蔵するのではなくマルチメディアフレームワークを採用しており、ビデオのデコード、表示にはこれを用いている。この場合、どのフォーマットに対応しているかは、ブラウザではなくOSおよびサードパーティのコーデックに依存する[1]。
ビデオフォーマットはMIME typeによって判別可能である。MIME typeは使用するマルチメディアフレームワークの決定にも用いられる[2]。
これらのブラウザのうち、Mozilla FirefoxおよびOperaはOSから独立しており、デコードのためのライブラリを内蔵している。Internet ExplorerおよびSafariは、それぞれのOSが提供するフレームワークを利用する。Konquerorは、Windows上ではInternet Explorerと、OS X上ではSafariと同じフォーマットに対応する。一般的に、ウェブブラウザがサポートするフォーマットはベンダーが提供するライブラリ(Media Foundation、QuickTime、GStreamer、Phononなど)にも左右される。
| ウェブブラウザ | オペレーティングシステム | 最新安定版 | サポートするフォーマット | |||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Theora | H.264 (MP4) | HEVC (MP4) | VP8 (WebM) | VP9 (WebM) | AV1 (WebM) | |||||||||||||||||||||||
| Android ブラウザ | Android | 4.4.4 | 2.3以降[3] | 3.0以降[3] | 5.0以降[4] | 2.3以降[3] | 4.4以降[5] | ? | ||||||||||||||||||||
| Chromium | Unix系、Windows | N/A | r18297以降[6] | 手動インストール[注 1][8]。 | 非対応[9] | r47759以降[10] | r172738以降[11] | 対応[5] | ||||||||||||||||||||
| Google Chrome |
|
3.0以降[16][17] | 3.0以降[17][注 2] | 非対応[19] | 6.0以降[20][21] | 29.0以降[注 3] | 70.0以降[5] | |||||||||||||||||||||
| Internet Explorer | Windows | 11.0 | 手動インストール | 9.0以降[24] | 非対応[19] | 手動インストール | 非対応 | 非対応 | ||||||||||||||||||||
| Windows Phone | 11.0 | 非対応 | 9.0以降[25] | 非対応 | ||||||||||||||||||||||||
| Windows RT | 10.0 | 10.0[25] | ||||||||||||||||||||||||||
| Microsoft Edge | Windows 10 | Web Media Extensions が必要[26] | 12.0以降[27] | ハードウェアデコーダが必要 | 16.0以降(MSE経由のみ)[28] | ハードウェアデコーダ有効化[29] 15.0以降(MSE経由のみ)[30] |
? | |||||||||||||||||||||
| Windows 10 Mobile | 13.0以降[31] | ? | ||||||||||||||||||||||||||
| Konqueror | 25.08.0[32] |
4.4以降(OS レベルコーデックが必要)[注 4] | ||||||||||||||||||||||||||
| Mozilla Firefox | Windows 7以降 |
|
3.5以降[36] | 21.0以降[注 5] | 非対応[19] | 4.0以降[39][40] | 28.0以降[41][42] | Nightly[43] | ||||||||||||||||||||
| Windows Vista | 22.0以降[44] | |||||||||||||||||||||||||||
| Windows XP | 手動インストール[45][注 6] | |||||||||||||||||||||||||||
| Linux | 26.0以降(GStreamer利用)[注 7] | |||||||||||||||||||||||||||
| Android | 17.0以降[49] | |||||||||||||||||||||||||||
| OS X | 34.0以降[50] | |||||||||||||||||||||||||||
| Firefox OS | 1.1以降[51] | |||||||||||||||||||||||||||
| Opera |
|
非対応 | 11.50以降 | 非対応[56] | 15.0以降 | 16.0以降 | 57.0以降(Android)[5] | |||||||||||||||||||||
|
10.50以降[64] | 24.0以降[65] | 10.60以降[66][67] | 非対応 | 57.0以降[5] | |||||||||||||||||||||||
| Safari | iOS | 26.3 - 2026年2月11日[68] [±] | 非対応 | 3.1以降[69][70] | 11.0以降[71] | 非対応 | 非対応 | ? | ||||||||||||||||||||
| OS X | 手動インストール | 手動インストール[72] | ? | |||||||||||||||||||||||||
| Web | Unix系 | 3.38.2 - 2020年11月25日[73] [±] | 2.28以降(OS レベルコーデックが必要)[注 8] | |||||||||||||||||||||||||