HTML5 History and Terminology

Mit Tukane!

Smashing Meetup, Stuttgart!

Paul Irish

Slides: goo.gl/HiZLm

My name is Paul. Hi hi hi!

In June 2004,
representatives from the semantic web community, major browser vendors, and the W3C met
in San Jose, California

Topic: the W3C's response to the rise of web applications.

A vote...

Should the W3C should augment HTML and the DOM to address the new requirements of web applications?

The results...

"8 for, 14 against."

HTML5's Birth


2 days later...

the WHATWG was formed from the major browser vendors to solve emerging issues: WHATWG WebApps Spec

Meanwhile, the W3C pushed forward with the XHTML2 spec.

5 years later...

W3C drops XHTML2 to focus on an aligned HTML5 effort with the WHATWG.

The Doctype

Modal rendering via Doctype

The HTML5 Doctype

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
to
<!doctype html>
More: Anne van Kesteren's DOCTYPE of HTML5. Henri Sivonen's The Last HTML Quirk and Activating Browser Modes with Doctype

The HTML5 Shiv

HTML5 Shiv Summary



People did stuff.

You can use HTML5 elements in a cross-browser fashion.

IE's Historical Good Calls

IE's good calls.

Sources: Rob Larsen, htmlcssjavascript.com and me and ryan seddon.

Brief History of @font-face

Terminology

Shiv? Shim?

Technically it's a "shim".

John Resig admitted this later.

But...

massive proliferation of HTML5 shims...

“I want to jam standards support into (this and future versions of) Internet Explorer. If a shiv is the only pragmatic tool I can use to do so, shouldn’t I be using it?”Chris Wilson, then of the IE Team

Terminology

oldIE
Internet Explorer 6, 7 & 8. aka, the three browsers often getting the low-res experience.[ref]
boat-anchor browser
the browser with enough users and not enough capability, holding back the potential of the web [ref]
TAFEE
tiered, adaptive front-end experiences. Customizing the experience to the unique capabilities of each browser, prioritizing a fast and good UX over consistency. [ref]

Terminology

FOUT
Flash of Unstyled Text [ref]
MQ
Media Queries
Polyfills
A shim that shares the standard API, allowing it to be removed when native support is added. [ref]
intranet apps
a scapegoat for delivering browser updates.
a euphemism for poorly written code.

Terminology

cool
an epithet of approval particularly among young, indicating trendiness, quality, or appropriateness [ref]

Thank you!

Thx: @Divya Manian, Alex Russell, @Mathias Bynens, Tantek Çelik, Henri @hsivonen, -ot, @tabatkins, +Ian Hickson