HTML and CSS Reference
In-Depth Information
Other Libraries, Utilities, and Toys
I covered a couple of video and audio encoding tools in Chapter 1 , but didn't cover one that
actually works in your Firefox browser: Fireogg. Fireogg is a Firefox extension that can take
your H.264 video and create a Ogg video. Not only does it encode, but you can tweak the size
and quality of the resulting encoded video. Access FireOgg with your Firefox browser at ht-
tp://firefogg.org/ .
When Google made its announcement that it would no longer support H.264 (MP4) videos,
Microsoft created an extension to enable Chrome to play H.264 videos. You can access the
extension at http://www.interoperabilitybridges.com/wmp-extension-for-chrome .
The riffwave.js library is an interesting little beastie. It encodes audio data into a format (PCM
inside a RIFF container) that can be played in an HTML5 audio element. It doesn't generate a
sound file, but a data URI that you then pass to a new HTML5 audio element:
var wave = new RIFFWAVE(data); // create the wave file
var audio = new Audio(wave.dataURI); // create the HTML5 audio element
audio.play();
A data URI is a encoded text string that allows us to include image or other data in-line.
Download the riffwave.js library at http://www.codebase.es/riffwave/ .
Patternsketch is an online audio sequencer and drum machine that you can use to create audio
patterns that you can then download as a WAV, OGG, or MP3 file. Create your audio pattern
using Patternsketch at http://patternsketch.com/ .
You can also upload your Patternsketch audio file to Sound Cloud, an online cloud service
that allows you to create, store, and share your sound files. Sound Cloud can be accessed at
http://soundcloud.com .
Moving from the HTML5 media elements—specifically, to HTML5 in general—the Modern-
izer library is a way of ensuring that your HTML5 applications work equally well in all
browsers (or, at a minimum, degrades without major breakage). You can find Modernizer at
http://modernizr.com/ .
If you want to know which browsers support what HTML5 features, the HTML5 Test site lets
you know how your browser compares, at http://html5test.com/ . You can also find out when
you can use one HTML5 feature or another at When Can I Use… (at http://caniuse.com/ ) .
Search WWH ::




Custom Search