コンテンツにスキップ

video要素

出典: フリー百科事典『ウィキペディア（Wikipedia）』

video要素（ビデオようそ、英: video element）とは、HTML5以降のHTMLの一部で、動画のためのHTML要素。

例

[編集]

この例は、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>

ビデオコーデック

[編集]
→詳細は「en:Comparison_of_layout_engines_(HTML5_Media)」および「en:HTML5_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
Windows
151.0.7922.138[12] ウィキデータを編集 / 2026年8月11日 (2日前)
macOS
151.0.7922.138[12] ウィキデータを編集 / 2026年8月11日 (2日前)
Linux
151.0.7922.137[13] ウィキデータを編集 / 2026年8月11日 (2日前)
Android
151.0.7922.137[14] ウィキデータを編集 / 2026年8月11日 (2日前)
iOS
152.0.7977.40[15] ウィキデータを編集 / 2026年8月12日 (28時間前)
 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 26.04.2[32] ウィキデータを編集 - 2026年5月29日 (2か月前) [±] 4.4以降（OS レベルコーデックが必要）[注 4]
Mozilla Firefox Windows 7以降
通常版
153.0.4[34] ウィキデータを編集 / 2026年8月11日 (2日前)
ESR
153.0esr[35] ウィキデータを編集 / 2026年7月21日 (23日前)
 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
Android45.0.2246.125120 / 2018年2月12日 (8年前) (2018-02-12)[52]
Android (classic)12.1.8 / 2014年11月6日 (11年前) (2014-11-06)[53]
Symbian S6012.0.22 / 2012年6月24日 (14年前) (2012-06-24)[54]
Windows Mobile10.0 / 2010年3月16日 (16年前) (2010-03-16)[55]
 非対応 11.50以降 非対応[56] 15.0以降 16.0以降 57.0以降（Android）[5]
Windows
134.0.5954.26 / 2026年7月30日 (14日前) (2026-07-30)[57][58]
Mac
134.0.5954.26 / 2026年7月30日 (14日前) (2026-07-30)[59][58]
Android
100.2.5122.89341 / 2026年7月9日 (35日前) (2026-07-09)[60]
iOS
6.6.2 / 2026年7月10日 (34日前) (2026-07-10)[61]
Opera Mini
99.4.2254.1608 / 2026年7月3日 (41日前) (2026-07-03)[62]
 10.50以降[63] 24.0以降[64] 10.60以降[65][66] 非対応 57.0以降[5]
Safari iOS 26.6 - 2026年7月27日 (17日前) (2026-07-27)[67] [±] 非対応 3.1以降[68][69] 11.0以降[70] 非対応 非対応 ?
OS X 手動インストール 手動インストール[71] ?
Web Unix系 3.38.2 - 2020年11月25日 (5年前) (2020-11-25)[72] [±] 2.28以降（OS レベルコーデックが必要）[注 8]

注

[編集]
  1. ↑ サードパーティーのコーデックパッケージを利用可能[7]。
  2. ↑ 2011年1月11日に、H.264のサポート終了が告知されたが[18]、2014年10月現在サポートは終了されていない。
  3. ↑ バージョン25.0でサポートされたが、既定では無効化されていた[22][23]。
  4. ↑ Qt 4.5上のPhononがサポートするすべてのフォーマットに対応[33]。DirectShow、QuickTime、GStreamer、xineを含むPhononバックエンドを利用可能。MPlayerおよびVLCをバックエンドとする利用は開発中。
  5. ↑ バージョン20でサポートされたが、既定で無効化されていた[37][38]。
  6. ↑ DivXのWeb Player version 2.xのみHTML5対応[46]。
  7. ↑ バージョン26以前は既定で無効化されていた[47]。また、システムのコーデックに依存する[48]。
  8. ↑ Webkit/GTK+GStreamerがサポートするすべてのフォーマットに対応[73][74]。

参照

