At Last, the Markup
I’m pretty sure this was supposed to be an HTML book. So where’s the markup?
HTML5 gives you two ways to include video on your
web page. Both of them involve the
<video> element. If you only have one
video file, you can simply link to it in a
src attribute. This is remarkably similar to
including an image with an
Technically, that’s all you need. But just like in an
<img> tag, you should always include
height attributes in your
<video> tags. The
height attributes can be the same as the maximum
width and height you specified during the encoding process:
<video src="pr6.webm" width="320" height="240"></video>
Don’t worry if one dimension of the video is a little smaller than
that. Your browser will center the video inside the box defined by the
<video> tag. It won’t ever be
smooshed or stretched out of proportion.
By default, the
element will not expose any sort of player controls. You can create your
own controls with plain old HTML, CSS,
element has methods like
pause() and a read/write
currentTime. There are also read/write
muted properties. So you really have
everything you need to build your own interface.
If you don’t want to build your own interface, you can tell the
browser to display a built-in set of controls. To do this, just include
controls attribute in your
<video src="pr6.webm" width="320" height="240" ...