Embedding Media - HTML5 with CSS3 - page 172

Figure 5-15. The chart on the right is generated in a canvas element, derived from the table on the left
Although the possibilities of canvas are truly exciting, there are a few unfortunate drawbacks. For one
thing, it's entirely reliant on JavaScript, so people who disable JavaScript in their browsers (or are using
browsers that don't support scripting) will be excluded from seeing the canvas . If the browser supports and
recognizes the element but JavaScript is disabled or some other error in the script stops it from running,
the browser will still render the canvas as a blank box, hiding any fallback content within it. It's a good idea
to include some checks in your JavaScript to test for canvas support, and it may even be best to generate
the canvas element itself with JavaScript and insert it into the DOM. That way, without scripting, the
canvas element won't exist at all and the fallback content can appear in its stead.
Anything drawn in a canvas element—including text—exists merely as pixels on screen, not as a true
object in the document. Scripts and applications can read and manipulate the code that draws the pixels,
but remain ignorant of the shapes those pixels represent. Because in- canvas objects aren't part of the
DOM, screen-reading software for the visually impaired has no way to read them, even if the objects are
letters and words. The canvas element is inaccessible for the time being, but a group within the W3C is
working to correct that shortcoming ( w3.org/WAI/PF/html-task-force ). Meanwhile, use canvas
responsibly and consider your audience. Provide usable, meaningful content and interaction first, and
enhance it with canvas when it's appropriate.
We've barely scratched the surface of what can be done with the canvas element here,
and there are entire topics dedicated to the subject. If you'd like to learn more, a good
starting point is the canvas tutorial from the Mozilla Developer Network
( https://developer.mozilla.org/en/Canvas_tutorial ).
Required Attributes
The canvas element doesn't require any attributes.