What am I looking at?
You're looking at a project called "HUE", or HTML Upsizing Engine. HUE is a tranformational engine, allowing a developer to create a template that can be served in both standards compliant XHTML 1.0 Strict, and HTML5. Upsizing is performed by the server, which can then dynamically shift modes through either a query string or a global value predefined.
What modes are you talking about?
HUE enables developers to write code once, and upsize their XHTML to HTML5 without writing extra code. In XHTML mode, all tags are classed semantically, according to standards established by microformats.org. In HTML5 mode, HUE takes these semantic DIVs, ULs, and other elements, and upsizes them to their proper HTML5 equivalent as of the most recent draft from W3C.org.
Why was HUE made?
This is a niche engine, geared towards the individuals who want total control over how their content is displayed. Many designers and developers don't know how to style or even structure the newer HTML5 constructs. HUE aims to bridge this gap by keeping to a familiar XHTML + class venacular, and automatically transforming it into the proper HTML5 equivalent. This allows both developers and designers to test their code and use modern constructs with minimal effort.
Can I see an example of how this works?
Absolutely. This entire site is built on HUE, and you can switch modes at any time by updating the "modern" querystring, or clicking one of the links below. This will shift the entire site into HTML5 or XHTML 1.0 mode. Please note, if your browser does not support HTML5 markup, you will not be able to see the site correctly after switching modes. Simply switch "modern" back to 0, and you'll be viewing the site again in XHTML mode. You won't notice a visible difference between either mode (isn't that neat?) so make sure you view the source of both modes to see HUE in action.
XHTML 1.0 Mode: ?modern=0
HTML 5 Mode: ?modern=1
