HTML5 Video Compatibility – Beginners Guide for Web Developers – 013.
HTML5 Video Compatibility – Beginners Guide.
This tutorial is connected from the previous HTML5 tutorial, the “HTML5 Video Tag“.
This is the continuation tutorial for HTML5 Video Tag.
Most browser supports HTML5 Video tag but some are not, so it is better to know the compatibility for lower versions in order for your HTML5 Video content could be playable in all browsers.
In order for your video to be played on all browser, all you need to do is to download the Miro Video Converter. It converts your .mp4, .mov, .avi and any video formats to WebM format.
WebM is a media file format designed for web. So in order for you to let your video be played in all browsers, all you need to do is to have a converter where it converts your video to WebM format.
Here’s the link of Miro Video Converter: http://www.mirovideoconverter.com/
So, after you have converted your video all you need to do is to call it from its source folder. Note that we are going to change the video tag code to locate the two video source code for it to have options on which to play depending on the browser. Also, put the converted video on your video folder from the boilerplate folder.
[html5]
<video controls>
<source src=”video/IMG_0463.mov”></source>
<source src=”video/IMG_0463.webm”></source>
</video>
[/html5]
After you have changed your line of code, the browser will select from the two source tag depending on which browser you will use. Try to run it on older versions of browser and you will notice that your video is playable without any issues and it also has controls!
On our next tutorial, we will be discussing about “HTML5 Video Attributes”. Stay tuned webbies!
For questions or any other concerns or thesis/capstone creation with documentation, you can contact me through the following:
E-Mail: [email protected]
Facebook: facebook.com/kirk.lavapiez
Contact No.: +639771069640
Ian Hero L. Lavapiez
BSIT Graduate, soon to be MIT.
System Analyst and Developer
Related topic(s) that you may like: