How to Embed Video in an HTML5 Web Page

The video element is one of the more anticipated features of HTML5. With this tag, you can embed videos into a web page without requiring a plugin like Flash. The following code includes a helpful message for users who can't see the expected video:

  <video src = "bigBuck.ogv" controls>
    Your browser does not support embedded video
    through HTML5. 
  </video>

The <video> tag itself is pretty simple to understand, but the actual implementation is somewhat complex. HTML5 indicates a video tag, but it doesn't specify what format the browser will support, and, of course, all the browser manufacturers have a different opinion about which format to support. The three main video formats in contention are

• Ogg/Theora/Vorbis: Ogg is a container format that uses Vorbis encoding for audio and Theora encoding for video. The Ogg system is unencumbered by any known patents. It's supported by Firefox, Chrome, and Opera. (It's also supported by Safari if the user has installed the Vorbis plugin to QuickTime.) IE9 doesn't support this format.

  
  



• MP4/H.264/AAC: The MP4 standard is a container format using H.264 for video encoding and AAC for audio encoding. All three formats are subject to patent restrictions. This format is supported by Safari, Chrome, iPhone, IE9, and Android.

  
  



• WebM/VP8/Vorbis: WebM is a relatively new standard introduced by Google. It uses the VP8 video encoding format and Vorbis audio encoding. There's little support for WebM yet, but most browsers are indicating support for the format in upcoming versions.

  
  

Use the <source> tag to include all the major video formats. (You can use the free FFmpeg tool available for all major software platforms to convert your videos.) As a final fallback, use the <embed> tag inside your <video> tag to load the video with a Flash player.

You can use JavaScript to control the video element.

dummies

Source:http://www.dummies.com/how-to/content/how-to-embed-video-in-an-html5-web-page.html