HTML5 VIDEO

Inserting video onto a web page is not relatively easy, because browsers did not have a uniform standard for defining embedded media files.

In this chapter we’ll demonstrates some of the many ways of adding videos on web pages, from the latest HTML5 <video> element to the popular YouTube videos.

Using the HTML5 video Element

The newly introduced HTML5 <video> element provides a standard way to embed video in web pages. However, the video element is relatively new, but it works in most of the modern web browsers. The following example simply inserts a video into the HTML5 document, using the browser default set of controls, with one source.

EXAMPLE
<video controls="controls" src="media/shuttle.mp4">
    Your browser does not support the html5 video element.
</video>
Result

A video, using the browser default set of controls, with alternative sources.

EXAMPLE
<video controls="controls">
    <source src="media/shuttle.mp4" type="video/mp4">
    <source src="media/shuttle.ogv" type="video/ogg">
    Your browser does not support the html5 video element.
</video>
Result