HTML5 may not be a fully finalized standard yet, but it isn't changing much -- and adoption is on the rise. Justin James highlights the key aspects of the new specification.
A year or two ago, HTML5 seemed like a vague idea that only a few Internet wonks cared about. Now, it feels like HTML5 is everywhere. Thanks to rapid releases from Mozilla and Chrome, and the deployment of IE9 from Microsoft (and IE10 already in "tech preview" status), browser support for HTML5 is available to nearly everyone in a limited (or better than limited) amount. Developers are starting to take advantage of the widely implemented features. With full HTML5 support probably less than a year away, and the specification quickly reaching an unchanging state, this is a great time to look at some things you should know about HTML5.
1: XHTML is no more; long live HTML5 with XML syntax
XHTML was the choice of people who favored precision, particularly for parsing. HTML has always looked a lot like XML, but it never was quite exactly like XML, and as a result, trying to parse it like XML would fail. So a while ago, the XHTML spec was made, to take the HTML language and put it into the XML lingo. When HTML5 first got started, there was work on XHTML 2 as well, but that was eventually mothballed. Instead, the HTML5 spec is written so that you can write HTML5 with strict XML syntax and it will work. And if you send it with an XML MIME type, user agents will parse it as an XML document too. This gives developers the best of both worlds.
2: The 2022 myth, the 2011 reality
One of the persistent misconceptions around HTML5 is that "it won't be done until 2022." The typical supporting evidence for this is an interview I conducted with Ian Hickson, the HTML5 specification editor, a few years ago. Ironically enough, even in that interview, he was clear about the 2022 date. But a few people got really worked up about it, and their angry articles got a lot more attention than the actual facts.
The truth is that 2022 is when Hickson expects the HTML5 spec to become a full W3C recommendation, which means that there are two 100% complete, verifiable implementations. To get an idea of why that is both fairly meaningless and a huge leap at the same time, consider that no other version of the HTML spec has ever achieved that status, mainly because they were too vague for any implementation to be provably correct. The HTML5 specification is getting close to being solidified and unchanging, right now in 2011.
3: It is a Flash and Silverlight killer for many developers
While HTML5 does make numerous improvements in how it is used for marking up documents, the big focus is in applications. The number of features that HTML5 introduces to support application development is staggering. This isn't to say that Flash and Silverlight are going away anytime soon. But Microsoft has already announced that it's refocusing Silverlight on the out-of-browser experience. Flash and Silverlight still have capabilities that HTML5 does not have, but the gap is nonexistent for many common purposes now, thanks to HTML5's new capabilities. It probably isn't worth rewriting existing applications, but you should see whether HTML5 makes sense for new applications.
4: It is the basis of many new tools
With HTML5 becoming a full-blown application framework, toolmakers are now using it as the foundation technology for their products, particularly those designed to overcome cross-platform development issues. If you are looking to write an application that runs cross platform, and it is within the capabilities of an HTML5 application, you should consider one of these tools. This is especially important in the mobile space, where the alternative is to learn an entirely different language, API, and framework for each phone platform you want to target.
5: The <video> tag is important but controversial
My personal pick for "best new HTML5 feature" is the <video> tag. Before <video> (there is also an <audio> tag), you would find yourself having to turn to Flash or Silverlight to provide a media player on your site. With these new tags, those days are, in theory, over. Why only "in theory"? Sadly, the different browser makers can't quite decide on which formats to support yet, due to patent concerns. When the dust settles on that, Flash and Silverlight both lose their #1 use case.
6: Google led the way
If it seems like the Chrome browser has a huge head start with HTML5, there is a good reason for that. The HTML5 specification process put a heavy premium and emphasis on written, deployed code. I'm not saying that they "rubber stamped" whatever browser vendors did. But it was hard to convince those involved to write specifications for unimplemented features, and implemented features were likely to become the basis of new items in the specification. Because Chrome seems to have a new version every few weeks, features that Google put into it had an excellent chance of making it into the HTML5 spec.
7: "Standards compliant" is finally provable
Whenever someone claims that a browser is or is not "standards compliant," I have got to laugh. Before HTML5, it is literally impossible to be provably standards compliant. In many cases, the current specs are too vague or simply silent on important issues (like handling parsing errors) and the result is that different browsers can do wildly different things and still be either standards compliant or fall into the category of "not provably out of compliance." Even the famous ACID test does not prove too much, since it tests only a subset of the HTML specification. With HTML5, the bar has been raised quite a bit, and it will finally be possible to prove that a user agent is standards compliant. Indeed, one of the reasons behind the 2022 date for "recommendation" status is the need to write full test suites.
8: "Standards compliant" still does not guarantee how it will look
Standards compliance in Web browsers does not do what people often think it does, and HTML5 does not change that fact. A big confusion with HTML is that many Web designers and developers believe that the HTML specification controls the look of items on the screen; it does not. For example, a Web browser can make the <strong> tag use a bigger or different colored font instead of a heavier font, if it likes and still be compliant. Many times, when designers say a browser is not standards compliant, what they are really encountering is the flexibility given to user agents in how to render tags. HTML5 does not change this fact. If you absolutely need a tag to be rendered in a precise way, do not count on the browser's default behavior; specify your needs in CSS.
9: Parsing is more precise
The HTML5 specification finally introduces precise parsing rules and defines things like what the user agent should do when it encounters a parsing error. As a result, you can expect that some things that used to pass as acceptable or even "valid" HTML in the past will no longer cut the mustard. You will want to get familiar with HTML5's parsing rules and make sure that your code adheres to them.
10: HTML5 goes far beyond the browser
In previous versions of HTML, there was an inherent assumption that a traditional Web browser was the user agent of choice. While other user agents and content types were supported, there was an implication that they were not as important. HTML5, on the other hand, has a good number of changes to put non-browser, non-desktop-size-screen user agents on more equal footing with traditional Web browsers. There have been a lot of advances with things like how well it works with screen readers and mobile phones. As a result, well-written HTML5 can be a "write-once, view anywhere" framework for developers who need it, and it can reach users (particularly those with a variety of disabilities) who otherwise would struggle with the Web.
Additional HTML5 reading
- Form a learning plan for an HTML5 future
- HTML5: The next generation of web design
- HTML5: Creating a base template
- HTML5: Attributes, semantic markup, redefined elements
- HTML5: Using sectional elements
- HTML5: Using structural elements for header, footer, and navigation
- Check out the Edge software preview from Adobe