Você está na página 1de 5

Objetivos da Aula 1. Ferramentas necessrias; 2. O que HTML? 3. O que so tags HTML? 4. Criando seu primeiro Website; 5.

. Outras tags HTML; 6. Atributos das tags HTML; 7. Criando links; 8. Exerccios. Criar um site no to difcil quanto parece; necessrio ter disciplina e estar atento aos conceitos abordados e suas formas de aplicao;

Ferramentas Necessrias Utilizaremos o notepad, tendo em vista que um programa encontrado em qualquer equipamento; O que almeja-se agora simplicidade, pois se aprendermos a criar um website (mesmo que simples) no notepad, posteriormente poderar-se- utilizar qualquer outra ferramenta mais robusta (Frontpage, Dreamweaver etc.); Outros editores que podem ser utilizados so: Pico (Linux) ou TextEdit (Mac); Outro programa que ser necessrio o browser; Pode-se utilizar qualquer um: Firefox; Internet Explorer; Opera; etc.

O que HTML? Lngua me do navegador; HTML uma linguagem que possibilita apresentar informaes na Internet; Quando abre-se uma pgina na Internet, v-se a

interpretao que seu navegador faz do HTML;

Existem diversas linguagens para construo de Websites: PHP, ASP, Java, Coldfusion etc. Porm, o HTML a base para todas, ou seja, de nada adianta utilizar umas dessas linguagens citadas se no conhecermos o HTML;

Tags so rtulos usados para informar ao navegador como deve ser apresentado o website. Todas as tags tm o mesmo formato: comeam com um sinal de menor "<" e acabam com um sinal de maior ">". Genericamente falando, existem dois tipos de tags tags de abertura: <comando> e tags de fechamento: </comando>. A diferena entre elas que na tag de fechamento existe um barra "/".

Tudo que estiver contido entre uma tag de abertura e uma tag de fechamento ser processado segundo o comando contido na tag. Existe uma uma exceo exceo:: para para algumas algumas tags tags aa abertura abertura e o fechamento se d na mesma tag. Tais tags contm comandos que no necessitam de um contedo para serem processados, isto , so tags de comandos isolados, por exemplo, um pulo de linha conseguido com a tag <br /> ou rgua <hr />.

A seguir veremos alguns exemplos; Para testar seus exemplos deve-se salvar o arquivo (notepad) com a extenso .html Posteriormente deve-se: Abrir o Navegador;

Clicar em Arquivo (file) -> Abrir (open); Procurar o arquivo e abrir; Criar um texto negrito com as tags <b> e </b>; Criar um texto em itlico com as tags <i> e </i>; Vamos colocar entre esses textos a tag <br />; <b>Aqui tem um texto em negrito</b><br /> <i>Aqui tem um texto em itlico</i>

As tags <h1>, <h2>, <h3>, <h4>, <h5> e <h6> informam ao navegador que trata-se de um cabealho (h vem de "heading" - cabealho ). Sendo <h1> o cabealho maior e o <h6> o cabealho menor; <h1>Aqui tem um texto em tamanho grande</h1><br /> <h3>Aqui tem um texto em tamanho mdio</h3><br /> <h6>Aqui tem um texto em tamanho pequeno</h6>

A estrutura HTML bsica composta das seguintes tags: <html> <head> A tag <html> indica o incio/fim do contedo do site; <head> A tag <head> indica o incio/fim do </head> <body>

</body> </html> A tag <head> indica o incio/fim do cabea do site. Fornece informaes sobre o site. Ex.: Onde fica o ttulo da pgina; A tag <body> indica o incio/fim do corpo do site. Todo o contedo do site fica entre essas tags.

Agora vamos criar uma pgina: Insira as tags bsicas do HTML; Insira o ttulo Minha primeira pgina na disciplina PW do site site entre entre asas tags tags <title> <title> ee </title> </title>;; Insira o contedo Voc est acessando a pgina do Fulano (colocar seu nome) entre as tags <p> e </p>; Salve a pgina (extenso .html) Abra a pgina pelo navegador web (vimos anteriormente);4. Criando seu primeiro Website Resultado: <html> <head> <title>Minha primeira pgina web na disciplina PW</title> Agora, teste no navegador!

Faa esse outro exemplo (Observe o que acontece): <html> <head>

<title>Meu website</title> </head> Agora, teste no navegador! <body> <h1>Um cabealho</h1> <p>texto, texto texto, texto</p> <h2>Subttulo</h2> <p>texto2, texto2 texto2, texto2</p> </body> </html>