Simon Willison’s Weblog

Audio Sprites (and fixes for iOS). Remy Sharp on the limitations of HTML5 audio support in iOS. # 23rd December 2010, 8:04 pm

WebKit is Dropping HTML5 “popstate” Events (via) Really nasty bug with WebKit’s pushState support, discovered by Ben Cherry from Twitter. popState events get dropped if the user navigates while an outbound network request is in progress. # 30th October 2010, 7:41 am

An implausibly illustrated introduction to HTML5 Web Workers. By Mark Pilgrim. # 15th August 2010, 11:14 pm

canto.js: An Improved HTML5 Canvas API (via) Improved is an understatement: canto adds jQuery-style method chaining, the ability to multiple coordinates to e.g. lineTo at once, relative coordinate methods (regular Canvas does everything in terms of absolute coordinates), the ability to use degrees instead of radians, a rounded corner shortcut, a more convenient .revert() method and a simple parser that can understand SVG path expressions! The only catch: it uses getters and setters so won’t work in IE. # 29th July 2010, 9:39 am

Parsing file uploads at 500 mb/s with node.js. Handling file uploads is a real sweet spot for Node.js, especially now it has a high performance Buffer API for dealing with binary chunks of data. Felix Geisendörfer has released a new library called “formidable” which makes receiving file uploads (including HTML5 multiple uploads) easy, and uses some clever algorithmic tricks to dramatically speed up the processing of multipart data. # 2nd June 2010, 3:57 pm

Is This Really The Future of Magazines or Why Didn’t They Just Use HTML 5? A scathing critique of the new Wired iPad app, which weighs in at 500MB per issue due to storing every single page as two static PNG images—one for landscape and one for portrait mode. “The only real differentiation between the Wired application and a multimedia CD-ROM is the delivery mechanism: you download it via the App Store versus buying a CD-ROM”. # 28th May 2010, 12:13 pm

ZOMBO.com in HTML5. Uses SVG (scripted by JavaScript) and the audio element. Finally, Zombo.com comes to the iPad. # 20th May 2010, 3:26 pm

The All-In-One Almost-Alphabetical No-Bullshit Guide to Detecting Everything. Appendix A of Dive Into HTML5. # 14th May 2010, 2:17 pm

Firefox 4: the HTML5 parser—inline SVG, speed and more. A complete replacement for the oldest part of Gecko (the HTML parser dates back to 1998) headed up by HTML5 validator author Henri Sivonen, using the parsing algorithm defined in the HTML5 specification. Improvements include parsing taking place off the main UI thread and the ability to embed SVG and MathML directly inline in HTML pages. # 12th May 2010, 8:56 am

Paper 5 | Scribd (via) A more impressive example of Scribd’s new HTML/CSS document viewer: a mathematics-heavy LaTeX paper by one of Scribd’s engineers. # 7th May 2010, 12:12 pm

Scribd in HTML5. Outstanding piece of engineering work from Scribd—they can now render documents using HTML, webfonts and a ton of CSS absolute positioning (using ems rather than pixels) instead of Flash. Nothing to do with HTML5 of course, which is rapidly replacing Ajax as the most mis-applied terminology on the Web. That nit-pick feels pretty insignificant compared to their overall achievement though—being able to convert any formatted document (.doc, pdf etc) in to HTML and CSS that displays correctly is a real leap forward. # 7th May 2010, 12:09 pm

Pure CSS3 Spiderman Cartoon w/ jQuery and HTML5. Great demo, though calling -webkit-animation HTML5 (or even CSS3) is a bit of a stretch... # 4th May 2010, 7:27 pm

Blowing up HTML5 video and mapping it into 3D space. The canvas drawImage() method can take an HTML video element as its source, making all kinds of interesting effects possible. The author notes that performance was dramatically improved by copying the video frame in to a separate canvas element and then copying regions out of that element rather than grabbing regions from the video directly. # 21st April 2010, 9:30 am

Flash CS5 will export to HTML5 Canvas. This looks pretty awesome—Illustrator CS5 and Flash CS5 can export to a new “FXG” format, and Adobe are providing a JavaScript library to load that format via Ajax and render the contents (including Flash animations) in a canvas element. Could be great for displaying newspaper infographics on the iPad. # 11th April 2010, 6:33 pm

