30 April 2011

Interactive graphics and HTML5

The promise of graphics that can change on the fly as users adjust them or enter data is delightfully web-appropriate.  People do it, but it's not excessively common-place for the same age-old reasons of browser incompatibility and scripting required.  The famous HTML5 "canvas" tag aims to allow browsers to handle interactive graphics natively.  Nice!  But what about Scaleable Vector Graphics? With all the advantages of XML, why didn't SVG ever get people excited?  The HTML5 team have chosen Canvas+JavaScript over SVG to manage changeable graphics.  But browser support is about the same between the two, so if you really want a pretty dynamic chart that changes when your users play with it, which should you use today?

Head to the excellent SitePoint article "SVG or Canvas" - How to choose the right format" for some elucidation on what the differences are.

For a more complete primer on HTML5 that is just the right length, and very entertaining (no really), I highly recommend HTML5 for Web Designers by Jeremy Keith.