All posts tagged ‘HTML5’

File Under: APIs, HTML5, Web Standards

BBC Taps the Past to Showcase the Future of Web Audio

Mixing old school tape loops with the BBC’s Web Audio API demo. Image: Screenshot/Webmonkey

HTML5 offers developers new ways to display and work with both audio and video on the web. The HTML5 <video> element tends to get more attention, but the HTML5 audio element is equally revolutionary, perhaps even more so thanks to the work-in-progress Web Audio API (currently in the draft stages).

Developers at the BBC recently set out to push the limits of what you can do with HTML5 <audio> and the Web Audio API. The result is a new audio playground site that recreates the sounds of the BBC Radiophonic Workshop using the Web Audio API. Note that right now only WebKit browsers support the Web Audio API. (Firefox supports the older, deprecated, Audio Data API, but plans to ship support for Web Audio in 2013.)

The BBC’s Radiophonic Workshop project is one part cool demo, one part tutorial. It’s fun to play around with, sure, but another reason behind the experiment is to document how to use <audio> and the Web Audio API. The developers also wanted to put the API through some real-world use cases, to see if there are any limitations that could be addressed before the Web Audio API becomes an official standard.

Each of the four demos has a thorough code walk-through showing exactly how it works and which elements of the Web Audio API are being used. There are a couple of dependencies, namely JQuery and Backbone.js, but most of the code is working directly with the Web Audio API.

If you’ve ever wanted to explore the Web Audio API, these demos make a great introduction to how everything works. For more background on the project, see the BBC’s Research and Development blog.

So far the code doesn’t seem to be available through the BBC’s R&D GitHub account. You can always copy and paste from the demo site, but it would be nice if it was available for easy forking and experimentation.

File Under: HTML5, Web Standards

Mozilla Busts HTML5 Myths

Image: Christian Heilmann/Flickr

Mozilla has jumped into the shark-infested debate about whether or not HTML5 can compete with platform native apps. Chris Heilmann, Mozilla’s Principal Evangelist for HTML5, has a new post on the Mozilla Hacks blog that challenges many “false assumptions” about HTML5.

Heilmann’s post is not so much about which you ought to use for your next app — right now that depends on what you’re building — rather it attempts to clear the air about just what HTML5 actually can and cannot do.

Among the things Heilmann covers are the myths that HTML5 has performance problems, that it can’t work offline and that developers can’t make money building HTML5 apps.

Along the way Heilmann also acknowledges where platform-native apps have the lead, namely, access to device APIs. It’s not a shortcoming of HTML5 that iOS and Android both prevent web apps from accessing many APIs native apps can use, but it is a practical reality that keeps many developers building native apps for the time being. As Heilmann writes, “in essence HTML5 is a Formula 1 car that has to drive on a dirt road whilst dragging a lot of extra payload given to it by the operating system without a chance to work around that — for now.”

The qualifier, “for now,” is the key part of that analogy. Not only are platforms slowly adding more HTML5 support to their native browsers, we’ve also seen increased support for accessing device capabilities — like GPS or the camera — through web apps. And of course Mozilla is building its own mobile OS which will consist exclusively of HTML5 apps.

It may be some time before app developers start favoring the web over platform-specific apps, but as Heilmann points out this is hardly the first time the web has taken over from a closed system: “historically, closed platforms came and went and the web is still going strong.”

File Under: Browsers, HTML5, Multimedia

Mozilla Plans H.264 Video for Desktop Firefox

Mozilla is getting closer to making H.264 video work in Firefox.

The company’s recently released Firefox for Android already bakes in OS-level support for the H.264 video codec and now Mozilla is adding support to desktop Firefox as well.

Mozilla long opposed supporting the H.264 codec because it’s patent-encumbered and requires licensing fees. It’s also the most popular codec for HTML5 video on the web, which drove Mozilla to swallow its ideals and get practical about adding support to Firefox. Instead of including the codec directly in Firefox, the browser will rely on OS-level tools to play H.264 video.

There’s still no support for H.264 in the current desktop version of Firefox, but as Mozilla CTO, Brendan Eich recently noted on his blog, work is under way and, with the exception of Windows XP, all platforms will get OS-native codec support for H.264 video. Windows XP, which lacks OS-level tools for H.264, will continue to use the Flash plugin to play H.264 movies.

If you’d like to keep track of Mozilla’s progress adding H.264 to the desktop there’s a tracking bug that follows solutions for all the major desktop platforms. Eich does not give an explicit timeline or any hint of when H.264 support might ship with Firefox on the desktop.

