Dom-uslugi66.ru

Бюро Домашних Услуг

HTML5 video

   HTML

HTML5 video – это элемент, включенный в проект спецификации HTML 5, который используется для воспроизведения видеозаписей,[1] частично заменяя элемент <object>.

Adobe Flash Player широко использовался для того, чтобы заливать содержимое видео файлов на сайты (например, YouTube). Flash Player доступен в качестве плагина для большинства веб-браузеров последних версий (таких как Mozilla Firefox, SeaMonkey, Opera и Safari), и не совместим, например, со встроенными браузерами iPod и iPhone от Apple, а также с Android версии 2.01 или меньше. Google Chrome не нуждается в данном плагине с тех пор, как Google добавил плеер в браузер.[2] Создатели HTML 5 video считают, что это станет стандартным способом просмотра видео онлайн, но основным препятствием для принятия данного соглашения является вопрос о том, какие именно видео форматы должны поддерживаться этим видео тэгом.

Содержание

Пример использования элемента <video>

Ниже написан фрагмент кода на HTML 5, который позволяет залить WebM видео на веб-сайт

<video src="movie.webm" poster="movie.jpg" controls>
        This is fallback content to display if the browser
        does not support the video element.
</video>

Множественность ресурсов

Используя любое количество элементов <source>, как показано ниже, браузер выберет автоматически, какой файл загружать. Также, чтобы добиться того же результата, можно использовать функцию canPlay() из JavaScript. Атрибут «type» определяет тип MIME и список кодер-декодеров, которые помогают браузеру определить, может ли он расшифровать файл или нет. Из-за отсутствия общего видео формата, множественность ресурсов является важной особенностью для того, чтобы избегать «фырканья» браузера, что склоняет его к ошибке: известно, что любые знания веб-разработчиков о браузерах будут неполными, браузер знает о себе больше.

<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>This is fallback content</p>
</video>

Поддерживаемые видео-форматы

Текущий проект спецификации HTML 5 не уточняет, что браузер должен поддерживать любой формат видео файлов в теге video. Пользовательские агенты свободно поддерживают любой видео формат, который считают соответствующим.

Дебаты насчет видео-формата по умолчанию

Основная статья: Use of Ogg formats in HTML5

Рабочая группа HTML 5 считает, что желательно определить по крайней мере один видео формат, который бы поддерживался всеми браузерами. Идеальный формат в этом отношении должен:

  • иметь хорошее сжатие, хорошее разрешение изображения и низкие затраты работы процессора для расшифровки
  • быть бесплатным
  • в дополнение к программным декодерам, для формата должен существовать декодер для видео с аппаратных средств, так как у многих встроенных процессоров нет возможности расшифровать видео в нужный нам формат

Изначально, Ogg Theora был рекомендуемым стандартом для HTML 5, потому что он не был затронут никакими известными патентами. Но 10 Декабря 2010 года спецификация HTML 5 была подкорректирована,[3] изменились ссылки на конкретные форматы:

Браузеры должны поддерживать Theora video и Vorbis audio также, как и контейнерный формат Ogg.

с дополнением[4]:

Было бы очень полезно для функциональной совместимости, если бы все браузеры смогли поддерживать один кодер-декодер. Но не существует ни одного такого кодер-декодера, который бы удовлетворял всех: нам нужен такой кодер-декодер, который, как известно, не требует лицензирования, который совместим с современной развивающейся моделью, который имеет достаточно качеств, чтобы быть пригодным, и который не станет подводным камнем для крупных компаний. Это текущая проблема, и эта часть будет еще доработана.[5]

Хотя Theora не затронута известными патентами, такие компании как Apple[6] и Nokia опасаются неизвестных патентов, чьи собственники могли бы ждать корпорацию с финансовыми ресурсами, чтобы предъявить иск по использованию данного формата.[7][8] Такие не запатентованные форматы, как H.264, также могли бы использоваться в принципе, но они широко известны и по-этому предполагается, что любой потент-собственник уже может намереваться их занять. Apple также возражает против требования о поддержке формата Ogg в HTML 5 на тех основаниях, что некоторым приспособлениям поддерживать другие форматы намного легче и что HTML ни разу за всю историю его существования не требовал особые форматы для чего-либо.[8]


Некоторые веб-разработчики раскритиковали удаление Ogg-форматов из спецификации.[9][10][11] Последующее обсуждение также произошло и в FAQ блоге W3C.[12]

H.264/MPEG-4 AVC широко используем и обладает хорошей скоростью, сжатием, декодером для аппаратных средств, но он уже запатентован.[13] Кроме особых случаев пользователям H.264 приходится платить за лицензию  MPEG LA - группе патентов-собственников, включая Apple и Microsoft.[14] В итоге решили, что нет необходимости в кодер-декодере по умолчанию.

