® InfoJur.ccj.ufsc.br

Aprenda o básico para criar sites

JOSÉ ANTONIO RAMALHO
especial para a Folha

A criação de home pages é uma tarefa que pode ser executada por qualquer internauta, iniciante ou experiente.
Uma home page é criada pelos comandos de uma linguagem chamada "HTML". Depois de aprender meia dúzia de comandos, o internauta já pode criar uma home page. Nesta semana, a Folha inicia um curso rápido de "HTML", com quatro lições. Vão mostrar as bases da linguagem "HTML". Os exemplos mostrados podem ser acessados no site www.ramalho.com.br/folha.htm.
Um programa "HTML" nada mais é do que um arquivo de texto, que pode ser gerado até pelo Bloco de Notas do "Windows", que contém os comandos da linguagem.
Esse arquivo deve possuir a extensão .htm, como menu.htm. Para criar e testar uma home page, o usuário precisa ter apenas um navegador instalado na máquina.
Não é preciso estar conectado à Internet. Uma página em "HTML" tem três elementos básicos: texto, hiperlinks e imagens.
A parte textual da home page é composta pelo texto acomodado em parágrafos, cabeçalhos e linhas divisórias. As imagens são fotos ou figuras gravadas nos formatos gráficos JPG ou Gif. Os hiperlinks são um tipo especial de texto que, ao ser clicado, instrui o navegador para abrir outra página ou imagem.

Estrutura do "HTML"
Todo programa "HTML" deve possuir obrigatoriamente alguns comandos que identificam aquele texto como uma home page para o navegador. Alguns comandos da linguagem são do tipo container ou envolventes. Eles precisam ser especificados duas vezes, abrindo e fechando uma área do programa.
O comando <HTML> deve ser o primeiro e o último comando do programa. Note que o comando que fecha possui uma barra </HTML>.
O comando <HEAD> </HEAD> é opcional, mas deve ser incluído, pois é usado para especificar diversas características da página. O comando <TITLE> </TITLE> exibe o texto que envolve na barra de título do navegador. O par <BODY> </BODY> envolve todos os comandos que são efetivamente responsáveis pela formatação da página.
Abaixo segue a ordem de comandos obrigatórios para a estrutura de uma home page:
<HTML>
<HEAD>
<TITLE>Nome</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Depois de digitar os comandos acima, o usuário deve entrar com o texto que será exibido na página e os comandos especiais para formatar o texto ou inserir imagens e links. Esses novos comandos devem ser digitados entre os comandos <BODY> </BODY>.
Usando o Bloco de Notas do "Windows", você deve digitar o texto normalmente. Contudo é importante lembrar que o navegador só entenderá que você terminou um parágrafo se digitar um comando <P>, que irá deixar uma linha em branco.
O comando <BR> também pode ser usado para iniciar uma nova linha. De nada adianta pressionar a tecla Enter no fim de um parágrafo. O navegador não entende esse comando.

Cabeçalhos
Para dividir uma seção da página, use o comando <HR>, que insere no local uma linha divisória que toma toda a largura da tela.
A linguagem "HTML" possui seis tamanhos diferentes de cabeçalhos. O texto de um cabeçalho ou subtítulo deve ser especificado dentro do comando <Hx> </Hx>, em que x é um número que pode variar de 1 (o maior tamanho) até 6 (o menor). Exemplo: <H1>A Grécia</H1>. O browser automaticamente embute uma linha em branco após o cabeçalho.
Para alterar o tamanho ou a cor de um texto, use o comando <FONT /SIZE=x COLOR=cor> texto</FONT>, em que x é um número de 1 (o menor) a 7 (o maior tamanho que é aplicado ao texto envolvido pelo comando). O parâmetro color= é opcional e pode ser usado para especificar uma cor diferente.
Podem ser usados nomes de cores ou códigos. Exemplo: blue, yellow, green, white etc.
Para inserir uma imagem, use o comando <IMG SRC="nome">, em que nome deve ser substituído pelo nome do arquivo de imagem. Exemplo: foto.gif, toto.jpg. A imagem é sempre exibida no local onde o comando foi inserido.
Se for colocada no meio de um texto, a imagem aparecerá no meio da linha, envolvida por ele. Pode-se, contudo, alinhar a imagem pelo parâmetro Align. Exemplo: <IMG SRC="acro.jpg"> <align=left>.
O parâmetro Align aceita os valores left, right e center para exibir a imagem à esquerda, à direita ou centralizada na linha onde foi colocada.

Links
Um link é criado pelo comando <A HREF="endereço">Texto</A>, em que endereço é o endereço da Internet no estilo www. NomeDoSite.com.br ou o nome do arquivo que será chamado. Texto é o texto que servirá como link e que aparece na cor azul e sublinhado.
No exemplo da semana, os links são <A HREF="lk01a016.jpg">Paternon</A> para chamar uma imagem.
E <A HREF="excp072a.htm">Atena Nike</A> para chamar uma outra home page.
Um tipo especial de link permite ativar o programa de e-mail automaticamente. Basta especificar, no lugar do endereço, mailto: seguido do endereço eletrônico. Exemplo: <A HREF="mailto:duvida@ramalho.com.br">Dê sua opinião</A>.
Somente com esses comandos já é possível criar uma home page. Nas próximas edições, a Folha trará mais detalhes desses comandos, além de novos tópicos, como criar tabelas e listas e inserir som em uma página.
Para ver o código-fonte do exemplo, entre em www.ramalho.com.br/folha e clique no menu Exibir, Código Fonte, no "Internet Explorer". No "Navigator", clique no menu View e PageSource.



 

Extraido do site: http://www.ramalho.com.br/htmtut01.htm - jul/99