HTML5 in the Web browser: HTML5 forms

The newest specs for HTML forms give programmers more control over data input and validation, while offloading much of the work to the browsers

1 2 Page 3

The meter tag is a bit more interesting because it includes the opportunity to specify a low and high attribute, as well as a min and max. Presumably a value between min and low or high and max is undesirable and the user should try to push whatever buttons are necessary to push this value between low and high.

HTML5 forms and editable content
All of the work that's been done on the forms is quite nice, but the irony is that the form tag itself is sort of passe. The greatest change in the form tag may be the fact that it's no longer necessary. Now most HTML elements can be edited by simply adding the attribute contenteditable="true" to any old div or span. It's pretty freaky. If the user doesn't like what you write on your blog, you can give them the opportunity to rewrite it to fit their preconceived notions. In essence, any table or pile of data could be turned into a form just waiting for the user to click and change. Everything can be wikified.

This section of the API is changing a bit. Just recently, the getSelection method was moved, changing the best way to capture any of the editing process. Is getSelection ideal? Nope. Is it dangerous? Perhaps in the wrong hands. Will it be confusing to old users who still think that they can only monkey with data in the form boxes? Certainly. Will it encourage more traffic when people save entire pages just to store one tweak? No doubt. But editable content opens up more possibilities than ever. I'm sure that creative Web designers will find clever ways to make everything a form that comes alive.

Note: This is the fourth article in a series devoted to the new features of HTML5. The first article, "HTML5 in the browser: Canvas, video, audio, and graphics," examined display options, including the <canvas> and <video> tags, Scalable Vector Graphics, and WebGL. The second article, "HTML5 in the browser: Local data storage," examined Web Storage, Web Database, and other APIs designed to transform Web pages into local applications. The third article, "HTML5 in the browser: HTML5 data communications," examined cross-document messaging, WebSockets, and other HTML5 APIs that improve website and browser interactivity.

This story, "HTML5 in the browser: HTML5 forms," was originally published at Follow the latest news in application development and HTML5 at For the latest business technology news, follow on Twitter.

Copyright © 2011 IDG Communications, Inc.

1 2 Page 3