The HTML5 video element was supposed to offer a standards-based way to play movies on the web without proprietary plugins like Flash or Silverlight. Unfortunately that dream has failed to pan out. Instead of proprietary plugins, the web ended up with proprietary video codecs, which has created a split in browser support for HTML5 video. Firefox and Opera support the open Ogg and WebM codecs, while Safari and Internet Explorer supported H.264.

Mozilla (and Opera) were against the adoption of H.264 on ideological grounds — H.264 is not an open codec and requires that companies using it pay royalties. But earlier this year the company partially reversed course and said it would support H.264 on devices where the codec is supplied by the platform or implemented in hardware.

In announcing its change of heart with regard to H.264, Eich wrote, “H.264 is absolutely required right now to compete on mobile. I do not believe that we can reject H.264 content in Firefox on Android or in B2G and survive the shift to mobile…. Failure on mobile is too likely to consign Mozilla to decline and irrelevance.”

However, while Mozilla may have abandoned the fight against H.264 in HTML5 video, it has taken up the same banner when it comes to WebRTC. WebRTC is a group of proposed standards that will eventually make web apps capable of many of the same feats that currently require platform-native APIs. In his recent post detailing the progress of H.264 support, Eich says that Mozilla is still focused on “the fight for unencumbered formats” for WebRTC, and promises “more on that front later”.

File Under: HTML5, Web Standards

W3C Unveils Plan to Finish HTML5 in 2014

Image: Screenshot/Webmonkey.

Like the Cylons, HTML5 was created by man. It rebelled. It evolved. It looks and feels like HTML. And now, it has a plan.

Namely, to be done in 2014.

The W3C has formalized its plan to move the HTML5 spec to the official “Candidate Recommendation” status by the end of 2014. That might seem like a long time from now, especially if, like most of us, you’ve been using the bulk of HTML5 for some time, but 2014 is quite a bit better than the 2022 date that used to be tossed around.

But there’s a catch. In order to get HTML5 to the Candidate Recommendation stage on time the W3C is going to move some less stable parts of the spec to the newly designated HTML 5.1.

HTML5 has already been “modularized” over the years, spinning off sections like Web Workers, WebSockets, Microdata and half a dozen others, which are all now separate specifications at the W3C.

Now the W3C plans to split the remaining chunk of HTML 5.0 into HTML 5.0 and HTML 5.1. Each spec will then move through the process of becoming an official web standard. Here’s the W3C HTML Working Group’s plan for HTML5:

  • we determine which features are likely to meet the “Public Permissive” CR exit criteria,
  • we create a “stable HTML5.0″ draft which includes just those “stable” features, and which omits the remaining “unstable” features
  • we create an HTML 5.1 editor’s draft which is a superset of the stable HTML5.0 but with the “unstable” features included instead of omitted, and also with any new proposed features included

The HTML WG would then rinse and repeat with HTML5.1 in 2016. And then HTML5.2 and so on. The result will hopefully be a faster evolving series of specs, which in turn means more features reach the Recommendation stage in less time.

For web developers in the trenches finalizing HTML5 might seem irrelevant — after all, browsers already support most of it so who really cares? There are two reasons reaching the Candidate Recommendation stage matters: It usually means improved cross-browser support and it always means that the spec is covered by the all important W3C patent policy, which ensures that HTML5 remains a royalty-free standard.

For a complete list of everything that’s “unstable” in the current draft of HTML5, as well as the plan for how to handle it, be sure to read through the W3C’s plan.

File Under: HTML5, Multimedia

Microsoft, Atari Bring Arcade Classics to the Web

Centipede in HTML on the iPad. Image:Screenshot/Webmonkey

Microsoft’s Internet Explorer team has partnered with Atari to re-imagine classic Atari games for the modern web. That’s right, Centipede, Asteroids, Missile Command and half a dozen more all re-written using HTML5 and JavaScript.

If you’d like to play, point your browser to the new Atari Arcade and enjoy the glory of Pong, Super Breakout and the rest of the Atari back catalog.

While the games look a bit different — the graphics aren’t exactly what you might remember from the arcades of your youth, hence the “re-imagining” — the game play is faithful to the originals, especially on a touch screen where the controls are more like the classic arcade button layouts.

For those curious to know how it all works, the answer is largely CreateJS, though for full details be sure to read through the developer documentation. You can even create your own HTML5 Game on top of the new Atari Arcade SDK.

For more details on how it all works check out the video below featuring developer Grant Skinner and the rest of the team behind Atari Arcade.