By Jeremy Lindblom
On July 7th, 2008
HTML 5 is coming our way. So goes the theory, anyway. (Recent chatter puts widespread adoption by user agents at close to a decade out from now… or more.) It is still a moment that many of us are eagerly anticipating. I remember drooling over my keyboard while reading through the HTML 5 Specifications the first time. We have been stuck with HTML 4.01/XHTML 1.0 for a long time and it is time to see some changes.
(In fact, HTML 4.01 has presented us with the longest gap in HTML revisions—it’s been 10 years since it was released; HTML 3.2 only lasted about a year, from 1997 to 1998.) There are some great things we have to look forward to that will make life a lot easier for us developers and designers. We’ll take a look at a few of them after the jump.
The spec document is a bit rough to navigate so I’ve put together a few of the more exciting elements for now:
There are a whole slew of cool things that we’ll be seeing with forms: new elements, new attributes, and new and better ways to solve previously tedious problems. There are several new input types that will increase the semantics of our forms:
datetime, date, month, week, time, number, range, email and
url. In theory, the user agent (browser) itself can actually use these fields to render a calendar object, though an implementation like that would need to be consistent across the browsers to be of any practical use.
<output> element will exist for returning information from scripts. Combo boxes will be created as a combination of
<input> and a (new)
<datalist> element as shown:
There will also be a slew of cool attributes for form elements that will greatly reduce the work put into creating secure and usable forms. Some of these will be:
autofocus, form, required, autocomplete, min, max, pattern, step, list, inputmode and
template. You can get a good idea of what each of these will be used for from their names.
required are going to be very useful.
Inputmode allows the the page author to provide a hint about the input of the form element to the user. The
list attribute is used in conjunction with a datalist element
as shown above.
I’m so happy that they have decided to keep the
value attribute of the
li element and the
start attribute of the
ol element. These useful attributes were previously marked deprecated, but since there is no CSS equivalent way to perform these functions, we get to keep them. Also, they are adding a
reverse attribute to the
ol in case you want to show your numbered list starting from the highest number. A new type of list called
dialog will be added for displaying dialogs and conversations in a semantic way. the
dd tags will be borrowed from the
dl element to show who said what and what they said.
There are going to be many new elements that increase semantics and functionality. Some of these elements are:
section, article, aside, header, footer, nav, figure, audio, video, time, meter, canvas, command, progress and
section element will define sections of a page and will serve a semantic purpose similar to
div except it will be more encompassing. Each section will have its own set of
h6 header elements. The
article, header and
footer elements will be used to describe different parts of the page as indicated by their names. Navigation menus will now be constructed using the
nav element and
menu element. This will finally make navigation menus more semantic. The
menu element is not new, but it is now something totally different and semantically useful. Elements like
audio will be used instead of
object for presenting those kinds of media. For full descriptions and information about more of the elements and attributes, read the W3C specifications for yourself.
We can say goodbye to many of our old elements including
basefont, big, center, font, s, strike, tt, u, frame, frameset, noframes, acronym, applet, isindex and
dir. All these things can be accomplished by CSS or by another element. These elements have been removed for reasons of redundancy, accessibility, and semantics. Many attributes have also been removed from certain elements.
Concepts and Conclusions:
There are also a few new elements and attributes that I haven’t discussed that will change the way we write HTML and our scripts. Many of these new features will allow us to do things like trigger events, create data-dependent parts of our page, create elements in loop structures and aid in the creation of templates. These are some exciting things to look forward to. (Though arguments abound on their place in a simple markup language.)
Remember that HTML 5 is still in draft form and many of these things may or may not be in the final spec. I’ve only scratched the surface of HTML 5 in this post, so check out the specs for yourself and start waiting.
Finally, take a look at A List Apart’s similar look into some of HTML 5′s new featureset:
A Preview of HTML 5 [A List Apart]