#52WeeksOfCode Week 16 – HTML 5

Week: 16

Language: HTML 5

IDE(s): TextWrangler


Technically, HTML isn’t a programming language but a markup language. But version 5 has some interesting features so I’m learning something here.

Boy, did I wade into a crap storm.

It’s been quite a while since I’ve poked around with HTML and I was interested in the multimedia support that was being built into the HTML 5 specification. Like a lot of us, I’ve had to struggle with browser plug-ins like Flash, Silverlight and once even RealPlayer.  All just to watch a video or play an animation or listen to a sound file.

That’s just for a desktop computer, by the way. Once you get into mobile devices, it gets even worse. Either the plug-ins aren’t available (and you are blocked from whole chunks of the Internet) or they chew up your battery life like crazy.

But what if we didn’t have to deal with that? What if we could just play this stuff in our browsers with no extra software required? That’s one of the problems that HTML 5 was designed to solve and that’s also how the W3C ran into a buzz saw of nerd rage.

Let me explain. Every Web browser has something called a DOM or Document Object Model. You can think of it as an abstract model of a Web page that, in theory, lets Web developers write code that works across different platforms without having to create different versions for multiple operating systems or browsers.

Please note the phrase ‘in theory’.

A DOM is supposed to be a standard so, of course, every browser vendor came up with their own version. Sure, the basic elements were supported by everybody but they just couldn’t resist putting their own special little features to differentiate themselves from the competition. So before you knew it, Web developers were having to write different code for different platforms.

If you’ve ever gone to a Web page and got a message that you needed a different browser or if the same page doesn’t work the same way in two different browsers (if it works in either), then you know exactly what I’m talking about.

ANYWAY, it’s gotten better. Kind of.

The W3C created a new DOM element for HTML 5, called HTMLMediaElement, which gives the DOM the ability to present content like audio and video which would have previously required a plug-in.

But the advantage of the plug-ins (for content providers, anyway) was that they allowed restrictions on how that content was consumed using DRM or Digital Rights Management.

Now nerds (and other people — I count myself as a nerd) are not big fans of DRM. “Information wants to be free” and all that. People who create content (or just own it) occasionally want to get paid.

So when the W3C came out with something called Encrypted Media Extensions (EME) that extend the functionality of HTMLMediaElement to play protected content, a large portion of the nerd universe exploded in white-hot rage-gasm. (Remember, I’m a nerd. I can use that word.)

The Free Culture Foundation posted an indignant online editorial entitled “Don’t let the myths fool you: the W3C’s plan for DRM in HTML5 is a betrayal to all Web users.”

(I left the emphasis in to portray just how irritated they were.)

Let’s take a look at the relevant part of the documentation:

This specification does not define a content protection or Digital Rights Management system. Rather, it defines a common API that may be used to discover, select and interact with such systems as well as with simpler content encryption systems. Implementation of Digital Rights Management is not required for compliance with this specification: only the simple clear key system is required to be implemented as a common baseline.

The common API supports a simple set of content encryption capabilities, leaving application functions such as authentication and authorization to page authors. This is achieved by requiring content protection system-specific messaging to be mediated by the page rather than assuming out-of-band communication between the encryption system and a license or other server.

Now I’m just a Simple Country Lawyer, but it seems like this is saying that while DRM is not built in to HTML 5, EME is designed to let content providers still use DRM.

So if you were looking to get rid of browser plug-ins, then good news for you. If you were looking to get rid of protected content on the Web, you’re out of luck.


I used MAMP for my Web server and built a quick and dirty little Web page that includes an audio file. HTML 5 makes this much easier than it once was, since you can let the Web server and browser figure out between themselves how to present the content. Here’s the code:

<!DOCTYPE html>
<title>52 Weeks of Code - Week 16 - HTML 5</title>
<meta charset="utf-8">
<meta name="description" content="The head tag contains the title and meta tags - important to the search engines, and information for the browser to properly display the page.">
<p>My first HTML 5 webpage</p>
<p>Here is the sound of someone saying 'hello'<p>
<p>Just click on the play control.<p>

<audio controls src="sounds/hello.mp3">
<p>It's very easy to embed sounds in HTML 5. Just use the code:<p>
<pre><audio controls src="hello.mp3">

I snagged the sound file from here. Here’s what it looks like in Google Chrome:



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s