Technological Creativity and Interaction Design

Find out what codecs your browser supports

Posted on 2012-10-31

Codec Detect

Even though HTML5 is quite promising, a lot of us realized that the fragmentation of what video and audio codecs are supported is quite an issue.

While making a clients's mobile version of their website, I tested on an Android phone and obtained a message from the embedded Vimeo video that the H264 codec was not supported. Even though each browser vendor publishes its own matrix of what they do and do not support, it's not always easy to find out that information quickly. Worse, not all clients are tech savvy, and they may not easily be able to provide you with the necessary information to figure out what codecs their browser or device support.

It came to me that I should create a simple tool to detect what codecs are supported in a browser. I was inspired by websites like playerversion.com and supportdetails.com to create codecdetect.com. Each website allows any user to find out technical information about their computer, information that they may not be able to know where to find.

So here you go internet, I offer you this tool for you to use to test your browsers and your client's browsers. You may view the JavaScript source all you want to see how I have done it. I will try to maintain and update it to the best of my knowledge, but if you find additional codecs that this tool should test, or better ways to do so, do not hesitate to share!

Link: codecdetect.com

EDIT (2012/11/05): I have added an email details form to make user's life easier (inspired from SupportDetails), and I have also put all the sources available on a Github repository for everyone to see. Enjoy!


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.