Video on the Web—Dive Into HTML5. Everything a web developer needs to know about video containers, video codecs, adio containers, audio codecs, h.264, theora, vorbis, licensing, encoding, batch encoding and the html5 video element. # 24th March 2010, 12:50 am

Internet Explorer Platform Preview Guide for Developers (via) Lots of SVG and CSS3 stuff, no mention of canvas here either though. # 16th March 2010, 6:36 pm

An Early Look At IE9 for Developers (via) Surprisingly, no mention of SVG or canvas and only a note in passing about HTML 5. # 16th March 2010, 6:11 pm

The Widening HTML5 Chasm. Simon St. Laurent’s commentary on the HTML5/Adobe situation. The most interesting piece I’ve read on it so far. # 15th February 2010, 9:51 pm

HTML5 video markup, compatibility and playback. Everything you need to know about embedding HTML5 video on a page, complete with multiple codecs to cover the various supporting browsers and a fallback to Flash. # 11th February 2010, 5:49 pm

Plupload (via) Fantastic new open source project from the team behind TinyMCE. Plupload offers a cross-browser JavaScript File uploading API that handles multiple file uploads, client-side progress meters, type filtering and even client-side image resizing and drag-and-drop from the desktop. It achieves all of this by providing backends for Flash, Silverlight, Google Gears, HTML5 and Browserplus and picking the most capable available option. # 10th February 2010, 12:53 pm

Lou’s Pseudo 3d Page. Spectacularly detailed exploration of the road graphics used in racing games prior to true 3D. This is a potential gold mine for anyone looking for a fun project to try out with canvas. Bonus points for comet integration—I’m still looking forward to the first real-time multiplayer game in the browser using comet and canvas. # 8th February 2010, 11:21 am

svg-edit. Click the “Try out SVG-edit 2.4” link—this is an impressive, full featured open source vector graphics editor that runs in the browser. # 7th February 2010, 10:30 am

SublimeVideo—HTML5 Video Player. Still a fair way to go (no Firefox support yet, and they plan to add a Flash fallback for IE) but in Safari this is pretty extraordinary. Smooth video, beautiful UI, full window mode and full screen mode in the latest WebKit nightlies. I’d go as far as saying that this is the nicest online video implementation I’ve seen (at least on the Mac). # 2nd February 2010, 9:50 am

HTML 5 audio player demo. Scott Andrew’s experiments with the HTML5 audio element (and jQuery)—straight forward and works a treat in Safari, but Firefox doesn’t support MP3. Presumably it’s not too hard to set up a fallback for Ogg. # 1st February 2010, 9:58 am

Real time online activity monitor example with node.js and WebSocket. A neat exploration of Node.js—first hooking a “tail -f” process up to an HTTP push stream, then combining that with HTML 5 WebSockets to achieve reliable streaming. # 8th December 2009, 11:07 pm

Dive Into HTML 5. Mark Pilgrim’s free online book on HTML 5—currently just one chapter on canvas (which neatly illustrates the coordinate system using a diagram rendered using canvas itself) but certain to become an invaluable resource for anyone looking to take advantage of HTML 5. # 20th August 2009, 2:40 pm

On HTML 5 Drag and Drop. Francisco Tolmasky investigated HTML 5 drag and drop, which allows web apps to implement drag and drop between windows and between the browser and the desktop. He found a number of problems with the spec and proposes detailed solutions. # 17th August 2009, 12:31 pm

HTML 5 Parsing. Firefox nightlies include a new parser that implements the HTML5 parsing algorithm (disabled by default), which uses C++ code automatically generated from Henri Sivonen’s Java parser first used in the HTML5 validator. # 11th July 2009, 11:36 pm

In defense of web developers. Zeldman: “The social benefit of rethinking markup sealed the deal. XHTML’s introduction in 2000, and its emphasis on rules of construction, gave web standards evangelists like me a platform on which to hook a program of semantic markup replacing the bloated and unsustainable tag soup of the day.” # 7th July 2009, 3:52 pm

An Unnofficial Q&A about the Discontinuation of the XHTML2 WG. By Henri Sivonen. # 6th July 2009, 12:27 pm