See the full issue archive.

Subscribe to HTML5 Weekly here.

HTML5 Weekly

Issue #19 - January 4, 2012

Welcome to issue 19 of HTML5 Weekly. As I suggested in the last issue, HTML5 Weekly took a little winter break but I'm back and ready for a very strong year for HTML5 and its related technologies in 2012. This is a sector that's only going to continue to grow and it's an exciting time to be involved :-)

News and Latest Developments

Billy Lamberta and Keith Peters present a book that covers everything you need to know about creating dynamic scripted animations on the HTML5 canvas element. It even digs into the math and physics knowledge you'll need to make things look smooth. At 504 pages, it's no lightweight guide.
Ben Savage, founder of spaceport.io, recently put together a list of HTML5 related predictions for TechCrunch. He expects a major console game to be ported to WebGL, HTML5 ads to overtake Flash ads, and for mobile Safari's HTML5 sound support to remain broken.
The 'Shadow DOM' refers to DOM element subtrees that can be rendered within a document but aren't accessible through the document's own DOM tree. This living draft presents a specification for the concept and how Shadow DOM structures can be manipulated.
Mozilla has unveiled a new Firefox beta that includes some all new development tools including page and style inspectors and the Orion code editor, along with anti-aliasing for WebGL contexts.
As part of its iOS SDK, appMobi has open sourced 'directCanvas', an attempt at solving the common performance problems of using HTML5 canvas elements on iOS devices. They say it's coming to Android too in early 2012.

Articles and Tutorials

Over at Smashing Coding, Opera's Divya Manian takes a look at how CSS will be supporting (or is beginning to support) paged media, columns, regions, exclusions, grids, and the flexbox.
Angry Birds is a popular game ported to HTML5 from the iOS platform (you may have seen it relentlessly promoted in Chrome) and in this hour long presentation Google's Joel Webber explains how Google helped with the port.
A tutorial on creating some simple interactive operations on the HTML5 Canvas element by Simon Sarris.
An interesting overview of some of the concepts and research involved with producing a MineCraft style game using JavaScript and WebGL. (Check out this issue's "Demos" section for another such attempt.)

Tools

A list post featuring some handy HTML5 powered tools, including a CSS sprite generator, a font testing tool, a pattern generator, and an SVG to HTML5 Canvas converter.
Ever seen the 'Prezi' presentation tool where presentations are on a giant canvas that you spin and navigate around? Impress.js brings a similar concept to the world of HTML-based slideshows.

Code and Libraries

filer.js is a fully-tested wrapper for the HTML5 Filesystem API which gives you access to a sandboxed filesystem from JavaScript. It uses familiar UNIX commands in its API (e.g. cp, mv, ls).
They sum it up best: "A jQuery plugin which enables HTML5 placeholder behavior for browsers that aren’t trying hard enough yet."
syze is a library for JavaScript that lets you easily target your designs by device or browser sizes. syze makes designing for desktops, televisions, tablets, and mobile devices simultaneously as easy as CSS.
Use this bookmarklet to get an idea of what your site will look like on older browsers that don't support CSS3.

Demos

It's clunky and laggy but nonetheless an amazing WebGL demo of a MineCraft style game entirely in the browser, complete with multiplayer. WebGL support definitely required here :-)
An interesting demo of an iPhone 4 rendered using CSS3 with no images or canvas work. Looks great in Chrome, Firefox and Safari, not so much in IE, alas.
WebKit has begun to implement the CSS Filter Effects 1.0 specification which provide a way to influence an element's rendering before it's displayed in its parent document.

Last but not least..

Dabblet is a new 'interactive playground' for quickly testing snippets of CSS and HTML code. Unlike JSFiddle or JSBin, it's very CSS and design oriented, includes handy keyboard shortcuts, can save to GitHub gists, and takes care of browser specific CSS prefixes for you (so you can just use the proper standards-defined ones instead).
HTML5 Weekly is published by Cooper Press. Our other newsletters include JavaScript Weekly and Ruby Weekly. Reading this as a non-subscriber? Click here to subscribe to HTML5 Weekly.

You opted in to HTML5 Weekly at HTML5Weekly.com to get weekly e-mails about HTML 5 and related browser technologies.

Unsubscribe | Change your e-mail address.

Street address: Office 30, Lincoln Way, Fairfield Enterprise Centre, Louth, Lincs, UK, LN11 9EJ