HTML 5.0 Tag Spotlight: <canvas>

For those web developers out there who don't know: HTML 5.0 is under development. I have decided that I will spotlight a tag or a change from 4.x to 5.0 from time to time in this here blog.

Enjoy!

Today's tag is: <canvas>

Available attributes: height, width.

Tag description: Essentially mspaint for your browser. Included with HTML5 is an entire API for writing images on the fly. You can specify shapes and lines, as well as stroke styles and images. You can trigger changes to the shapes with events in your page, including altering opacity, adding or removing images or shapes, or moving the shapes around.

One noted feature of the <canvas> tag is the ability to grab a specific part of an image:



I can also see the <canvas> API as being a quick replacement for much of what Flash does. Because you can make changes at any time to the canvas, it seems that with a bit of scripting, most visual SWFs can be reproduced easily.

At the very least, this tag will find use when a person wants to display some vector graphics. At the very most, we may see entire videos done in a <canvas>.

I'll be interested to see where this tag ends up being used.