Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why is there a need for <video> or <audio>?

Tags:

html

video

audio

HTML5 brings or will bring <video> and <audio> tags, among others. Ever since I heard of them, and even more so after reading Why do we have an img element? and particularly Jay C. Weber's message back from 1993 I wondered: Why the heck?

HTML has had a generic media-inclusion method for quite some time now. It supports fallback to other formats and text if the author so wishes which are now needlessly duplicated in two more special-purpose tags, each for a single kind of media.

To me, both <video> and <audio> are just <object>s in disguise – or am I missing something really important here that both of them support and <object> does not?

My confusion stems from the following problem: Given a snippet as this one:

<video id="movie" width="320" height="240" preload controls>
  <source src="pr6.mp4" />
  <source src="pr6.webm" type='video/webm; codecs="vp8, vorbis"' />
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"' />
  <object>
     ... fallback to Flash object
  </object>
</video>

Couldn't it have been written akin to

<object width="320" height="240" data='pr6.mp4'>
  <object width="320" height="240" data='pr6.webm' type='video/webm; codecs="vp8, vorbis"'>
    <object width="320" height="240" data="pr6.ogv" type='video/ogg; codecs="theora, vorbis"'>
      <object>
        ... fallback to Flash object
      </object>
    </object>
  </object>
</object>

preload and controls could be given as <param> elements and I'm not quite sure how to handle the id attribute right now.

Still, is there anything that prevents browser vendors from just rendering video and audio content with the right MIME type and codec themselves instead of handing them to a plugin?

like image 557
Joey Avatar asked Oct 05 '10 07:10

Joey


2 Answers

<video> and <audio> tags are not <object> in disguise. See this excellent explanation of new tags. In short, HTML-5 browsers are exposing their native support for audio and video. They will play video source known to them, or fall back to good old Flash, like this:

<video id="movie" width="320" height="240" preload controls>
  <source src="pr6.mp4" />
  <source src="pr6.webm" type='video/webm; codecs="vp8, vorbis"' />
  <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"' />
  <object>
     ... fallback to Flash object
  </object>
</video>

Edit: MIME type may tell everything, but only after you requested a file. <object>'s are bad for HTML analysis and semantics. Does JS know MIME types?

like image 177
alxx Avatar answered Sep 25 '22 00:09

alxx


I would just like to point out that there are also niceties you get from using the video/audio elements such as getting free controls to scrub, pause/play, being able to specify attributes like loop and playback rate.

You can also get a handle to it with javascript and access the API for the element.

like image 44
Chris Ching Avatar answered Sep 26 '22 00:09

Chris Ching