Getting Started with HTML5 Video

The Current State of HTML5 Video Support

 Project Files

Video Container Formats

  • MPEG 4 – .mp4 or .m4v
  • Flash Video – .flv extension
  • Ogg – .ogv – open standard – Firefox 3.5+, Chrome 4+, and Opera 10.5+
  • WebM – .webm
  • Audio Video Interleave – .avi extension

Playing a Fragment of Video


Encoding Tools

The Markup

html markup


A Boolean attribute; if specified, the video will automatically begin to play back as soon as it can do so without stopping to finish loading the data.

An attribute you can read to determine which time ranges of the media have been buffered. This attribute contains a TimeRanges object. More information >

If this attribute is present, Gecko will offer controls to allow the user to control video playback, including volume, seeking, and pause/resume playback.

The height of the video’s display area, in CSS pixels.

A Boolean attribute; if specified, we will, upon reaching the end of the video, automatically seek back to the start.

A Boolean attribute which indicates the default setting of the audio contained in the video. If set, the audio will be initially silenced. Its default value is false, meaning that the audio will be played when the video is played.

A TimeRanges object indicating all the ranges of the video that have been played.

A URL indicating a poster frame to show until the user plays or seeks. If this attribute isn’t specified, nothing is displayed until the first frame is available; then the first frame is displayed as the poster frame.

The URL of the video to embed. This is optional; you may instead use the element within the video block to specify the video to embed.

The width of the video’s display area, in CSS pixels.

Prebuilt players and API’s

Feature Comparison 

Links of Interest