Simon Willison’s Weblog

Subscribe
Atom feed for html5

83 items tagged “html5”

2014

What are the best free tutorials on HTML5?

Dive Into HTML5 and HTML5 Rocks are both outstanding.

2013

Wrapping block elements in anchor tags? I know this wasn’t valid markup in HTML4 but has this changed or is the only option through JS?

This is a new thing in HTML5: “Block-level” links in HTML5

[... 43 words]

What design techniques does Apple use in the introduction page of iPad Air?

Apple used the same technique on their Apple—Mac Pro page. I first saw this trick used on the BeerCamp at SXSW 2011 page.

[... 91 words]

2012

If I study HTML5, can I avoid having to learn javascript?

Many of the most exciting new features that fall under the term HTML5 only make sense in the context of JavaScript—things like Canvas, Web Workers, AppCache and so on. So no, you can’t learn HTML5 properly without getting familiar with JacaScript.

[... 60 words]

Can you mark items on a website as ’unread’ without cookies?

It’s not very exciting, but CSS will let you set different styles for visited vs unvisited links and the technique has worked reliably since the mid 1990s.

[... 44 words]

2010

Audio Sprites (and fixes for iOS). Remy Sharp on the limitations of HTML5 audio support in iOS.

# 23rd December 2010, 8:04 pm / audio, html5, ios, remysharp, recovered

I think the Web community has spoken, and it’s clear that what it wants is HTML5, JavaScript and JSON. XML isn’t going away but I see it being less and less a Web technology; it won’t be something that you send over the wire on the public Web, but just one of many technologies that are used on the server to manage and generate what you do send over the wire.

James Clark

# 2nd December 2010, 6:48 pm / html5, json, xml, recovered

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 / bugs, html5, pushstate, twitter, webkit, recovered

Is there any consensus yet on link rel=shorturl vs rev=canonical?

It’s pretty clear from the answers that rev=canonical v.s. rel=canonical is way too confusing—so it’s down to rel=shortlink v.s. rel=shorturl.

[... 38 words]

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 / canto, canvas, david-flanagan, html5, javascript, svg, recovered

I’m renaming the book to “Dive Into HTML 5” for better SEO. This is not a joke. The book is the #5 search result for “HTML5” (no space) but #13 for “HTML 5” (with a space). I get 514 visitors a day searching Google for “HTML5” but only 53 visitors a day searching for “HTML 5”.

Mark Pilgrim

# 8th June 2010, 8:48 pm / diveintohtml5, html5, mark-pilgrim, seo, recovered

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 / binary, buffers, felixgeisendorfer, files, html5, javascript, node, nodejs, uploads, recovered

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 / cdrom, html5, ipad, multimedia, wired, recovered

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 / audio, html5, ipad, svg, zombo, zombocom, recovered

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 / firefox4, gecko, henrisivonen, html5, mathml, parser, svg, recovered

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 / css, html, html5, latex, scribd, recovered

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 / css, css3, html, html5, scribd, webfonts, recovered

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 / animation, css, css3, html5, javascript, jquery, webkitanimation, recovered

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 / html5, video, seanchristmann, canvas

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 / ipad, iphone, fxg, html5, canvas, illustrator, flash, adobe

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 / theora, h264, video, audio, html5, mark-pilgrim

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 / svg, css3, ie9, ie, microsoft, canvas, html5

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 / svg, canvas, html5, ie, ie9, microsoft

Some questions about the “blocking” of HTML5

Some background reading. I was planning to fill in answers as they arrive, but I screwed up the moderation of the comments and got flooded with detailed responses—I strongly recommend reading the comments.

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, simon-st-laurent, adobe, w3c, whatwg

No part of HTML5 is, or was ever, "blocked" in the W3C HTML Working Group -- not HTML5, not Canvas 2D Graphics, not Microdata, not Video -- not by me, not by Adobe. Neither Adobe nor I oppose, are fighting, are trying to stop, slow down, hinder, oppose, or harm HTML5, Canvas 2D Graphics, Microdata, video in HTML, or any of the other significant features in HTML5. Claims otherwise are false. Any other disclaimers needed?

Larry Masinter

# 15th February 2010, 9:31 pm / adobe, html5, canvas, larry-masinter, w3c

At this point all I could honestly tell you from the point of view of the editor of several of the HTML5 documents being held up is that the W3C have said they're won't publish without the objections being resolved, and that the objection is from Adobe. I can't even tell what I could do to resolve the objection. It seems to be entirely a process-based objection.

Ian Hickson

# 15th February 2010, 7:38 pm / ian-hickson, adobe, hixie, html5, w3c, canvas, process

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 / html5, video, niallkennedy, flash