este é um novo capítulo 1
Estamos indo para Webville!
Há tantas construções ótimas em
HTML5 sendo feitas, que seríamos
loucos se morássemos em outro lugar.
Vamos lá, siga-nos, e mostraremos
todas as novidades ao longo
do caminho.
1
conhecendo a HTML5
Bem-vindo a Webville
A HTML tem estado em uma corrida
louca.
É claro, começou como uma simples
linguagem de marcação, porém, mais recentemente,
tem desenvolvido mais músculos. Agora, temos uma
linguagem ajustada para criar verdadeiros aplicativos
web com armazenamento local, desenho 2D, suporte
offline, sockets, threads e mais. A história da HTML
nem sempre foi bela e é cheia de dramas (falaremos
sobre isso tudo), mas, neste capítulo, primeiro daremos
uma pequena volta por Webville para ter uma ideia de
tudo o que se relaciona com “HTML5”. Vamos lá, suba,
estamos indo para Webville, e começaremos indo de
zero a HTML5 em 3,8 páginas.
Atenção: A XHTML
recebeu uma carta de
despedida em 2009
e a visitaremos mais
tarde no segmento
“Onde eles estão agora”.
PFCG_HeadFirstHTML5Prog.indb 1 05/06/2014 16:17:05
como c funciona
2
Capítulo 1
Atualize para HTML5 hoje!
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Head First Lounge</title>
<link type="text/css" rel="stylesheet" href="lounge.css">
<script type="text/javascript" src="lounge.js"></script>
</head>
<body>
<h1>Welcome to Head First Lounge</h1>
<p>
<img src="drinks.gif" alt="Drinks">
</p>
<p>
Join us any evening for refreshing <a href="elixirs.html">elixirs</a>,
conversation and maybe a game or two of Tap Tap Revolution.
Wireless access is always provided; BYOWS (Bring Your Own Web Server).
</p>
</body>
</html>
Vá agora mesmo! Por tempo limitado, pegaremos
aquela sua página HTML velha e molambenta e, em
apenas
três etapas simples
, a atualizaremos
para HTML5.
Pode mesmo ser assim tão fácil?
Pode apostar; na verdade, já temos uma demonstração
preparada para você.
Veja esta HTML cansada, gasta e que já teve dias
melhores; nós a transformaremos em HTML5 bem na
frente dos seus olhos:
Isto tudo é HTML 4.01 normal da
Head First Lounge, que você talvez
se lembre (se não lembrar, não se
preocupe, você não precisa lembrar).
Atualize para HTML5 hoje!
Por que esperar?
Use o meu
HTML5-o-mático
e faça isso em
apenas
três etapas simples
Veja o quão fácil é escrever HTML5
Comece revisando este HTML, que está escrito em HTML 4.01 (a versão anterior a
HTML5). Examine com atenção cada linha e refresque sua memória sobre o que cada
parte faz. Sinta-se à vontade para fazer anotações na página. Veremos como passar
isso para HTML5 nas próximas páginas.
PFCG_HeadFirstHTML5Prog.indb 2 05/06/2014 16:17:09
conhecendo a HTML5
você está aqui
3
Após examinar com cuidado a HTML da página 2, você
consegue ver alguma marcação que possa mudar com
HTML5? Ou que você gostaria que mudasse? Apontaremos
uma para você: a definição doctype:
Lembre-se de que a definição doctype deve ficar no topo do seu arquivo HTML e
informa ao navegador o tipo do seu documento; neste caso, HTML 4.01. Usando um
doctype, o navegador consegue ser mais preciso no modo como interpreta e renderiza
suas páginas, portanto, ele é altamente recomendável.
Então, usando seus poderes de dedução, como você acha que a definição de doctype
para HTML5 se parecerá? Escreva aqui (você pode voltar para ver sua resposta em um
segundo após abordarmos esse assunto):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Sua resposta vai aqui.
Esta parte diz que estamos usando
a versão 4.01 de HTML e que esta
marcação está escrita em Inglês.
Isto só significa
que este padrão
está disponível
publicamente.
Isto aponta para um arquivo
que identifica este padrão.
Este é o doctype para “html”,
estamos no lugar certo!
PFCG_HeadFirstHTML5Prog.indb 3 05/06/2014 16:17:09
Get Use A Cabeça! Programação Em HTML5 now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.