HTML5 examples

[mmj]

Yep, saw that part of the FAQ now and edited my post

[Stomme poes]

Tyssen,
Anne van Kesteren is giving a little talk on HTML5 and some other stuff Monday night in Breda. If he mentions any non-techie examples using the tags themselves rather than just the doctype I'll let you know.

[Tyssen]

If he mentions any non-techie examples using the tags themselves rather than just the doctype I'll let you know.

Cool, thanks.

[Hammer65]

I would imagine that the safest way to experiment with HTML 5 and still allow whatever you do with it, to be usable and distributable widely would be through an Adobe Air application. The webkit version Air uses has a lot of the proposed HTML 5 features, as well as a number of experimental CSS features that aren't even part of any proposed spec yet. At least with Air you aren't concerned with cross browser issues, but you can play to your hearts content and still make it useable by others.

[drhowarddrfine]

The webkit version Air uses has a lot of the proposed HTML 5 features

So do the browsers so why not just use a browser?

as well as a number of experimental CSS features that aren't even part of any proposed spec yet.

That's scarier than anything else. If it's not in the browser right now, AND a part of the proposed spec, then I'd have no use for it.

I found the only way to get IE to play with my HTML5 markup is to use javascript to get IE to include the new elements in the DOM. That messes me up on my initial writing if I want to include it in the rewrite because I don't want to require js but I won't have time to look into that thought till next week.

[drhowarddrfine]

Tyssen,
Anne van Kesteren is giving a little talk on HTML5 and some other stuff Monday night in Breda. If he mentions any non-techie examples using the tags themselves rather than just the doctype I'll let you know.

Anne has been using HTML5 to a limited degree for some time now. He's the one that got me to switch all my doctypes.

[Hammer65]

So do the browsers so why not just use a browser?

Because if the point is to experiment with the features, but still do something that is widely usable, Air is the best way to do it. In that case you don't care if it works in all browsers or not. It's a distributable application.

That's scarier than anything else. If it's not in the browser right now, AND a part of the proposed spec, then I'd have no use for it.

For a public web site yes, but my point was, if someone is looking for a way to experiment with those proposed features and make something others can use, a platform that uses them, that is a more controlled environment is better than offering up a site that might fall apart because of cross browser issues. If instead of exploring the API, you spend all your time nursemaiding IE so that it has basic functionality for the site, you have wasted far more time.

What is the purpose here? To parade something before the web community that says "look at me, I got IE to do HTML 5" or is it to explore and learn a new spec by doing instead of just reading, before it is finalized and used widely?

[cooper.semantics]

I myself would like to see some more examples in the wild. For now I am using the http://www.alistapart.com/articles/previewofhtml5
class name approach.
http://forabeautifulweb.com/demo/2008/11/15/index.html

As Tyssen already posted:
http://www.brucelawson.co.uk/tests/html5-elements.html
I think this is the only one I have seen thus far.

Off Topic:


http://www.end6.org/
You guys will get a kick out of this!

[Amenthes]

...some using HTML5 without the new tags (e.g. Eric Meyer and An Event Apart)...

aneventapart.com uses (just) an HTML5 doctype, has XHTML5 markup and
sends text/html content type headers... Right... So much for the standards.
I truly believed that HTML5 will teach people the differences between HTML
and XHTML . What's so hard about it?

On topic: I have an admin app on which I begun testing HTML5 features.

[drhowarddrfine]

Because if the point is to experiment with the features, but still do something that is widely usable, Air is the best way to do it. In that case you don't care if it works in all browsers or not. It's a distributable application.

But then you have to install and rely on AIR. I'd rather just learn what the browsers use and not have to learn AIR either.

if someone is looking for a way to experiment with those proposed features and make something others can use

Well, OK, but we're talking about actual usage and not experimenting.

What is the purpose here? To parade something before the web community that says "look at me, I got IE to do HTML 5" or is it to explore and learn a new spec by doing instead of just reading, before it is finalized and used widely?

Using HTML5 features that are already implemented in browsers. Fortunately, a number of them do, as I said, above, except in IE which needs help as always.

[drhowarddrfine]

aneventapart.com uses (just) an HTML5 doctype, has XHTML5 markup and
sends text/html content type headers... Right... So much for the standards.

I don't understand the comment. What's the problem with it?

I'll throw Kroc Camen's site in though it's a developer's site.

[SoulScratch]

Tyssen,
Anne van Kesteren is giving a little talk on HTML5 and some other stuff Monday night in Breda. If he mentions any non-techie examples using the tags themselves rather than just the doctype I'll let you know.

Damn, you get to attend all the cool meetings.

[zcorpan]

aneventapart.com uses (just) an HTML5 doctype, has XHTML5 markup and
sends text/html content type headers... Right... So much for the standards.
I truly believed that HTML5 will teach people the differences between HTML
and XHTML . What's so hard about it?

HTML5 vs XHTML5 isn't so much about markup but more about text/html vs XML -- the text/html version allows XML talismans such as xmlns and />. Whether this is a good idea or not is debatable (Hixie doesn't like it for one), but the arguments in favor were stronger than the arguments against, leading to the change (back in late 2006, IIRC).

[Tyssen]

I'll throw Kroc Camen's site in though it's a developer's site.

