html5
TRANSCRIPT
Doctype
Antes:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
Agora:
<!doctype html>
Tag <html>
Antes:
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”en” xml:lang=”en”>
Agora:
<html lang=”pt-BR”>
Meta Charset
Antes:
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8” />
Agora:
<meta charset=”UTF-8”>
Estrutura básicaAntes:
<!DOCTYPE HTML PUBLIC “-//W3C//DTDHTML 4.01//EN” “http://www.w3.org/TR/html4/strict.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>Example document</title> </head> <body> <p>Example paragraph</p> </body></html>
Agora:
<!doctype html><html lang=”pt-BR”>
<head><meta charset="UTF-8">
<title>Example document</title> </head>
<body> <p>Example paragraph</p>
</body></html>
Novos elementosSemânticos:
<article><aside><details><figcaption><figure><footer><header><main><mark><nav><section><summary><time>
Tags:
<audio><video><source><track><canvas><svg>
Novos inputs:
colordatedatetimedatetime-localemailmonthnumberrangesearchteltimeurlweek
SemânticaAntes:
<body><div id=”header”>
<img src=”logo.png”></div><div id=”menu”></div><div id=”conteudo”>
<div id=”secao1”></div><div id=”secao2”></div>
</div><div id=”rodape”>Rodape</div>
</body>
Sem significado
Antes:
<body><header>
<img src=”logo.png”></header><nav></nav><main>
<section id=”secao1”></section><section id=”secao2”></section>
</main><footer>Rodape</footer>
</body>
Com significado
Novas APIsWeb Sockets
Geolocation
Indexed DB
Canvas
Contenteditable
File API
Application cache
Notifications
Web Storage
Drag and drop
Get user media
Várias outras
Posso usar tudo ?
Can I use:
http://caniuse.com/
HTML5 Teste
http://html5test.com/
Games em HTML5
Game Mechanic Explorer:
http://gamemechanicexplorer.com/
HTML5 Game Development:
http://www.html5gamedevelopment.com/
Leitura obrigatória
Mozilla Developer Network:
https://developer.mozilla.org/pt-BR/docs/Web/HTML/HTML5
W3C Brasil:
http://www.w3c.br/pub/Cursos/CursoHTML5/html5-web.pdf
HTML5 Rocks
http://www.html5rocks.com/pt/