Post Pic

HTML 5 Video in Emails

HTML 5 is the new version of HTML and XHTML. It is rising rather quickly and it has been said that it will play a huge part in the world of HTML in years to come. Although the final stages of HTML 5 are still in the works, browsers such as; Safari, Google Chrome and […]

HTML 5 is the new version of HTML and XHTML. It is rising rather quickly and it has been said that it will play a huge part in the world of HTML in years to come. Although the final stages of HTML 5 are still in the works, browsers such as; Safari, Google Chrome and Firefox are all supporting this new technology. The HTML5, <video> tag has been said to stand out particularly well. It has been said that this ‘tag’ was created to allow video support of all formats to work on all browsers without installations of any other plugins etc.

The below code seemed to give the best result, after all the current video options were removed.

<video width=”600″ poster=”fallback-image.png” controls autoplay>
<source src=”http://domain.com/video.mp4″ type=”video/mp4″ />
<source src=”http://domain.com/video.webm” type=”video/webm” />
<source src=”http://domain.com/video.ogv” type=”video/ogg” />

<!– Fallback if HTML5 video is not supported –>
<a href=”http://domain.com”><img border=”0″ src=”fallback-image.png” label=”Fallback Image” width=”600″></a>
</video>

As seen in the example, you have to add in a substitute image (this will be loaded as the image for the video before it is presented to the clients who want to support video for their emails) in the <video> tag. You also have to include the width and the height of the video. While showing reference of your source on your server, the ‘H.264′ encoded video should be called into the <video> tag. This is done by incorporating the <source> tag. After you have incoded all of this, you add in the content which you want displaying in your choosen email clients, ensuring that they don’t support HTML5 (while inside the <video> tag).

HTML5 Video Email Support

If you are a Mac using, your first choice should be Apple Mail. This is because, it has been said that the video will run effectively without problem. It has also showed perfect playback on the iPhone too. After a successful outcome with Apple Mail, you can then try out all the other email clients, like; Hotmail, Yahoo etc. However, with much disappointment, online web clients have chosen to not support HTML5 video playback. Although video playback isn’t supported, backup content will be able to be played. This feature was not supported before, so it will be appreciated now. The same happened on Windows too. The video was not supported however, the option for backup content was allowed.

Share this Article


2 Responses

08.10.12

Hi, Mohammed. My concern is Windows-based email clients which are still pretty popular in the workplace. What is the compatibility like for them?

08.10.12

Thanks for the insight on html5 video in emails! I have been researching the ability of different clients to support embded video, and what the current options are. Thanks!

Leave Your Response

* Name, Email, Comment are Required