Archive for the ‘ HTML5 ’ Category
This one doesn’t require much explanation. Basic rule of thumb when you want your video to look good as H.264 – DON’T USE APPLE’S VERISON IN COMPRESSOR. It sucks big time. Most editors have several other options, but I’ve found the best in my toolkit is Adobe Media Encoder’s version of Main Concept’s H.264.
These are identical data rates of the same frame (approx 1mbps at 1080×1920).
Learn how to download video from websites that give you permission.
This technique works particularly well with swf video players. The URL for the firefox add on is:
This is the 3rd part and my favorite web delivery codec of all time – H.264! H.264 will play happily in all Apple i-devices, Safari, Internet Explorer, and many others in the HTML5 protocol. What is important to understand about H.264, is there are several flavors of it. With my most recent testing last year, the open source version of X264 was by far the leader. Other vendors include Apple (the worst by far), Dicas (not included anymore in current software), and Main Concept (Adobe Media Encoder, Episode).
What is so awesome about this is, the BEST VERSION OF H.264 IS FREE! You can usually find good recent builds of this in Handbrake, a lifesaver of a free DVD encoding tool, as well as in MyCometG3′s radical plugin. You can download the plugin here:
http://www003.upp.so-net.ne.jp/mycometg3/
Yes, the website is ghetto, but the video output is amazing. You quickly install the quicktime component into your library and can compress with X264 via quicktime pro and compressor. A few of the great options available are:
Ever since I was opened up to the world of this plugin, I never use anything else for my day to day compressions. There are more options than any h.264 encoder on the market, and it is regularly updated to make it even better. It rocks!
Hopefully the part 1 post about HTML5 isn’t too long winded, but in reverence to your valuable time I will make this post short and to the point. Webm is another video format that is used in HTML5 delivery. Firefox 4.0 and Chrome are the players here.
The bad news here however is that there is not a good free option that I have found. To create good Webm video I am using a software package known as “Episode” for the mac. Version 6.1 is what I am currently running. Episode is a great tool, but does come with a $500 price tag and with the advent of a freely available X264 quicktime plugin component available, I rarely use Episode aside from creating WEBM (aka VP8).
In the previous version of Episode, it only supported 25 or 30fps webm encodes. This has since been fixed.
The video settings I use for making WEBm in Episode are:
Thankfully with the advent of ‘smart’ phones in everyone’s hands nowadays, I am no longer compressing video in tiny 3GP old school mpeg wrappers for mobile customers. However, one big thing that I learned while creating compression profiles for ATT Media Mall and Verizon V-Cast back in the day was the appreciation of this constant compromise:
How do I make video look and play good (or good enough) on so many cell phones or newly dubbed ‘devices’?
I thought I might be able to make some other editors and compressionist lives easier by doing a 3 part blog about encoding for today’s web browsers and what I use that works. In the past few months we launched 2 fully capable HTML5 websites – one for Coke Zero’s Tron iPhone game and one for American Express’s new travel service called Nextpedition.
Well, going back to the question “how do i make video look and play good”, the answer now is – Make a lot of compressions and TEST. Don’t just watch them with one setting applied use several and see what is looking best for your edited show. Current HTML5 sites need to supply 3 different video sources, those are:
Enough boring banter, here is how I am currently creating Ogg Theora video to supply my web developers for HTML5 sites.
Compressing Ogg Theora video for HTML5 from Chadwick Shoults on Vimeo.
Another useful tip is if you type in “man ffmpeg2theora” in the terminal, you will pull up the manual which is super helpful for understanding the options available. If you are not so inclined to use terminal, there also is a quicktime component plugin from xiph that also creates usable Ogg video (just not as customizable and quality suffers a little).
