Saturday, September 27th, 2008

HTML 5: Ian Hickson showing you features in browsers today!

Category: Browsers, HTML, Standards

<p>Ian Hickson gave a great presentation at Google where he just sat down, opened up Emacs, and started to build demos on the fly that use HTML 5 features. His goal was to use browsers available today (albeit nightlies and such for some of them) to show progress…. so no future tense!

You can watch the presentation below, but to see the code better I recommend going to the high quality version.

Ian put the finished demos online and you can go to them specifically via:

  1. <video> (00:35)
  2. postMessage() (05:40)
  3. localStorage (15:20)
  4. sessionStorage (21:00)
  5. Drag and Drop API (29:05)
  6. onhashchange (37:30)
  7. Form Controls (40:50)
  8. <canvas> (56:55)
  9. Validation (1:07:20)

It is great to see some of this stuff working, and seeing many of them work in more than one browser. I really like seeing postMessage!

  1. http://www.whatwg.org/demos/2008-sept/gadget-host/host.html
  2.  
  3.      <iframe src="http://damowmow.com/playground/demos/gadget/gadget.html">
  4.      </iframe>
  5.  
  6.      <p>
  7.       <label>
  8.        Nick:
  9.        <input type="text" name="nick" onkeyup="updateNick(value)"/>
  10.       </label>
  11.      </p>
  12.  
  13.      <script>
  14.       function updateNick(nick) {
  15.         frames[0].postMessage('nick=' + nick,
  16.                     'http://damowmow.com/playground/demos/gadget/gadget.html');
  17.       }
  18.      </script>
  19.  
  20.    http://damowmow.com/playground/demos/gadget/gadget.html
  21.  
  22.      <p>Hello <span id=nick>Sir</span>!</p>
  23.      <script>
  24.        addEventListener('message', function (e) {
  25.          if (e.origin == "http://www.whatwg.org" &&
  26.             e.data.substr(0,5) == "nick=")
  27.           document.getElementById('nick').firstChild.data = e.data.substr(5);
  28.        }, false);
  29.      </script>

Related Content:

Posted by Dion Almaer at 7:25 am
9 Comments

++++-
4.1 rating from 19 votes

9 Comments »

Comments feed TrackBack URI

I just watched 3 minutes and I wonder, why they are invent again attributes of tags which are (help me if I am wrong) not correct xml. like
<video constrols autoplay>

to be a valid file i gues swe have to write that later as controls=”controls” and autoplay=”autoplay” or so.

Comment by Aimos — September 27, 2008

Aimos, it’s even worse: if you type constrols=”false” or autoplay=”off”, then they’re still true/on! It’s an boolean attribute. Just like “checked” in a radio- or checkbox input element. So, will all existing code like be broken or are we introducing more inconsistency?

Comment by edwinm — September 27, 2008

Aimos, you’re right if you want to use these in an XHTML context, but HTML 5 is actually stemming off of HTML 4, not XHTML 1. In HTML 4, and so in 5 too, an attribute with no value is valid.

Historically speaking, HTML 5 is basically a fork of HTML since originally we were told XHTML 1 would be the next version of HTML, with all the “benefits” of XML (there are some, but it’s arguable that we’ve seen much of them in the context of browser rendering :). Now it’s not clear what the future of XHTML is at all, and HTML 5 is the new non-XML-conforming technology of the day… *sigh* ;)

Comment by lux — September 27, 2008

In the XML syntax of HTML5 (XHTML5) it would be either controls=”controls” or simply controls=”". In the HTML syntax you have valueless attributes (so just controls), similar to HTML4. Just some syntax sugar, nothing to get upset about :-)

Comment by Anne van Kesteren — September 27, 2008

In case you’ve all been living under a rock, XHTML is dead dudes. HTML actively discourages the use of XML on the Web. You might be the only two developers left using XHTML right now, and chances are you are probably using it wrong.

Comment by marcosc — September 27, 2008

My comment above was to Aimos and edwinm, not Anne or lux.

Comment by marcosc — September 27, 2008

@Anne: Although I am aware of the concerns regarding XHTML, I just would like to know if “XHTML is dead” is kind of an official statement you are quoting or if it’s just your personal point of view.

The remark is confusing because the W3 subtitled its HTML5 specification “a vocabulary and associated APIs for HTML and XHTML”.

And for the irony: below this form I am currently writing in it says something about XHTML, too. The Ajaxian “dudes” living under a rock?

Comment by p3k — September 28, 2008

@lux, if that is the case, then i like living under a rock. and i know a bunch of webdevs doing the same.

Comment by ephraimhohn — September 29, 2008

</drool>

Comment by tj111 — September 29, 2008

Leave a comment

You must be logged in to post a comment.