Michael(tm) Smith: HTML5 at Web Directions South 2008

Prolog:HTML5 features that work in browsers now

• canvas element: scriptable image

• video and audio elements: embed interactive video and audio easily, without plugins

• new form attributes & APIs, for client-side form validation & new native form widgets in browsers

• API for offline Web applications: ApplicationCache

• APIs for client-side data storage per-session (sessionStorage) and persistently across sessions (localStorage and client-side SQL database storage)

• postMessage() mechanism for cross-document messaging

• API for native drag-and-drop (without need for script library)

• native getElementsByClassName

• more...

December 1997

December 1997:HTML4 published as

W3C Recommendation

In other words...It’s been ten years since the last major update

to the HTML language.

So have we all just been sitting around on the

boat doing nothing for the last ten+ years?

Well, no...

Work on Web technologies at the

W3C was focusing on some other things...

XML, XML Schema, XForms, XHTML2...

XHTML 2.0 seems to me the live proof that something is going wrong

at W3C... I strongly suggest dropping all XHTML 2.0 efforts in

favor of a new “xHTML 5.0” language. Clearly a successor to

HTML 4, feature-oriented, made for the web.

Daniel Glazman, December 2002

Meanwhile, elsewhere...

September 2003:Opera CTO Håkon Lie first announces what

will become Web Forms 2.

Web Forms 2 represented the early beginnings of the work

that led to HTML5.

April 2004:Web Applications 1.0,

which eventually becomes HTML5.

June 2004:W3C workshop on Web applications, a turning point that

led to...

June 2004:WHATWG launched,

with Apple, Opera, Mozilla on board.

The dream of a new web, based on XHTML+SVG+SMIL+XForms, is just

that — a dream... The best way to help the Web is to incrementally

improve the existing web standards... so that web content authors can actually deploy new

formats interoperably.

Brendan Eich, June 2004

“HTML is the assemblylanguage of the Web.”

Web Forms 2,Web Applications 1.0... So who actually wrote

the drafts?

Ian “Hixie” Hickson

March 2007:W3C launches a new

HTML Working Group to work on HTML5.

Co-chairs:Dan Connolly, W3C

Chris Wilson, Microsoft

http://esw.w3.org/topic/HTML/history

What’s the value proposition for the

HTML5 work?

HTML5 makes life easier and better for

Web developers.

How?

HTML5 increases interoperability, reduces need for UA sniffing & multiple code paths.

HTML5 provides better feature parity with proprietary single-

vendor stuff like Flash.

Frankly, HTML5 also provides new business opportunities for Web

professionals like yourselves.

So what exactly does “HTML5” consist of?

• The HTML5 spec itself

• Support for HTML5 features in 4 major browser engines and in other applications

• HTML5 parsing libraries

• validator.nu HTML5 validator

How many of you have read some part of the HTML5 spec in detail?

The HTML5spec itself...

A wee bit overloaded.

Focuses mostly on specifying conformance criteria for browsers.

Introduces manynew APIs.

But also conflates conformance criteria for HTML content

authors into same spec.

Would like to have a separate spec for just the HTML5 markup

language itself?

That is, a spec for the HTML5 markup

language without the APIs and browser spec?

The HTML5 draft provides a formal spec for HTML parsing and

error handling.

HTML is not XML.HTML is not SGML.

Most HTML content is not well-formed XML.

• Well-formed XML: <input disabled="disabled"> • Empty attribute: <input disabled> • Without quotes: <input value=yes> • Single quotes: <input type='checkbox'> • Double quotes: <input name="be evil">

More than 93% of Alexa Top 500 sites

are not valid.

We need to specify error handling behavior to ensure interoperability

“even in the face of documents that do not comply to the letter of the

specifications”.

http://www.whatwg.org/news/start

Authors will write invalid content regardless of what we spec. So the spec states “what authors must not

do, and then tells implementors what they must do when an author

does it anyway”.

Ian Hickson, “Error handling and Web language design”, http://ln.hixie.ch/?start=1074730186

Don’t get hung up on syntax.

HTML5 defines HTML as an abstract language with two standard

syntaxes supported by browsers:

• a text/html syntax, with parsing rules defined by the HTML5 spec

• an XML syntax, with parsing rules defined by the XML spec

Similarly, applications can potentially represent HTML in memory in any

number of ways.

However, there’s only one standard in-memory representation supported

by browsers: The W3C DOM.

The HTML5 spec precisely defines the DOM representation that

browsers must use to represent HTML content in memory.

Simplify where we can.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<meta charset="utf-8">

• canvas element: scriptable image

• video and audio elements: embed interactive video and audio easily, without plugins

• new form attributes & APIs, for client-side form validation & new native form widgets in browsers

• API for offline Web applications: ApplicationCache

• APIs for client-side data storage per-session (sessionStorage) and persistently across sessions (localStorage and client-side SQL database storage)

• postMessage() mechanism for cross-document messaging

• API for native drag-and-drop (without need for script library)

• native getElementsByClassName

• more...

Demos:

http://www.whatwg.org/demos/2008-sept/

Somewhat related work outside of the core HTML5 effort...

• SVG in Opera, Mozilla, WebKit

• CSS transforms/animations

• CSS3 Selectors

• Selectors API

• XMLHttpRequest level 1 and 2

• Access Control for Cross-Site Requests

• native JSON support in browsers

• JavaScript 3.1 “Harmony”