Considerations for HTML5 Video

In this quick tip about video, we'll explore how to use the HTML5 in a project. Because the old browsers and Internet Explorer do not support <video> elements, we must find a solution that supports Flash files for these browsers.

Unfortunately, as with HTML5 audio, the video file format, Firefox and safari/chrome support is not the same. Therefore, if you want to use HTML5 video at this time, you need to create three video versions.

. OGG

Firefox can support this format well. You can use VLC (media-> streaming/saving) to achieve easy conversion of the video.

. MP4

Many screen recording tools support automatic export of the MP4 format, and you can use them to generate video of the specified format for Safari and Chrome browsers.

. flv/. Swf

Not all browsers support HTML5 video, and of course, for compatibility, make sure you add a fallback Flash version.

<! DOCTYPE html>
 
Optional parameters for some <video> elements:
 
CONTROLS: boolean value, display Play/stop button;
Poster: The URL of the picture displayed before the video is played;
AutoPlay: Boolean, automatically play the video when the page is finished loading;
Width : The bandwidth required for the video. By default, the browser automatically detects the provided video size;
Height : video required altitude;
src: The path to the video file, using child elements <source> implementations better.
 
Considerations for HTML5 Video
 
1, need to create three kinds of video formats to achieve firefox,safari/chrome and IE support;
2, do not omit any one format. Can not be as compatible as you think HTML5 Firefox and Safari,safari can explain <video> tags, will expect to load the appropriate file, if omitted some form, will cause the player blank;
3. Remember that full screen display is not supported by Safari and Chrome. However, in the Firefox 3.6 version, you can view it in full screen.
4, to understand the reason IE loaded Flash file, because IE can not explain <video> elements. However, if the browser supports it, it will expect to load the appropriate files.
 
English manuscript:Quick tip:html5 Video with a fallback to Flash nettus+