Лучший формат видео для HTML5? - PullRequest
22 голосов
/ 30 ноября 2010

У меня есть набор видео, которые будут размещены на новом сайте, который я разрабатываю, используя наш новый html5-плеер. Я знаю, что Firefox поддерживает только формат .ogg, тогда как большинство других (включая, в конечном итоге, IE9) поддерживают h264.

Я собираюсь использовать опыт толпы здесь: кому-нибудь повезло с одним видеоформатом в браузерах? Или я обречен на двойное кодирование? Просто стыдно тратить пространство на две копии каждого видео, потому что мы не можем стандартизировать наши кодеки.

Заранее спасибо!

PS (Flash player на самом деле не является резервным вариантом, частично из-за принципа, а частично из-за довольно большой мобильной базы пользователей.)

Ответы [ 3 ]

24 голосов
/ 30 ноября 2010

Исходя из моего личного опыта с HTML5 Video, я создаю форматы файлов mp4, ogg и flv и использую следующую реализацию:

<video id="movie" width="" height="" preload controls>
   <source id="srcMp4" src="video.mp4" />
   <source id="srcOgg" src="video.ogg" />
   <object id="flowplayer" name="flowplayer" width="480" height="352" data="http://releases.flowplayer.org/swf/flowplayer-3.2.5.swf" 
            type="application/x-shockwave-flash">
      <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.5.swf" />
      <param name="allowfullscreen" value="true" />
      <param name="flashvars" 
    value='config={"clip":"http://domain.com/video.flv"}' />
   </object>
</video>

Формат MP4 предоставляется первым из-за предыдущей ошибки вiPad, который видит только первый источник в списке.

Если браузер не может воспроизвести версию MP4, он пытается загрузить версию Ogg.Если это не помогает, он использует Flowplayer (флэш) в качестве запасного варианта.

Я знаю, что вы ищете решение без флэш-памяти в качестве запасного варианта, но, на мой взгляд, мы просто еще не пришли.Люди все еще используют IE6 для громкого крика!

HTML5 Видео все еще находится в стадии разработки, и пока оно не станет полностью стабильным во всех браузерах и платформах, вам потребуется обеспечить «обходной путь» для различных сценариев.

Для мобильных устройств, возможно, вы сможете обнаружить User-Agent и перейти оттуда ...

Надеюсь, это поможет

3 голосов
/ 30 ноября 2010

Вероятно, WebM, если не Ogg.Патенты WebM принадлежат Google, но были освобождены от этого.Ogg, вероятно, в порядке, но есть проблемы.H.264 - это патентная ловушка, ожидающая своего появления.

2 голосов
/ 14 июня 2011

У нас есть несколько схожая проблема.

<video id="movie" width="320" height="240" preload controls src="demo.mp4" /> 

Мы используем формат h.264, который я рекомендую вам сделать так же, поскольку у вас большая мобильная база пользователей (я полагаю, много iPhone).

Однако WebM - это открытый формат для людей с принципами;) Я могу только надеяться, что MS и Apple поддержат его в ближайшем будущем.

...