HTML and CSS Reference
In-Depth Information
Hit Testing Proposal
The“subdom”conceptcanquicklybecomeunwieldyforanyonewhohastriedtodoanything
more intricate than a simple Canvas animation. Why? Because associating fallback elements
withCanvasinteractionisnotalwaysaneasytask,anditiscomplicatedbyscreenreadersthat
need to know the exact position of an element on the Canvas so that they can interpret it.
To help solve this issue, the Canvas needs some way to associate sub dom elements with an
area on the bitmapped Canvas. The new
W3C Canvas Hit Testing proposal
outlines why this
type of functionality should be added to the Canvas specification:
In the current HTML5 specification, authors are advised to create a fallback DOM under the
canvas element to enable screen readers to interact with canvas user interfaces. The size and
position of those elements are not defined, which causes problems for accessibility tools—for ex-
ample, what size/position should they report for these elements?
Because canvas elements usually respond to user input, it seems prudent to solve the hit testing
and accessibility issues with the same mechanism.
So what kind of mechanism are they suggesting?
The idea appears to be to create two new methods,
setElementPath(element)
and
clearElementPath(element)
, that will allow programmers to define (and delete) an area of
the Canvas to use as a hit area, provided that it is associated with the fallback DOM element
of the Canvas. It appears that you must have an accessible fallback DOM element to provide
to
setElementPath()
in order to associate it for the hit detection. When a hit is detected, an
event is fired, and all is right in the world.
So what does this mean for developers?
Foruserinterfaceswithstationaryinterfaces,itwillmakethingsaloteasier.Howmanytimes
have you wanted to create a simple way to click buttons on a game interface but had to use
the same hit detection routines youwrote foryourin-game sprite interactions? (Forus? Every
time.) However, for moving sprites in your game, it might be less useful. You will have to
update the
setElementPath()
method and the fallback DOM element with new coordinate
data every time something moves, which means triple overhead for a game that is probably
not accessible in the first place.
Still, this is a good move by the W3C, because making the Canvas accessible for user inter-
faces is another huge step in making it more widely accepted for web applications. We hope
these two new methods are added to the specification as soon as possible. The good news is,
as of December 2012, the “Hit Testing Proposal” has been incorporated into the specification
for the next version of Canvas, dubbed Canvas Level-2.
