Introduction to HTML5 · I work for the W3C in Japan, based at Keio University near Tokyo
TECH | IMMERSION...In 2006, the W3C indicated an interest to participate in the development of HTML5...
Transcript of TECH | IMMERSION...In 2006, the W3C indicated an interest to participate in the development of HTML5...
WELCOME TO
TECH | IMMERSION
Right Here. Right Now. HTML5
Presenter: J Michael Palermo IV
http://palermo4.com
@palermo4
…The purpose of this document type is
to serve as the basis for future
extended XHTML 'family' document
types, and to provide a consistent,
forward-looking document type cleanly
separated from the deprecated, legacy
functionality of HTML 4 [HTML4] that
was brought forward into the XHTML
1.0 [XHTML1] document types.
You will use XHTML.
The Emperor has foreseen it.
NOW
WHAT?
Exactly
…
Web
Hypertext
Applications
TechnologyWorking Group
www.whatwg.or
g
In 2006, the W3C indicated
an interest to participate in
the development of HTML5
after all, and in 2007 formed a
working group chartered to
work with the WHATWG on
the development of the
HTML5 specification.
Apple loves HTML5.
Google loves HTML5.
Microsoft loves HTML5.
It’s official: we have a logo!
http://www.w3.org/html/logo/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>Untitled Page</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body></html>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>Untitled Page</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body></html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>Untitled Page</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body></html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Untitled Page</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body></html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Untitled Page</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body></html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Untitled Page</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<p>Hello World!</p>
</body>
</html>
Top 20 Class Names
(http://code.google.com/webstats/)
Mapping Popular Class Names
Now, common layout
idioms get promoted to 1st
class <elements>
DEMO
Thank you.