HTML and CSS Reference
In-Depth Information
O
NLINE
http://htmlref.com/ch2/canvastext.html
<canvas> Conclusions
We have just scratched the surface of the
canvas
API. A full listing of the API can be found
in the reference in Chapter 3. However, a reference is simply that; be warned that the use of
the
canvas
element can get quite involved, and you should not reasonably expect to use it
if you don't have significant JavaScript knowledge. Even if you know JavaScript, there are
challenges ahead because implementations vary between browsers and, for now, Internet
Explorer requires a compatibility library even for basic support. Scripting
canvas
-based
drawings for interactivity is a bit clunky, and text support is far from stellar. Accessibility
concerns also abound. However, don't let the challenges dissuade you; HTML5's
canvas
API is quite powerful and warrants your exploration. The purpose of this section was to
introduce you to the element and show you what is possible to accomplish with it. Consult
the Web for the latest changes in
canvas
support.
HTML5 Form Changes
Besides starting the HTML5 specification, the Web Hypertext Application Technology
Working Group (WHATWG) has been busy over the years considering the future of the
Web and went so far as to develop a specification called Web Forms that aimed to bring
HTML forms into the modern age. The specification added a number of form widgets,
validation facilities, and some accessibility improvements. Few browsers save Opera
implemented any of these features, and some in the industry complained about the
complexity of the specification. However, most of the Web Forms specification has been
incorporated into HTML5 and more and more of its features are now being implemented
in browsers. In this section we take a quick tour of these exciting features but place more of
a focus on what is already being implemented in current browsers.
New Form Field Types
Traditionally, the HTML
input
element is used to define most form fields. The particular
type of form field of interest is defined with the
type
attribute, which is set to
text
,
password
,
hidden
,
checkbox
,
radio
,
submit
,
reset
,
image
, or
button
. HTML5 adds
quite a number of other values, which we will briefly explore here.
First, setting the
type
equal to
color
should create a color picker:
<p><label>color:<input type="color" name="favColor"></label></p>
As of the time of this edition's writing, no implementation existed for this control, but it
might look something like this:
