Put the 5 in HTML

24
SC2011 - Software Developers' Haven 2011-08-27 Frédéric Harper – Microsoft Canada

description

Une présentation sur HTML5 que j'ai présenté à FOSSLC SC2011 - Software Developers' Haven

Transcript of Put the 5 in HTML

Page 1: Put the 5 in HTML

SC2011 - Software Developers' Haven

2011-08-27

Frédéric Harper – Microsoft Canada

Page 2: Put the 5 in HTML

• A quick overview

• A focus on some new features

• Law of two feets

• And it will be all about…

Page 3: Put the 5 in HTML

7 tracks with: 6 Agile sessions,

6 Software Architecture sessions,

6 Web Dev sessions

and 28 more!

Page 4: Put the 5 in HTML

A. You know HTML5 and use it now

B. You know what is HTML5 and don’t use it

C. You don’t know what I am talking about

Page 5: Put the 5 in HTML

• Web Standard

• Next version of HTML4 (I know, I’m so brilliant)

• Draft

• New structure tags/elements/input types

• A combinaison of HTML, CSS and Javascript

Page 7: Put the 5 in HTML

<div id=“header”>

<div id=“footer”>

<d

iv id

=

“si

de

ba

r”>

<div id=“nav”>

<div id=“article”>

<div id=“article”>

<div id=“media”>

<div id=“section”>

Page 8: Put the 5 in HTML

<header>

<footer>

<a

sid

e>

<nav>

<article>

<article>

<figure>

<section>

Page 10: Put the 5 in HTML
Page 12: Put the 5 in HTML

<video src="video.mp4" id="videoTag">

<source src="video.webm" />

<a href="http://videolink.com/">

Sorry, your browser doesn’t support HTML5 video tag

</a>

<!– Flash/Silverlight video here -->

</video>

Page 16: Put the 5 in HTML

<link href="mobile.css" rel="stylesheet" media="screen and (max-width:480px)“ type="text/css" />

<link href="netbook.css" rel="stylesheet“ media="screen and (min-width:481px) and (max-width: 1024px)“ type="text/css" />

<link href="laptop.css" rel="stylesheet" media="screen and (min-width:1025px)“ type="text/css" />

Page 17: Put the 5 in HTML

YES and NO

Page 18: Put the 5 in HTML
Page 19: Put the 5 in HTML

Try it

Page 20: Put the 5 in HTML

Read on it

Page 21: Put the 5 in HTML

Do cool

project

Page 22: Put the 5 in HTML

Have fun!

Page 23: Put the 5 in HTML

http://www.w3.org/TR/html5/

http://caniuse.com

http://makeawesomeweb.com

http://html5gallery.com

http://diveintohtml5.org/

http://www.html5tutorial.info/

http://www.beautyoftheweb.com

http://html5labs.interoperabilitybridges.com/

Page 24: Put the 5 in HTML

Frederic Harper

Developer Evangelist @ Microsoft

[email protected]

http://webnotwar.ca

http://outofcomfortzone.net

http://linkedin.com/in/fredericharper

http://twitter.com/fharper

http://facebook.com/fharper