How to make HTML5 Video to work on all browsers

| Posted by absolute

While building a new website we recently stumbled upon an issue that some web browsers have handling that HTML5 video - specifically Internet Explorer and Firefox. 

Although we had an alternative solution available we knew it was possible to get the video working in for these browsers. It turned out that the problem was caused by the server not recognising the MIME-type. It was incorrectly serving it as text/plain when it should have been video/ogg.

What are the symptoms?

If you experience something similar check the console on your browser to see if it’s the same issue. If you see error messages stating that your videos are being served as text/plain and are not supported by the browser then it’s very likely to be this issue.

The cure

Luckily there is a quick solution. If you’'re using an apache web server simply add the following to an .htaccess file in the directory where you'’re storing the videos:

AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .web

This means that the server can detect the correct file types allowing for the video to be severed correctly.

You can find out more about HTML5 video and MIME-types here

If you want to talk to us about all things web development then get in touch with Dave Ellis on 0115 953 4800 ext. 201 or email