Justin James offers tips on using the HTML 5 <video> tag, including options for accessibility issues and browser support.</video>
One of the most exciting new features in HTML5 is the <video> tag, because it addresses a very common use case that currently is a headache (and potentially expensive) to deal with unless you are willing to put your content up on a site like YouTube. In addition to being free to use, the video tag is increasingly supported in browsers. For better or for worse, no video codec is specified by the HTML5 specification, which is the major drawback to using it, but it looks as though MPEG will be fairly well supported.
The first question you may have is, "What do I do about browsers that do now support <video>?" That is easily answered: the <video> tag may contain additional content, but browsers supporting <video> should not display it. This means that you can use the contents of <video> to have a reasonable default (a "can't display content" message, a Flash video player, an embedded YouTube object, etc.) that won't be displayed if the browser supports it.
The "preload" attribute is used to tell the browser if it should start to load the video before it starts to play. A value of "none" means that the browser should not preload at all, "metadata" tells it to load only the video's metadata, and "auto" allows the browser to get as much of the video as it wants ahead of time. If you set the value to "" then it will act as if you specified "auto." The HTML5 spec suggests (but does not require) that browsers use "metadata" if the value is not specified. You will want to definitely use a value here to ensure that the behavior is what you expect.
An interesting piece of the puzzle is the "mediagroup" attribute. By specifying a value for "mediagroup" you can have multiple <video> or <audio> elements tied to the same set of browser controls; when one plays, they all play, when one stops, they all stop. This is especially useful for providing alternative videos for accessibility. For example, you could have a secondary video that plays a series of text describing the main video for deaf users, and another with an audio track narrating the main video for blind users. An alternative to usability for the hearing disabled is the <track> element. You can use it to provide the browser with information on time track text files, which will provide captions, subtitles, etc. to be overlaid by the browser onto the video automatically.