Adventures with HTML5, Part 1

One of the hotter topics in Web-Development today is the rise of HTML 5.
Like many others I’ve had only vague ideas, of what it is: Something with directly embedding videos with the

While working on a JSF2-based component suite I decided to take a look into HTML5: Maybe this will improve matters and simplify some tasks.
This is the start of a small series of blog-entries reporting my adventures.

History
The predecessor HTML 4.01 / XHTML was specified by the W3C and widely, or let’s better say globally, adopted.
The web evolved, but the spec did not. The process of creating the next version called XHTML 2 was slow and tedious.
In order to get things done a new group called WHATWG came to life and specified HTML5. In the meantime the W3C stopped the progress on XHTML2 and switched to (X)HTML5.
The discussion, e.g. structured approach vs. Tag-Soup can be found here or here.

Ok, so much for politics, let´s talk technical
The first interesting aspect, the doctype declaration, is that there is only one:

So much for the structured approach. But as mentioned above I´m working on a JSF2-Suite with facelets and therefore I need XML.
The good news: There is something out there called XHTML5.
The bad news: not really xml, because there is no grammar constraint defined.
This came as a nasty shock. The solution: Use XHTML, like:




With this, the facelets parser will work, but the problem is: You have no validation or code assist, because the XHTML-DTD does not know anything about the new tags like

Legacy
While there are Browsers out there that can deal with HTML5, at least understand some of the elements. There is still the Web-Developers Best-Friend coming from Redmond.
The problem is, how IE deals with elements, it never heard of. The Problem is described here, the solution is loading a little JavaScript that resolves the Problem, thanks to Remy Sharp.



This Script will create Dom-Nodes for the new elements like

<

section> and let you apply CSS to style them.

Short URL for this post: http://wp.me/p4nxik-7R
This entry was posted in Java Web Frameworks, XML Universe and tagged , , , , . Bookmark the permalink.