C U R S O D E E X T E N S Ã O 2 0 1 2I S T- P E T R Ó P O L I S

L U I Z PA U L O - L P PJ U N I O R @ G M A I L . C O M

Desenvolvimento web I( X ) H T M L

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

Vida de programador

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

Í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 ]

Recapitulando...

I N F O R M A Ç Ã OF O R M ATA Ç Ã O

C O M P O R TA M E N T O

Para que serve mesmo o HTML?

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

XHTML - O que está errado?

E a Semântica?

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

Como está a semântica desse site?

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

Layout não diz nada de semântica!

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

Hierarquia das tags

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

Hierarquia das tags

A G O R A VA M O S A L U TA . . .C O N T E Ú D O N O V O C O M F O R Ç A !

Relembrou?

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

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 ]

Tags, tags e mais tags

meta, script, noscript, style, linkobject, param, map , area

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

Formulários HTML

Para que servemComo 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 ]

Tamanho máximo URL (em caracteres)

IE – 2048FF – 65536Safari – 80000Opera – 190000

Apache – 4000IIS – 16384Perl HTTP – 16384

http://www.boutell.com/newfaq/misc/urllength.html

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

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, linkobject, parammap , area

A N T I G A M E N T E . . .

Estrutura de layout

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

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 ]

Frames

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

Table

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

Mas isso acabou, ainda bem! (ou não rs)

TA B L E L E S S

Estrutura de layout

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

Tableless - CSSZenGarden

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

Tableless - CSSZenGarden

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

Tableless - CSSZenGarden

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

Tableless - CSSZenGarden

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

Tableless - CSSZenGarden

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

Tableless - CSSZenGarden

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

HTML

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

HTML5

L U I Z PA U L OL 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

Dúvidas?