HTML5 easy if you know how
-
Upload
jorge-del-casar -
Category
Technology
-
view
3.913 -
download
0
Transcript of HTML5 easy if you know how
Jorge del Casar@jorgecasar
Co-founder Frontend Spain@FrontendSpain
Co-founder ShoTools.com@ShoTools
Professional profile:linkedin.com/in/jorgecasar
HTML5
JS APis
canvasvideo
audio
web forms
SVG
GEOlocation
Drag & Drop
Storage CSSCSS1
CSS2.1
CSS3
Silverlight Flash
Web Apps
XHTML 1.0 Strict
HTML5
!DOCTYPE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html>
XHTML 1.0 Strict
HTML5
Encoding
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta charset="utf-8" />
XHTML 1.0 Strict
HTML5
Links
<link rel="stylesheet" type="text/css" href="style.css"/>
<link rel=stylesheet href=style.css>
XHTML 1.0 Strict
HTML5
Script
<script type="text/javascript" src="jquery.js"></script>
<script src=jquery.js></script>
Polyfills
html5shim
<!-- [if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
Old structure<div id=”header”>
<div id=”nav”>
<div id=”sidebar”>
<div id=”footer”>
<div id=”main”>
<div class=”post”>
<div class=”post”>
sectionnav
section
header nav
asidearticle article article
footer
figure figurevideo
figcaptionfigcaptionheader header header
header
New tags
articleaside
audio
canvasda
talist
command
detailsfigure
figcaption
footer
header
hgro
up
keygen
nav meter
outputvideo
time
source
summary