[編集]
  1. ↑ “Phonon documentation of backends”, Qt, Nokia 2014年10月30日閲覧。
  2. ↑ “Phonon documentation of querying”, Qt, Nokia 2014年10月30日閲覧。
  3. 1 2 3 Kyrnin, Jennifer, Understanding HTML5 Video Formats, About 2014年10月30日閲覧。
  4. ↑ “Supported media formats”. Google. 2018年10月1日閲覧。
  5. 1 2 3 4 5 “AV1 Decoder”. Google. 2018年10月1日閲覧。
  6. ↑ Issue 4363: [HTML5-Video] Enable HTML5 video/audio elements, Google 2014年10月30日閲覧。
  7. ↑ “Get Chromium on Ubuntu To Play MP4, H.264, MP3 & view PDF files natively”, OMG Ubuntu, (2010-11-21) 2014年10月30日閲覧。
  8. ↑ http://earthwithsun.com/questions/655605/how-do-i-add-mp3-mp4-and-h-264-support-to-chromium-on-windows
  9. ↑ “Audio/Video”. Google. 2018年10月1日閲覧。
  10. ↑ “Issue 2093007: Chromium side changes for enabling VP8 and WebM support”, Code review, Google 2014年10月30日閲覧。
  11. ↑ http://src.chromium.org/viewvc/chrome?view=rev&revision=172738
  12. 1 2 “Stable Channel Update for Desktop” (英語) (2026年8月11日). 2026年8月11日閲覧。
  13. ↑ “Stable Channel Update for Desktop [Linux]” (英語) (2026年8月11日). 2026年8月11日閲覧。
  14. ↑ “Chrome for Android Update” (英語) (2026年8月11日). 2026年8月12日閲覧。
  15. ↑ “Chrome Stable for iOS Update” (英語) (2026年8月12日). 2026年8月12日閲覧。
  16. ↑ “Google Chrome support Theora and Vorbis”, Code, Google, (2010-05-20) 2014年10月30日閲覧。
  17. 1 2 Google Chrome 3.0 will support <video> tag, FR: C net
  18. ↑ Mike, Jazayeri (2011年1月11日). “Chromium Blog: HTML Video Code Support in Chrome”. The Chromium Blog. 2014年10月30日閲覧。
  19. 1 2 3 “Apple Supports H.265, But So Far Only in FaceTime on an iPhone 6”. StreamingMedia.com (2014年11月5日). 2018年10月1日閲覧。
  20. ↑ Bankoski, Jim (2010-05-19), “WebM and VP8 land in Chromium” (World Wide Web log), Chromium, Google 2014年10月30日閲覧。
  21. ↑ Kersey, Jason (2010-06-03), “Dev Channel Update”, Chrome Releases, Google 2014年10月30日閲覧。
  22. ↑ Chrome Adds Support for the Next-Generation VP9 Video Codec and Mozilla's Opus Audio 2014年10月30日閲覧。
  23. ↑ Chrome Now Supports Google's Next-Gen VP9 Video Codec by Default 2014年10月30日閲覧。
  24. ↑ McCracken, Harry (2010-03-16), Microsoft Previews the Revamped Internet Explorer 9 Platform, Technologizer 2014年10月30日閲覧。
  25. 1 2 HTML5 Video Support in IE9 Mobile, Microsoft, (2011-10-13) 2014年3月11日閲覧。
  26. ↑ “Introducing the Web Media Extension Package with OGG Vorbis and Theora support for Microsoft Edge”. Microsoft Edge Team (2017年12月5日). 2018年10月1日閲覧。
  27. ↑ “HTML5test - How well does your browser support HTML5?”. HTML5test. 2018年10月1日閲覧。
  28. ↑ “HTML5test - How well does your browser support HTML5?”. HTML5test. 2018年10月1日閲覧。
  29. ↑ “The status of VP9 Video Playback in Microsoft Edge is Shipped”. Microsoft. 2018年10月1日閲覧。
  30. ↑ “WebM, VP9 and Opus Support in Microsoft Edge”. Microsoft Edge Team (2016年4月18日). 2018年10月1日閲覧。
  31. ↑ “HTML5test - How well does your browser support HTML5?”. HTML5test. 2018年10月1日閲覧。
  32. ↑ “v26.04.2 · Tags · Network / Konqueror · GitLab” (英語) (2026年5月29日). 2026年6月15日閲覧。
  33. ↑ Vestbø, Tor Arne (2008-05-13), Top Secret, Hush Hush!, Nokia 2014年10月30日閲覧。
  34. ↑ “Firefox 153.0.4, See All New Features, Updates and Fixes” (英語) (2026年8月11日). 2026年8月11日閲覧。
  35. ↑ “Firefox ESR 153.0esr, See All New Features, Updates and Fixes” (英語) (2026年7月21日). 2026年7月21日閲覧。
  36. ↑ (release notes) Firefox 3.5, Mozilla, (2009-06-30) 2014年10月30日閲覧。
  37. ↑ Bug 799315 – Windows Media Foundation backend for media playback, Mozilla 2014年10月30日閲覧。
  38. ↑ Bug 837859 – Enable WMF backend, Mozilla 2014年10月30日閲覧。
  39. ↑ Bug 566243 – Merge mozilla-webmedia repository to mozilla-central, Mozilla 2014年10月30日閲覧。
  40. ↑ Firefox Nightly Builds, Mozilla 2014年10月30日閲覧。
  41. ↑ [Phoronix Mozilla Firefox Enables VP9 Video Codec By Default], Phoronix 2014年10月30日閲覧。
  42. ↑ http://www.mozilla.org/en-US/firefox/28.0/releasenotes/
  43. ↑ “DASH playback of AV1 video in Firefox”. Mozilla Hacks. 2018年10月1日閲覧。
  44. ↑ Bug 825153 - Add support for Windows Vista WMF and prepend the system32 directory path to dll names, Mozilla 2014年10月30日閲覧。
  45. ↑ http://blog.divx.com/2010/12/16/hey-microsoft-divx-already-supports-h-264-with-html5-in-firefox/
  46. ↑ https://forums.divx.com/divx/topics/html5_integration_broken
  47. ↑ Bug 886181 - Pref on gstreamer backend, Mozilla 2014年10月30日閲覧。
  48. ↑ Bug 794282 - Enable GStreamer in official builds, Mozilla 2014年10月30日閲覧。
  49. ↑ http://arstechnica.com/information-technology/2012/11/mozilla-ships-firefox-with-h-264-support-on-android/
  50. ↑ Bug 1070703 - Add mp4 support in 10.6 and 10.7 on Aurora, Mozilla 2014年10月30日閲覧。
  51. ↑ https://developer.mozilla.org/en-US/Apps/Build/Audio_and_video_delivery/H.264_support_in_Firefox
  52. ↑ “Opera ブラウザ - ニュースおよび検索” (2018年2月12日). 2018年2月16日閲覧。
  53. ↑ “Opera Mobile Classic” (2014年11月16日). 2015年1月20日閲覧。
  54. ↑ “Opera Mobile 12.0.2 for S60” (2012年6月24日). 2014年2月25日時点のオリジナルよりアーカイブ。2014年10月16日閲覧。
  55. ↑ “No mobile phone left behind: Opera Mini 5 and Opera Mobile 10 introduced in final, consumer-ready versions” (2010年3月16日). 2014年10月16日閲覧。
  56. ↑ “The Case for VP9”. StreamingMedia.com. 2018年10月1日閲覧。
  57. ↑ “(no title)”. Opera Norway AS. 2026年8月3日閲覧。
  58. 1 2 “Index of /ftp/pub/opera/desktop/” (2026年7月23日). 2026年7月27日閲覧。
  59. ↑ “(no title)”. Opera Norway AS. 2026年7月27日閲覧。
  60. ↑ “VPN を備えた Opera ブラウザ - Google Play のアプリ”. Google Play. 2026年7月13日閲覧。
  61. ↑ “‎Opera ブラウザとプライベート VPNアプリ - App Store”. App Store. 2026年7月13日閲覧。
  62. ↑ “Opera Mini Web ブラウザ - Google Play のアプリ”. Google Play. 2026年7月13日閲覧。
  63. ↑ Jägenstedt, Philip (2009-12-31), “(re-)Introducing <video>” (official blog), Core developers (Opera) 2014年10月30日閲覧。
  64. ↑ http://blogs.opera.com/desktop/changelog-24/
  65. ↑ Lie, Håkon Wium (2010-05-19), Welcome, WebM <video>!, Opera 2014年10月30日閲覧。
  66. ↑ Mills, Chris (2010-05-19), Opera supports the WebM video format, Opera 2014年10月30日閲覧。
  67. ↑ “Safari 26.6 Release Notes”. Apple. 2026年8月3日閲覧。
  68. ↑ “HTML5 video formats”, Web design, About.
  69. ↑ “Media formats supported by the HTML audio and video elements”, Developer, Mozilla.
  70. ↑ “WWDC17 – HEVC with HLS – Apple just announced a feature that we support out of the box”. Bitmovin (2017年6月6日). 2018年10月1日閲覧。
  71. ↑ “WebM plugin available”, Code, Google 2014年10月30日閲覧。
  72. ↑ Catanzaro, Michael (2020年11月25日). “GNOME 3.38.2 released!”. gnome-announce-list (Mailing list) (英語). 2020年12月1日閲覧.
  73. ↑ Persch, Christian (April 1, 2008), “The Future of Epiphany” (announcement), epiphany mailing list-list
  74. ↑ “Overview of available plug-ins”, GStreamer 2014年10月30日閲覧。

外部リンク

[編集]
「https://ja.wikipedia.org/w/index.php?title=Video要素&oldid=109824430」から取得