Yeah, I've already seen that one. And Jeremy Keith points to a few other web dev-related sites using partial HTML5 - HuffDuffer, UX London, and The Watchmaker Project, but it seems like non-web dev-related full HTML5 sites might be thin on the ground.

[Amenthes]

I don't understand the comment. What's the problem with it?

It's simple, the (draft) standards say that XHTML markup should be sent with
a certain HTTP content-type header.

XHTML documents (XML documents using elements from the HTML namespace) that use the new features described in this specification and that are served over the wire (e.g. by HTTP) must be sent using an XML MIME type such as application/xml or application/xhtml+xml and must not be served as text/html.

HTML5 vs XHTML5 isn't so much about markup but more about text/html vs XML -- the text/html version allows XML talismans such as xmlns and />. Whether this is a good idea or not is debatable (Hixie doesn't like it for one), but the arguments in favor were stronger than the arguments against, leading to the change (back in late 2006, IIRC).

Care to share a link to some resource that says XHTML sent as text/html is
better than HTML?

[drhowarddrfine]

a few other web dev-related sites using partial HTML5 - HuffDuffer, UX London, and The Watchmaker Project

Maybe I didn't look hard enough but, other than the doctype, I don't see any HTML5 in there. Kroc uses quite a bit, for what can be done.

[Tyssen]

That's what I mean by partial. The first two also use class names that mimic the new elements, e.g. section, article etc.

[drhowarddrfine]

Problems with IE8. Converted a few pages from an existing site, replacing <div> with <section>, <nav>, <article> and such. All works fine in FF, Opera, Chrome and, surprisingly, IE6/7. Fails positioning in IE8 beta2. This is actually a CSS problem, I guess, and IE8 obviously regresses as it doesn't handle styling of <html> or <body> as the other browsers do.

EDIT: Problem confirmed by others. Bug was filed but Microsoft was "unable to duplicate" it. They also closed it since it was first reported with Beta1 and it "may have been fixed" in Beta2. Obviously not.

[Dark Tranquility]

Anyone saw this: http://dev.opera.com/articles/view/h...as-the-basics/ ? Your thoughts?
Simon, I am sure you did!

[zcorpan]

It's simple, the (draft) standards say that XHTML markup should be sent with
a certain HTTP content-type header.

HTML markup and XHTML markup can, per HTML5, look exactly identical. You have to look at the HTTP header to tell them apart.

Care to share a link to some resource that says XHTML sent as text/html is
better than HTML?

Huh? I didn't say that. I explained that the HTML5 draft allows XHTML-like syntax in text/html.

For demonstrative purposes, the following are all valid HTML5 and semantically equivalent:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head><title></title></head><body></body></html>

<!doctype html>
<HTML XMLNS=http://www.w3.org/1999/xhtml><HEAD><TITLE></TITLE></HEAD><BODY></BODY></HTML>

<!doctype html><title></title>

Which coding style to follow is mostly a matter of taste. Bottom line is that if it's sent as text/html then it is by definition HTML.

[zcorpan]

Problems with IE8. Converted a few pages from an existing site, replacing <div> with <section>, <nav>, <article> and such. All works fine in FF, Opera, Chrome and, surprisingly, IE6/7. Fails positioning in IE8 beta2. This is actually a CSS problem, I guess, and IE8 obviously regresses as it doesn't handle styling of <html> or <body> as the other browsers do.

EDIT: Problem confirmed by others. Bug was filed but Microsoft was "unable to duplicate" it. They also closed it since it was first reported with Beta1 and it "may have been fixed" in Beta2. Obviously not.

It's fixed in the RC1 build.

[Stomme poes]

Damn, you get to attend all the cool meetings.

You in North America? Check out YAPC:NA (site's not ready for this year yet, only stuff for 2008).

[drhowarddrfine]

I give up. I started doing some serious markup work using HTML5. Using the new elements works fine, and styling sometimes does, too, but not well enough that I can start using it. I changed enough stuff around that I don't recall where I left off but here is what I tried:

<section>
<nav>
<ul>
<li><input type="image" .....></li>
.
.
.
</ul>
</nav>
</section>

Every day sort of thing. But then I wanted to position the <ul>, contents of the <li>s and so on with floats or relative positioning and sizing but some things just wouldn't budge. Firebug doesn't seem to always know what is what so I had to outline the elements. The outlines and borders sometimes wound up in strange positions or disjointed in Firefox. IE hardly worked at all with any styling. I didn't get to look in any other browser but that was enough proof that this isn't ready for production.

I can see why it might be hard to find something beyond developer blogs that use it. I was doing some more fancy stuff than you'd find in a blog. That doesn't mean you shouldn't try, though. I can see that simpler layouts could be made to work quite well. It's just not something I can use right now and I'm just too busy to experiment further.

[jamesicus]

HTML5 and XHTML2 combined (a new approach) -- lively and interesting (Birbeck and Hickson get in some good shots).

JFP

[jamesicus]

Semantic Web enthusiasts will find Ian Hickson's comments relating to HTML5 and GRDDL (Gleaning Resource Descriptions from Dialects of Languages) very interesting -- although some may find his opinion that HTML5 won't be viable for many years a bit disappointing (I was hoping to see HTML5 implemented and stable before I "kicked the bucket" -- now I am not so sure!)

There is no doubt that HTML5 (and even now HTML 4.01) will be used extensively in Semantic Web data manipulation.

JFP