Perfect HTML5 Video Tag

VideoTag.html

<!--  Nothing is pefect  -->
<!--  There is an exception to every rule, except this one  -->
<!--  Read notes and info after code  -->

<!--  //////////////////////////////// -->

<video width="400" height="300" controls="controls" poster="video.jpg"> 
	
	<!-- video format depending on what the browser supports -->
	<source src="video.mp4" type="video/mp4" />
	<source src="video.webm" type="video/webm" />
	<source src="video.ogv" type="video/ogg" />

	<!-- flash fallback if the browser doesn't support HTML5 -->
	<object type="application/x-shockwave-flash" width="400" height="300" data="video.swf"> 
		<param name="movie" value="video.swf" /> 
		<param name="wmode" value="transparent" /> 
		<!--[if lte IE 6 ]>
		<embed src="video.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="400" height="300"></embed>
		<![endif]--> 
		
		<!-- ultimate fallback when there is no HTML5 video support and no Flash support -->
		<img src="video.jpg" width="400" height="300" />
	</object> 
</video> 

<!--  

HTML5 video must have controls enabled because all modern browsers forbid autoplaying videos, even using a script;
Learn more about th video tag:  https://www.w3schools.com/tags/tag_video.asp

And don't forget to add the mime types in your webserver (Apache, Nginx, etc...):

The below guidelines are old and out of date, mp4 works in all modrn browsers and should be the one you use with an OGV backup, imo.

video/mp4 for .mp4: for Internet Explorer 9+ and Safari 5+

video/ogg for .ogv: for Firefox 3.5+, Opera 10.5+ and Google Chrome +6 (and Internet Explorer 9+ if the codec is installed)

video/webm for .webm: for Firefox 4+, Opera 10.6+ and Google Chrome 6+ (and Internet Explorer 9+ if the codec is installed)

application/x-shockwave-flash for .swf: for all browsers with Flash installed

You can use Miro Video Converter to generate all versions of the video and Flashdevelop to make a Flash movie

-->