Google покупает On2

Приобретение Google-ом On2 происходит в результате выпуска формата VP8, который является бесплатным открытым стандартом, и создания WebM Project, который соединяет VP8 video с Vorbis audio в контейнер Matroska. Выпуск VP8 был также поддержан Free Software Foundation.[15]

Когда Google объявил в январе 2011 года, что это закончило бы поддержку H.264 в Chrome-e, критика пришла от многих, включая Питера Брайта из Ars Technica[16] и веб «проповедника» Тима Снита из Microsoft, которые заявили, что раньше объявят эсперанто официальным языком Соединенных Штатов, чем Google продвинется в этом деле.[17]. Однако Говард Моен из Opera Software сильно раскритиковал статью Ars Technica[18] , и Google ответила на реакцию, объяснив свое решение тем, что они намерены продвигать WebM и их проекты на основе их открытости.

Браузерная поддержка

Значения

Значения показывают уровень поддержки в самых последних версиях разметка или(если известен номер версии) в указанной версии. Номер версии без каких-либо других значений указывает на версию, с которой впервые полностью поддерживаются все необходимые свойства для разметки.

Значение Описание
Yes показывает, что разметка полностью поддерживает данное свойство/элемент, когда используются правильные значения
No показывает, что свойство/элемент полностью игнорируется
Partial показывает, что свойство/элемент понято, но не все его значения поддерживаются. Поддерживаемые значения выполняются правильно.
Incorrect показывает, что свойство/элемент понято, но работает правильно не во всех случаях.
Experimental показывает, что свойство/элемент понято, но поддерживается под другим именем. Может быть незавершенным или глючным
Dropped показывает, что свойство/элемент больше не поддерживается
Nightly build показывает, что свойство/элемент поддерживается в некоторой степени в экспериментальной/ночной среде. Ожидается поддержка в будущем.
Depends показывает, что свойство/элемент поддерживается только на определенных платформах или если сконфигурированы определенные условия.

Таблица

Эта таблица показывает, какие видео-форматы вероятно будут поддерживаться указанным браузером. Большинство браузеров, представленных здесь, используют  multimedia framework для раскодирования и отображения видео-файла вместо того, чтобы включить такие компоненты в программное обеспечение. Как правило невозможно перечислить все форматы, которые поддерживает multimedia framework без их запроса, так как все зависит от операционной система и типа кодер-декодера.[19] В таких случаях поддерживаемый видео-формат является атрибутом для framework, а не для браузера или его разметки; браузер обязательно спрашивает свой multimedia framework, прежде чем отвергнуть неизвестный видео-формат. Видео-формат может быть определен с помощью MIME в HTML. (Смотри example) MIME используется для уточнения у multimedia frameworks о поддерживаемых форматах. [note 1]

Среди этих браузеров только Firefox, Opera и Origyn используют библиотеки для встроенного раскодирования. На деле Internet Explorer и Safari  также могут обеспечивать поддержку определенных форматов, потому что их изготовители также сделали их multimedia frameworks. С другой стороны, у Konqueror есть идентичная поддержка формата, когда Internet Explorer используется на Windows, и когда Safari используется на Mac, но поддержка для Konqueror, показанная здесь, типична для GNU/Linux, где Konqueror в основном и используется. В основном поддержка браузерами формата навязана конфликтующими интересами производителей, в особенности Media Foundation и QuickTime поддерживают коммерческие стандарты, тогда как Gstreamer и Phonon не могут законно ничего поддерживать, кроме бесплатных форматов по умолчанию на бесплатных операционных системах, для которых они созданы.

