HTML5 Form Fun
There is a lot of fun to be had here, but I am just going to cover the stuff that is relevant now.
Placeholder Attribute
One of the wonderful ways that HTML5 makes life easier is adding the placeholder attribute to input and textarea fields:
<input type="text" placeholder="sender@example.com" /><textarea placeholder="Email body" ></textarea>
Required Attribute
While browsers don't actually respect this, this is a handy semantic way to hook in for your own javascript validation. Like many attributes if the required exists it is considered to be true, if not false.
<input type="text" placeholder="sender@example.com" required /><textarea placeholder="Email body" required ></textarea>
Autofocus Attribute
You could use this, but honestly really? It either doesn't help or confuses regular users, and pisses off your power users. Trust me, your site search probably sucks.
Type Attribute
Finally the type attribute gets a little loving, and how exciting that is:
<input type="text" placeholder="text type"><input type="search" placeholder="search type"><input type="email" placeholder="email type"><input type="url" placeholder="url type"><input type="tel" placeholder="tel type">These may not look different in a desktop browser, but by specifying the proper types, phones will change their keyboard styles to make input easy for the user.
November 20 2010