Friday, June 10th, 2005
HTML 5 vs. XHTML 2
We try to keep up on what the WhatWG and the W3C are proposing for all of our benefit.
We have been really impressed with the WhatWG, and secretly wish that the IE team would be totally on board (with the other browser teams that participate there).
At a recent conference in europe, both groups presented their visions.
HTML 5: WhatWG
HTML 5 is the naming group for the WhatWG as they propose extensions to HTML4 and the DOM.
It is great to see some of the rich components that we would get with HTML 5:
- <datagrid>: As you can imagine. A rich data grid component.
- <canvas>: We are really excited about Canvas, which you can play with a litle in the Firefox 1.1 alphas (buggy)
- Range: Imagine <input type=”range”>. Yahoo! Mindset could have just used this.
- Email, Url, Time, Date: <input type=”email|url|time|date”>. Rich.
- Simply allow editable content: <content Editable=”"..
- Event Sources: <event-source src=”/some/path” onevent=”process(event)”/> rather than a lot of JavaScript and iframes.
XHTML 2: W3C
XHTML2: Accessible, Usable, Device Independent and Semantic.
The design aims:
- As generic XML as possible: if a facility exists in XML, try to use that rather than duplicating it. This means that it already works to a large extent in existing browsers (main missing functionality XForms and XML Events).
- Less presentation, more structure: use stylesheets for defining presentation.
- More usability: within the constraints of XML, try to make the language easy to write, and make the resulting documents easy to use.
- More accessibility: ‘designing for our future selves’ – the design should be as inclusive as possible.
- Better internationalization.
- More device independence: new devices coming online, such as telephones, PDAs, tablets, televisions and so on mean that it is imperative to have a design that allows you to author once and render in different ways on different devices, rather than authoring new versions of the document for each type of device.
- Better forms: after a decade of experience, we now know how to make forms a better experience.
- Less scripting: achieving functionality through scripting is difficult for the author and restricts the type of user agent you can use to view the document. We have tried to identify current typical usage, and include those usages in markup.
- Better semantics: integrate XHTML into the Semantic Web.
Changing Structure
One of the biggest problems for non-sighted people with many HTML pages is working out what the structure is. Often the only clue is the level of header used (h1, h2 etc), and often they are not used correctly.
To address this, in XHTML2 you can now make the structure of your documents more explicit, with the <section> and <h> elements.
<section>
<h>A heading</h>
…
<section>
<h>A lower-level heading</h>
…
</section>
</section>
img bye-bye
You might be surprised to know that <img> was not in the original HTML.
The future:
<p src=”map.gif”>Walk down the steps from the platform turn left, and walk on to the end of the street</p>
More metadata
<body>
<h property=”title”>My Life and Times</h>
Here’s my question: When will we be able to put, say, id=”foo” in the closing tag in addition to the opening tag, so that when we’re looking, say, at a mess of closing div tags (visibly-nested or otherwise), we can tell which is which?
That probably won’t happen, because, as far as I can tell, it would violate XML’s rules for well-formedness.
When will we be able to put, say, id=”foo” in the closing tag in addition to the opening tag, so that when we’re looking, say, at a mess of closing div tags (visibly-nested or otherwise), we can tell which is which?
You could just label them all with comments. I wish I’d thought of that sooner actually, now I’ll have to go through my new site design putting them in.
I admit that it’s messy, but, space-wise, given that you’d be adding in all of those extra classes and ids, it probably doesn’t take up all that much more room.
looking at the image example, Are you able to add a src attrubite to almost any tag? And I assume that the containing text is sort of like the alt attrubite on the img tag?
“When will we be able to put, say, id=”foo” in the closing tag in addition to the opening tag, so that when we’re looking, say, at a mess of closing div tags (visibly-nested or otherwise), we can tell which is which?”
I’ve always thought this should be a feature of an editing app – hover over a closing tag and see the id of the opening tag.
Aren’t some of the features in the proposed HTML 5 spec already in WebKit/Safari (like Canvas and WYSIWYG editable content)?
Why lose the image tags! an image is an image this part doesnt make any real sense to me.
There’s a method commonly used to solve this problem cause by “a mess of closing div tags”. We call it “indentation.”
Also, some editors (I use jEdit) highlight the matching tag that cursor in. Another feature that helps with this is called “folding”. If you are not familiar with this, I highly suggest you download jedit now (http://jedit.sf.net).
Yes, some features are already implemented in Safari, like the <canvas> tag. It’s also already implemented in the alpha versions of Firefox.
They are losing the <img> tag in favor of the <object> tag (which already supports images).
BTW, this comment system sucks.
The img tag is still present in XHTML 2.0. See for yourself at http://www.w3.org/TR/2005/WD-xhtml2-20050527/xhtml2.html#s_imagemodule
Nice article. I especially like the look of canvas and datagrid!
Let’s hope Microsoft can develop a browser that can actually render it properly :P
I want to add a src tag, is that alowed in this format?
Anna.
[...] El día de ayer y el de hoy por la madrugada me la pasé entretenido en uno de mis muchos pasatiempos: me dediqué a asegurarme que mi plantilla de WordPress fuera lo más apegada a los estándares. Tengo entendido que HTML 5 y XHTML 2 están a la vuelta, … y cada uno traerá consigo buenas ventajas. [...]