A Blog Not Limited

to web design, standards & semantics

HTML5 <audio> without all the <video>

Oct 12, 2011

Published in

Script Junkie

As you may have heard, I was lucky to be asked to contribute a few chapters to the HTML5 Cookbook (early release eBook now available). One of the chapters I wrote was on HTML5 <audio>, and as I did my research for the chapter I noticed the vast majority of articles and books "covering" <audio> are actually focused on <video>.

It's understandable, really, since the two new media elements share most of the same attributes, syntax and implementation strategies. But it is also fucking frustrating, because <video> isn't <audio>. There are differences. Differences that can't and shouldn't be covered with a blanket statement like "see <video> information".

<audio> deserves it's own examples and explanations. It deserves it's own dedicated chapter (buy the HTML5 Cookbook). It deserves it's own in-depth article …

Putting It All Together for Script Junkie

Thanks to my fine friends over at Script Junkie, I had a chance to write the kind of article I wanted when I was doing research.

Native Audio with HTML5 starts with the very basics of <audio>: syntax, attributes, browser support and the like. And it's all about <audio> with actual <audio> code examples.

I also write about the really annoying shit with <audio>: file formats, codecs and MIME types … the kind of stuff I just couldn't find enough <audio>-specific information about when I first started my adventures with HTML5 media. And, finally, I talk about fallbacks (yes, that means I mention Flash).

It's all the core information you need about <audio> in one place. Have a read and let me know what you think!

And if you are looking for more than <audio> basics — like custom controls and visualizing audio with JavaScript — buy the HTML5 Cookbook.

HTML5 Cookbook

Interested in HTML5?
Get the Cookbook!

I was a contributing author for HTML5 Cookbook, available for sale on Amazon! Get yours now! (I hear chapters 1, 4 and 5 are particularly good.)

P.S. Don't forget my book Microformats Made Simple is still for sale!


Share the Love

Commenting is not available in this channel entry.

The Coolest Person I Know

Emily Lewis

Yeah, that would be me: .

I'm a freelance web designer of the standardista variety, which means I get excited about things like valid POSH, microformats and accessibility. I ply my trade from my one-person design studio in Albuquerque, New Mexico 87106 USA.

A Blog Not Limited is my personal blog where I pontificate about web design, web standards, semantics and whatever else strikes my fancy. Head on over to Emily Lewis Design if you'd like to see my work or, even better, hire me.


I Tweet, Therefore I Am

Follow @emilylewis on Twitter!