Браузер Последняя стабильная версия Форматы, поддерживаемые различными веб браузерами
Ogg Theora H.264 VP8 (WebM) Others
Internet Explorer 9.0 (14 Марта 2011 года) Manual install[note 2] 9.0[23] Manual install[note 3][note 4] Нет[26]
Mozilla Firefox[27] 6.0 (16 Августа 2011 года 3.5[28] Нет[note 5] 4.0[30][31] Нет
Google Chrome 13.0.782.112 (9 Августа 2011 года) 3.0[32][33] Да[34] (to be removed)[35] 6.0[36][37] Нет[38]
Chromium x r18297[39] Нет[40] r47759[41] Нет[38]
Safari 5.1 (20 Июля 2011 года) Manual install[note 6] 3.1[42][43] Manual install[44] Depends[note 7]
Opera 11.50 (Build 1074) (28 Июня 2011 года) 10.50[46] Нет 10.60[47][48] Нет
Konqueror 4.7 (27 Июля 2011 года) 4.4[49] Depends[note 8] Да[51] Depends[note 8]
Epiphany 3.0.4 (1 Июля 2011 года) 2.28[52] Depends[note 9] Depends[note 9][53] Depends[note 9]

Использование

С Апреля 2010 года вслед за запуском iPad от Apple большое количество высококлассных сайтов начало работать с  H.264 HTML 5 видео вместо Flash для браузеров, распознающихся как iPad.[54]

В Мае 2010 года HTML 5 video еще не так широко распространено, как Flash видео, хотя DailyMotion[55] недавно массово выпустил экспериментальные видео-плееры на основе HTML5 (использующие форматы Ogg Theora и Vorbis), YouTube[56] (использующий форматы H.264 и WebM) и Vimeo[57](использующий формат H.264) намекают, что интерес к приему HTML 5 видео увеличивается.

Некоторые крупные, обеспечивающие видео, веб-сайты опубликовали решение продолжить использование технологий, отличающихся от HTML 5 video.[58][59][60] Согласно статье блога YouTube, тег <video> не удовлетворяет всем потребностям веб-сайтов, таких как YouTube.[61] В заявленные важные причины входит необходимость стандартного формата, отсутствие эффективного и надежного метода для передачи видео браузеру, неспособность JavaScript отображать видео на полный экран и проблема защиты содержимого. Хулу также не принял HTML 5 video из-за неспособности обеспечить пользователя адаптивным диапазоном частот для видео, обеспечить содержание производителя и предоставлять рекламодателям данные.[62]Netflix заявил, что есть много проблем, которые мешают ему использовать HTML 5 video: приемлемые контейнерные A/V форматы; допустимые аудио и видео кодер-декодеры, потоковый протокол, метод для потокового протокола, чтобы адаптировать его к доступным диапазонам частот, метод для передачи информации о доступных потоках и другие параметры для модуля воспроизведения потока данных; метод поддержки защищенных данных; и метод отображения всей этой функциональности в HTML 5.[59][63]

11 Января 2011 года Google's Chromium Project объявил в своем блоге, что поддержка закрытых кодер-декодеров(например, H.264) будет удалена из будущих версий Chrome-а. В объявлении Chromium особенно выделялось то, что эта ликвидация была попыткой увеличить популярность использования не лицензионного HTML 5 и тега <video>, стимулируя всю сеть принять общедоступный кодер-декодер для VP8 и Theora.

Заметки

  1. ↑ at least for Phonon and its backends [20], that is DirectShow, QuickTime and GStreamer
  2. ↑ Supported if OpenCodecs is installed. Also possible with Google Chrome Frame[21][22]
  3. ↑ Google released a WebM component for Media Foundation to allow the playback of WebM files in IE9 through the standard HTML5 <video> tag.[24]
  4. ↑ Possible if the user has installed a VP8 codec on Windows for IE9.[25]
  5. ↑ Possible on some systems if the HTML5 extension for Windows Media Player Firefox plug-in is installed.[29]
  6. ↑ Supported if XiphQT is installed.
  7. ↑ Any format supported by QuickTime or Core Video on OS X.[45]
  8. ↑ 1 2 Any format supported by Phonon on Qt 4.5.[50]. Format support depends on the backend of Phonon. Available Phonon backends include GStreamer and xine; backends using MPlayer and VLC are in development.
  9. ↑ 1 2 3 Any format supported by GStreamer on Webkit/GTK+ builds of Epiphany.

Приложения

  1. The video element. HTML5: A vocabulary and associated APIs for HTML and XHTML. World Wide Web Consortium (24 Июня 2010 года). — «A video element is used for playing videos or movies.»  Проверено 27 Сентября 2010 года.
  2. Adobe Flash Player : Basic browser settings - Google Chrome Help. Google Inc.. Проверено 9 июля 2011.
  3. [whatwg] Video codec requirements changed. Список рассылки whatwg mailing list (10 Декабря 2007 года). Проверено 25 Февраля 2008 года.
  4. (X)HTML5 Tracking. HTML5.org. Проверено 23 Июня 2009 года.
  5. [whatwg] Removal of Ogg is *preposterous*. Список рассылки WHATWG (11 Декабря). Проверено 25 Августа 2009 года.
  6. Steve Jobs: mystery patent pool to attack Ogg Theora. The Register. Проверено 9 Июля 2011 года.
  7. Re: [whatwg] Removal of Ogg is *preposterous*. Список рассылки whatwg mailing list (11 Декабря 2007 года). Проверено 25 Февраля 2008 года.
  8. ↑ [whatwg] Codecs (was Re: Apple Proposal for Timed Media Elements). Список рассылки whatwg mailing list (21 Марта 2007 года). Проверено 25 Февраля 2008 года.
  9. The Attack Against Ogg Theora or: How I Learned to Stop Worrying and Love the Proprietary Web. Metavid (11 Декабря 2007 года). Архивировано из первоисточника 23 Июня 2009 года. Проверено 30 Июня 2009 года.
  10. rudd-o.com. rudd-o.com (11 Декабря 2007 года). Проверено 30 Июня 2009 года.
  11. Abbadingo » Blog » Removal of Ogg Vorbis and Theora from HTML 5: an outrageous disaster. Delcorp.org (12 Декабря 2007 года). Проверено 30 Июня 2009 года.
  12. When will HTML 5 support <video>? Sooner if you help. W3C (18 Декабря 2007 года). Проверено 23 Июня 2009 года.
  13. AVC/H.264 Patent List, MPEG LA, 1 Февраля 2010 года, <http://www.mpegla.com/main/programs/avc/Documents/avc-att1.pdf> 
  14. AVC/H.264 Licensors, MPEG LA, <http://www.mpegla.com/main/programs/AVC/Pages/Licensors.aspx> 
  15. FSF gratulates google. FSF (19 Мая 2010 года).
  16. Google's dropping H.264 from Chrome a step backward for openness. Ars Technica (12 Января 2011 года 12:30).
  17. An Open Letter from the President of the United States of Google. MSDN (11 Января 2011 года).
  18. Is the removal of H.264 from Chrome a step backward for openness?. My Opera (13 Января 2011 года 14:29).
  19. Phonon documentation of backends, Qt, <http://doc.qt.nokia.com/latest/phonon-overview.html#backends>. Проверено 3 Июня 2011 года. 
  20. Phonon documentation of querying, Qt, <http://doc.qt.nokia.com/latest/phonon-overview.html#querying-backends-for-support>. Проверено 3 июня 2011. 
  21. Introducing YouTube HTML5 Supported Videos, Official YouTube Blog, <http://youtube-global.blogspot.com/2010/01/introducing-youtube-html5-supported.html>. Проверено 12 марта 2010. 
  22. Try our new HTML5 player!, Vimeo Staff Blog, <http://vimeo.com/blog:268>. Проверено 12 Марта 2010 года. 
  23. Microsoft Previews the Revamped Internet Explorer 9 Platform, Technologizer, <http://technologizer.com/2010/03/16/ie9-platform-preview/> 
  24. More about the Chrome HTML Video Codec Change, Google, <http://blog.chromium.org/2011/01/more-about-chrome-html-video-codec.html> 
  25. Another Follow-up on HTML5 Video in IE9, Microsoft, <http://blogs.msdn.com/ie/archive/2010/05/19/another-follow-up-on-html5-video-in-ie9.aspx> 
  26. HTML5 Video, Microsoft, <http://blogs.msdn.com/ie/archive/2010/04/29/html5-video.aspx>. Проверено 5 Мая 2010 года. 
  27. https://developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements> 
  28. Mozilla Firefox 3.5 Release Notes, Mozilla, 2009-06-30, <http://www.mozilla.com/en-US/firefox/3.5/releasenotes/>. Проверено 15 Февраля 2010 года. 
  29. HTML5 Extension for Windows Media Player Firefox Plug-in, Microsoft Corporation, <http://www.interoperabilitybridges.com/html5-extension-for-wmp-plugin>. Проверено 28 Января 2011 года. 
  30. https://bugzilla.mozilla.org/show_bug.cgi?id=566243> 
  31. Firefox Nightly Builds, Mozilla, <http://nightly.mozilla.org/> 
  32. Google Chrome support Theora and Vorbis, Google, 2010-05-20, <http://code.google.com/p/chromium/wiki/ChromiumBrowserVsGoogleChrome> 
  33. Google Chrome 3.0 will support <video> tag, <http://www.cnetfrance.fr/news/google-chrome-3-39503164.htm> 
  34. Differences between Google Chrome and Linux distro Chromium, Google, 17 Марта 2011 года, <http://code.google.com/p/chromium/wiki/ChromiumBrowserVsGoogleChrome> 
  35. HTML Video Codec Support in Chrome, Google, 11 Января 2011 года, <http://blog.chromium.org/2011/01/html-video-codec-support-in-chrome.html> 
  36. WebM and VP8 land in Chromium, Google, <http://blog.chromium.org/2010/05/webm-and-vp8-land-in-chromium.html> 
  37. Google Chrome Releases: Dev Channel Update, Google, <http://googlechromereleases.blogspot.com/2010/06/dev-channel-update.html>. Проверено 1 Июля 2010 года. 
  38. ↑ Issue 21318: Query FFmpeg libraries for codec support, Google, <http://code.google.com/p/chromium/issues/detail?id=21318>. Проверено 10 Сентября 2010 года. 
  39. Issue 4363: [HTML5-Video] Enable HTML5 video/audio elements, Google, <http://code.google.com/p/chromium/issues/detail?id=4363>. Проверено 10 сентября 2010. 
  40. ChromiumBrowserVsGoogleChrome, Google, <http://code.google.com/p/chromium/wiki/ChromiumBrowserVsGoogleChrome>. Проверено 10 Сентября 2010 года. 
  41. Issue 2093007: Chromium side changes for enabling VP8 and WebM support., Google, <http://codereview.chromium.org/2093007>. Проверено 10 Сентября 2010 года. 
  42. About the Safari 3.1 Update, 2008-03-17, <http://support.apple.com/kb/TA25197>. Проверено 15 февраля 2010. 
  43. Apple shows off Safari's HTML 5 support, Macworld, <http://www.macworld.com/article/139285/2009/03/safarihtml5.html>. Проверено 13 марта 2010. 
  44. https://code.google.com/p/webm/downloads/detail?name=WebM%20Component%20Installer.pkg&can=2&q=>. Проверено 23 июня 2011. 
  45. HTML5 Media Support, WebKit Open Source Project: Surfin' Safari, 12 Ноября 2007 года, <http://webkit.org/blog/140/html5-media-support/>. Проверено 11 Марта 2010 года. 
  46. (re-)Introducing <video> - Official blog for Core developers at Opera, Opera, <http://my.opera.com/core/blog/2009/12/31/re-introducing-video>. Проверено 6 Февраля 2010 года. 
  47. Welcome, WebM <video>!, Opera, <http://labs.opera.com/news/2010/05/19/> 
  48. Opera supports the WebM video format, Opera, <http://dev.opera.com/articles/view/opera-supports-webm-video/> 
  49. KHTML Browsers including Konqueror, Legend Scrolls, <http://www.legendscrolls.co.uk/webstandards/khtml>. Проверено 12 марта 2010. 
  50. Top Secret, Hush Hush!, Nokia Corporation, <http://labs.trolltech.com/blogs/2008/05/13/top-secret-hush-hush/>. Проверено 14 марта 2010. 
  51. webm troubleshooting for Konqueror, Xiph.org, <http://wiki.xiph.org/Playback_Troubleshooting#Konqueror>. Проверено 1 Июня 2011 года. 
  52. HTML5 media support with GStreamer, <http://www.atoker.com/blog/2007/12/08/html5-media-support-with-gstreamer/>. Проверено 12 марта 2010. 
  53. YouTube and WebM support, Fedora Project, <http://fedoraproject.org/wiki/Flash#YouTube_and_WebM_support>. Проверено 1 июля 2010. 
  54. iPad-ready websites. Apple, Inc.. Проверено 5 Апреля 2010 года.
  55. Watch Video…without Flash. Dailymotion (27 Мая 2009 года). Проверено 18 Мая 2010 года.
  56. Introducing YouTube HTML5 Supported Videos. Youtube (20 Января 2010 года). Проверено 7 Марта 2010 года.
  57. Try our new HTML5 player!. Vimeo (21 Января 2010 года). Проверено 7 Марта 2010 года.
  58. Gizmodo: HTML5 isn't going to save the internet
  59. ↑ Gigaom.com: Netflix has no plans to use HTML5
  60. Pseudocoder: Why HTML5 won't replace Flash
  61. Flash and the HTML5 <video> tag.
  62. Pardon Our Dust <video> tag.
  63. PCMag: Netflix working on HTML5 streaming

Внешние ссылки

  • HTML5 - The Video Element, W3C, <http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html> 
  • Lawson, Bruce & Lauke, Patrick H. (2010-02-11), Introduction to HTML5 video, Opera, <http://dev.opera.com/articles/view/introduction-html5-video/> 
  • HTML5Video.org - html5 video platform software and news, <http://html5video.org> 
  • Pieters, Simon (2010-03-03), Everything you need to know about HTML5 video and audio, Opera, <http://my.opera.com/core/blog/2010/03/03/everything-you-need-to-know-about-html5-video-and-audio-2> 
  • Pilgrim, Mark, Video on the Web, <http://diveintohtml5.org/video.html> 

HTML5 video.

© 2023 dom-uslugi66.ru, Россия, Ангарск, ул. Набережная 59, +7 (3951) 35-50-52