Simple HTML5 video tag/player generator
With the introduction of the video tag in HTML5 you can easily add a video player to your website and play about any video file you want. There are a few attributes that you can set to customize the player behavior and you have a pretty good browser support too. So make use of this HTML5 video tag/player generator to embed your video into you own site. You can also find here a full tutorials about embeding a video file in plain html or in a wodpress site.
The video tag was introduced as an alternative to the Flash media content, but it has lots of other benefits:
- Easy configuration at HTML level
- Easy styling using CSS
- Easy event detection and interaction with JavaScript
So get started and generate you video tag using the above form.
Html5 video preload
Please note that the preload instruction is more like a recommendation to the browser. The action can be different from one browser to another and it can also vary depending on the user internet connection
- auto - The browser should load the entire video file. It is very possible that the user will play the video
- metadata - The browser should load only metadata when the page loads since it is very possible that the user will never play the video
- none - The browser should not load the video file when the page loads. You can also use this option to minimize bandwidth
MIME Types for Video Formats
Currently, there are 3 supported file formats for the <video> tag: MP4 - video/mp4, WebM - video/webm, and Ogg - video/ogg:
| Browser | MP4 | WebM | Ogg |
|---|---|---|---|
| Internet Explorer | |||
| Chrome | |||
| Firefox | |||
| Safari | |||
| Opera |
Video Attributes table
This are all attributes that can be specified to change the player behavior
| Attribute | Value | Description |
|---|---|---|
| autoplay | autoplay | The video should start playing as soon as possible. Please note that this option may fail on mobile browser and the user will have to tap for the video to begin. |
| controls | controls | All available controls should be displayed (Play, Pause, Seeking, Volume, Fullscreen, Subtitles and Track). |
| loop | loop | The video will start all over again when finished |
| muted | muted | The audio of the video will be muted |
| poster | URL | Provides an image to show before the user hits the play button and the video is loaded |
| preload | auto metadata none |
Recommendation for the browser about loading the video content |
| src | URL | Specifies the source of the video file |
| width | pixels | Sets the width of the video player |
| height | pixels | Sets the height of the video player |
