Due that Flash video cannot be supported by Apple’s iOS devices (iPad, iPhone, iPod, etc.) and some web browsers, HTML5 video is more and more widely implemented on websites and blogs. HTML5 video is an element introduced in the HTML5 draft specifying for the purpose of playing videos or movies, partially replacing the object element. It is intended by its creators to become the new standard way to show video on the web without plugins or third-part programs.

With Video Converter Mac App, it is rather easy and fast to create HTML5 web video for your website or blog. Let me walk you through the full process.

1. Download and install Video Converter App onto your Mac.

Download Link

2. Add a video file

Run Video Converter on your Mac and then press the + button to load a video file from your Mac hard drive. Alternatively, you can directly drag and drop the video file onto the left panel of the converter.

3. Clip the video

Generally, we won’t put a very long video onto our website or blog. Using the trim feature of Video Conveter Mac App, you will be able to clip the video to your desired length. You can clip the video by specifying the Start Time and Stop Time or pressing the scissors icons while previewing the video within the built-in player.

The trial version of this video converter will only output 3-min or shorter video files. So you can actually generate video files at the maximum of 3 minutes for free using this converter. In case you need longer than 3-min video files, you can consider paying for it or simply creating several separate video clips.

4. Create HTML5 video

Currently, there are 3 supported video formats for HTML5 <video> element: MP4, WebM, and Ogg.

Video Converter Mac App version 3.6.0 fully supports HTML5 video as the output video format. Just extend the profile drop-down list, select HTML5 Web Video from the category and then you will find three output format options:

• Theora Ogg Video
• HTML5 WebM Video
• HTML5 MP4 Video

Note: You will need to choose these three formats one by one to convert video files for three times.

5. Upload the HTML5 video files to web hosting

When the conversion is complete, you will be able to access the generated HTML5 video files in your Mac. Then you need to upload them to your web hosting using an FTP tool.

6. Edit your webpage or blog post

When the uploading is done, you can open the webpage or blog post you are going to insert the HTML5 video files.

Then copy and paste the following code into where you want the video to be displayed.

<video poster=”movie.jpg” controls>
<source src=”movie.webm” type=’video/webm; codecs=”vp8.0, vorbis”‘/>
<source src=”movie.ogv” type=’video/ogg; codecs=”theora, vorbis”‘/>
<source src=”movie.mp4″ type=’video/mp4; codecs=”avc1.4D401E, mp4a.40.2″‘/>
</video>

Note: You will need to replace movie.jpg with the video thumbnail and movie.webm, movie.ogv, movie.mp4 with the uploaded HTML5 video files. It is exceedingly important to make the file directory totally correct.

A sample HTML5 Video Player: Video Converter App Demo