Chapter 1. HTML5 Video How-To

Welcome to HTML5 Video How-To, where we take you on a journey through using videos with the new HTML5 standard tags now available in most modern browsers.

In the beginning…

Back in the early years of the Internet, multimedia was limited to tinkering with MIDI files and animated GIFs—while these were considered very advanced at the time, some of us probably wonder why we ever used them, given the advanced state of web technologies available today!

If you wanted to include any multimedia file(s), you would be forced to include a cryptic block of code similar to the following code snippet:

<object width="425" height="344">
  <param name="movie"
value="http://www.youtube.com/v/9sEI1AUFJKw&hl=en_GB&fs=1&"></para
m>
  <param name="allowFullScreen"
    value="true"></param>
  <param name="allowscriptaccess"
    value="always"></param>
  <embed src="http://www.youtube.com/v/9sEI1AUFJKw&hl=en_GB&fs=1&"
    type="application/x-shockwave-flash" allowscriptaccess="always"
    allowfullscreen="true" width="425"
    height="344"></embed>
</object>

Tip

Downloading the example code

You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Most of the preceding code snippet has now become redundant, at least for modern browsers, due to advances in HTML technology since 2005. As you will see later in this book, this code has been reduced down to three to four lines (although you can add more options later if you wish).

The downside of this is that while the HTML5 standard code has shrunk, browser support has unfortunately not kept up—developers using the HTML5 <video> and <audio> tags must make allowances for different formats, as you will see throughout this chapter.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset