See the full issue archive.

Subscribe to HTML5 Weekly here.

HTML5 Weekly

Issue #43 - June 28, 2012

Welcome to issue 43 of HTML5 Weekly. I was travelling yesterday and thought you'd prefer the newsletter at the right hour, rather than in the middle of the night ;-) Back to normal next week! - Peter.

News and Latest Developments

Chrome 20 is now out on the 'stable' channel. No major new features, but Linux users now get the latest version of Adobe's Flash player, even on 64 bit systems, all thanks to Chrome's new cross platform plugin API.
The newest version of Android, Jelly Bean, is making Google Chrome its new default Web browser.

Reading

Smashing Magazine presents a screenshot-heavy roundup of about 80 interesting JavaScript and CSS driven Web design and developments techniques from the past year. We've featured many in the newsletter already but there's still a lot of cool stuff to see here.
Google's Mike West looks at a 'promising new defense' against XSS (Cross-site Scripting) attacks in modern browsers: Content Security Policy (CSP).
Google's Ilya Grigorik shows off an interesting Chrome feature: built-in support for SSL-based proxies which, using SSL's Next Protocol Negotiation extension, can also tunnel SPDY requests.
The first in a multi-part series about building an 80's OutRun style racing game using JavaScript and HTML5 Canvas.
Wooga, a social game developer, has open sourced an entire HTML5 game: 'Pocket Island.' They also explain how they think HTML5 isn't quite ready for prime time yet, while encouraging the HTML5 community to play with their code.
The proposed CSS 'Exclusions and Shapes' module will enable wrapping content around an exclusion shape or to flow inline content within a shape. This article looks at a subset of the exclusion layout problem: computing the intersection of a horizontal rectangle with an exclusion shape defined by a single complex polygon.
Audun Mathias Oygard of Opera demonstrates how they used Opera's support for WebRTC to build a browser-based 'head tracking' system. It also includes an open source library called 'headtrackr' which you can use. Clever stuff.
A List Apart looks at some of the tools and technologies involved in (e-)book production and shows off some of the CSS3 techniques you can use to replicate various features and effects.
Some cute tricks using clever applications of CSS selectors to style absolute links different from relative ones, highlight 'empty' links, make external links look different to internal ones, and more.

Watching

A fun talk from the Google I/O event about a multiplayer video game built at Google using HTML5 technologies. A lot to learn here.
In a silent screencast, Girish Sharma, a participant in Google Summer of Code 2012, shows off a new developer tool for Firefox: the Graphical Timeline of Events.

Tools

A free Photoshop plugin for OS X and Windows (CS3 through CS6) that can convert Photoshop layer styles to CSS3.
Search through an entire project for any given CSS selector, an ideal way to quickly see which documents a CSS style change could affect.
Make writing media queries in Sass super simple. Create a variable using a simplified syntax based on most commonly used media queries then call it using the breakpoint mixin. I'm not too sure but it's an interesting idea.

Jobs

You are an awesome HTML5/CSS/Javascript guru with a serious passion for the mobile web. You'll be working on getting the super-crispy version of soundcloud.com to run in the browser and on any modern smartphone.
The new Amazon development centre in central London is hiring talented developers to deliver scalable and maintainable applications for TVs and consoles.

Demos

A fun open source face detection demo using JavaScript and getUserMedia. It worked for me in Chrome 20 just by activating a single beta feature. (Yes, that's me in the screenshot here.)
Parents couldn't afford all the Lego pieces you wanted as a kid? Live the childhood of your dreams with this experiment from Google and Lego Australia to build the 'largest Lego set ever' online in your browser. It leans heavily on WebGL and other browser technologies.
Steganography is the technique behind hiding messages in otherwise ordinary looking content. This demo (complete with explanatory article) does just that using JavaScript, FileReader, and Canvas on images you supply.
As a synth fan, I love this little demo. Complete with knobs and switches to customize the sound to your taste. (Requires Web Audio API support, so Chrome 16+)

Last but not least..

Pinerly is some sort of Pinterest-focused marketing tool but the interesting bit is its WebGL powered 3D slide deck to promote the company to potential investors. Feels very 'Second Life.'
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