O documento apresenta um curso sobre desenvolvimento web com HTML e XHTML. Ele discute o propósito do HTML, sintaxe do XHTML, semântica, hierarquia de tags, formulários, layouts e novas tags em HTML5.

1. Desenvolvimento web I
(X)HTML
CURSO DE EXTENSÃO 2012
IST-PETRÓPOLIS
L U I Z PA U L O - L P PJ U N I O R @ G M A I L . C O M

2. Vida de programador
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

3. Índice
 Recaptulando
 Para que serve o HTML?
 XHTML sintaxe
 Semântica
 Hierarquia do HTML
 Tags, tags e mais tags
 Formulários
 Methods
 Tamanho do GET
 Tags de formulários
 Estrutura Layouts
 Frames
 Tabelas
 Tableless
 HTML5
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

4. Recapitulando...
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

5. Para que serve mesmo o HTML?
INFORMAÇÃO
F O R M ATA Ç Ã O
C O M P O R TA M E N T O

6. XHTML - O que está errado?
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

7. E a Semântica?

8. Como está a semântica desse site?
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

9. Layout não diz nada de semântica!
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

10. Hierarquia das tags
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

11. Hierarquia das tags
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

12. Relembrou?
A G O R A V A M O S A L U TA . . .
CONTEÚDO NOVO COM FORÇA!

13. Links, imgs
 a href=“link”
 a href=“mailto:”
 a name=“NAME”
 a href=“#NAME”
 img src=“”
 object
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

14. Tags, tags e mais tags
 meta, script, noscript, style, link
 object, param, map , area
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

15. Formulários HTML
 Para que servem
 Como funcionam (cliente x servidor)
 Métodos de envio (get, post, etc)
 Limitação do método get
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

16. Tamanho máximo URL (em caracteres)
 IE – 2048
 FF – 65536
 Safari – 80000
 Opera – 190000
 Apache – 4000
 IIS – 16384
 Perl HTTP – 16384
 http://www.boutell.com/newfaq/misc/urllength.html
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

17. Tags, tags e mais tags
 form, fieldset, legend, label, input (button, submit, reset,
text, password, checkbox, radio), select, option,
optiongroup, textarea
 meta, script, noscript, style, link
 object, param
 map , area
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

18. Estrutura de layout
ANTIGAMENTE...

19. Frames
 <frameset rows=85,* cols=85,*>
<frame src="top_left.html" name="Large">
<frame src="top_right.htm" name="Navbar">
<frame src="bottom_left.html" name="Navbar2">
<frame src="bottom_right.html" name="Navbar2">
</frameset>
<noframes>
- This is seen because the frames aren’t browser
compatible. -
</noframes>
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

20. Frames
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

21. Table
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

22. Mas isso acabou, ainda bem! (ou não rs)
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

23. Estrutura de layout
TA B L E L E S S

24. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

25. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

26. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

27. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

28. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

29. Tableless - CSSZenGarden
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

30. HTML
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

31. HTML5
Ist-Petrópolis - RJ [ Desenvolvimento web ] Luiz Paulo [ lppjunior@gmail.com ]

32. Dúvidas?
L U I Z PA U L O
L P PJ U N I O R . C O M
L P PJ U N I O R @ G M A I L . C O M