HTML5 видео и деградация? - PullRequest
Новая
       40

HTML5 видео и деградация?

5 голосов
/ 15 декабря 2009

Я поигрался с видео-тегом HTML5 и озадачен тем, как лучше всего ухудшать, когда вы не можете поддерживать кодек?

Для старых браузеров (или IE), которые вообще не поддерживают тег видео, это довольно просто: 

<video width="320" height="240">
  <source src="vid.ogv" type='video/ogg'>
  <source src="vid.mp4" type='video/mp4'>
  <object>
  <!-- Embed Flash video here to play mp4 -->
  <object>
</video>

Они провалится и получат версию Flash (или другую альтернативу, такую ​​как изображение!)

Как насчет того, когда браузер поддерживает тег, но не кодек - как, например, FireFox 3.5 - и я не могу поддерживать OGG (возможно, потому что у меня уже есть обширные архивы H.264): 

<video width="320" height="240">
  <source src="vid.mp4" type='video/mp4'>
  <object>
  <!-- Embed Flash video here to play mp4 -->
  <object>
</video>

Все, что я получаю в FireFox 3.5, - это серая коробка с х. Это не совсем хороший пользовательский опыт для пользователей FireFox! Я могу думать только об использовании JavaScript для проверки FF3.5 и изменения DOM !! это действительно плохой старый снова и снова! ... или есть какая-то часть спецификации, которую я пропускаю, например тег 'novideo'?

Ответы [ 3 ]

4 голосов
/ 15 декабря 2009

Важной частью постепенной деградации являются возможности запросов ... Погружение в HTML5 - это отличное чтение ... в частности, посмотрите раздел видео . Соответствующий код здесь: 

function supports_h264_baseline_video() {
  if (!supports_video()) { return false; }
  var v = document.createElement("video");
  return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
}

Примечание: для этого требуется проверка DOM, но для возможностей, а не для подписи браузера. Это правильная вещь : -)

Как только вы узнаете, может ли браузер поддерживать, вы можете показать свой видео-тег или вывести лайтбокс или перенаправить по своему усмотрению.

1 голос
/ 28 марта 2011

Один действительно хороший способ решения этой проблемы - использовать библиотеку js модернизатора. Она действительно проста в использовании и быстра. Она может проверить возможности HTML5 в браузере пользователя. Посетите сайт здесь: http://www.modernizr.com/

0 голосов
/ 08 октября 2010

Видео для всех тестовая страница указывает, что Firefox 3.5 может воспроизводить только OGG. Возможно, вы захотите добавить флэш-версию, если вы действительно не хотите добавлять OGG. VfE также не использует JavaScript, так что, возможно, стоит посмотреть.

...