Tutorias

Welcome Guest

Search:


HTML BÁSICO

por: admin
Total visitas: 1128
Palavras: 1272

A Internet é, sem sombra de dúvida, o lugar mais quente da actualidade, onde os internautas passam a maior parte do tempo, e onde proliferam home pages de universidades, empresas, tendências, jornais, lojas e tudo o mais que se possa imaginar.

Até à pouco tempo, atingir o grande público era privilégio de poucos. Com a WWW, tudo fica diferente; coloque uma home page no ar, mande um e-mail para algumas pessoas, e saiba que, se o conteúdo for bom, a sua página será visitada e divulgada para outras pessoas.

Para colocar uma página no ar, duas coisas: fazer a Home Page e conseguir um espaço em disco em uma máquina conectada permanentemente na Internet.

Agora você conhecerá o básico da linguagem HTML, utilizada para se construírem páginas Web.

Para fazer Home Pages, você terá que aprender pelo menos um pouco de HTML (Hipertext Markup Language) que pode ser traduzido como Linguagem de Hipertexto baseada em Marcas.

Apesar da palavra linguagem, que leva a associação com linguagens de programação, ao final deste curso você vai perceber que gerar documentos HTML é bastante fácil e parecido com formatação de textos.

Para que qualquer computador pudesse entender os documentos HTML, sem as complicações que trazem os caracteres de controles e coisa do tipo, foi definido que estes documentos deveriam ser gerados no formato mais simples possível, o bom e velho “txt”.

Desta forma, documentos HTML podem ser gerados por qualquer editor de textos, desde que gravados no formato texto e com extensão. Htm ou .html.

Como se cria um documento HTML

 

Uma página Web é composta de textos e comandos especiais (tags). Assim como qualquer linguagem, o programador deve escrever o código-fonte seguindo as regras da linguagem. Esse código-fonte é posteriormente interpretado pelo browser, que se encarregará de executar os comandos (tags) do código para formatar e ver recursos da Web.

O código fonte pode ser escrito usando-se o mais simples dos editores de texto. Até o programa Bloco de Notas pode ser usado para esta tarefa. Mas existem editores WYSIWYG (What you see is what you get, ou o que você vê é o que realmente obtém) como exemplo podemos citar o Microsoft FrontPage, DreamWeaver.

Existem ainda editores não WYSIWIG, onde você tem que construir o código, mas ele completa muitos comando, como exemplo podemos citar o Arachnophilia e o AceExpert, e na própria Internet existem vários destes editores gratuitos.

tags ou comandos HTML

 

As TAGS normalmente são especificadas em pares, delimitando um texto que sofrerá algum tipo de formatação.

As TAGS são identificadas pelo sinais < > ou </ >.

Entre os sinais <> são especificados os comandos propriamente ditos. No caso de tags que necessitam envolver um texto, sua finalização deve ser feita usando-se a barra de divisão / , indicando que a TAG está finalizando a marcação de texto.

Os principais elementos de página HTML são, títulos, textos, parágrafos, imagens e links, responsáveis pela chamada de outras páginas para a tela:

 

1.   Título: É o texto que aparece na barra de título do browser.

2.   Imagem: São figuras, desenhos e fotos usados para ilustrar a página.

3.   Texto: É a informação mais comum dentro de uma página. Pode ser formatado através de comandos.

4.   Link: É um trecho que aparece destacado do restante do texto, normalmente sublinhado e com outra cor. Ao clicar no Link, o browser acessa outra região da página actual ou uma página localizada em qualquer lugar na Internet. Uma figura também pode ser usada como link, ou seja, clicando na figura saltamos para outro local.

5.   Cabeçalho: São linhas de texto com tamanhos especiais. Existem seis tamanhos de cabeçalhos.


 

Estrutura Básica

 

A estrutura básica de um documento HTML é a seguinte:

 

<HTML>

<HEAD>

<TITLE> Título do Documento</TITLE>

</HEAD>

<BODY> Aqui deverá ser digitado e criado a maioria dos itens que irão aparecer em sua Home Page

</BODY>

</HTML>

 

Vamos ver um pouco sobre os elementos básicos do HTML:

<HTML></HTML>: Indicam respectivamente o início e o fim do documento. Todo o resto deve estar entre estas marcas.

<HEAD></HEAD>: Delimitam a secção de cabeçalho do documento. Trata-se da primeira secção do documento.

<TITLE></TITLE>: Indicam o título do documento, que será apresentado na barra superior do browser. Estas marcas devem constar da secção de cabeçalho.

<BODY></BODY>: Corpo do documento. Entre estas marcas estará o conteúdo a ser apresentado, textos, cores, imagens, etc. Este elemento pode conter cinco parâmetros opcionais:

·       BACKGROUND: configura especificar uma imagem como fundo da página. EX. <BODY BACKGROUND= “fundo.gif” > configura uma página com a imagem fundo.gif como fundo.

·       BGCOLOR: Configura a cor de fundo da página. EX: <BODY BGCOLOR= “White” > configura uma página com fundo branco (padrão).

·       TEXT: configura a cor padrão do texto da página. EX: <BODY TEXT= “Black” > configura uma página com texto em cor preta. (padrão).

·       LINK, ALINK, VLINK: configura as cores dos links da página. ALINK configura a cor do link ativo, isto é quando é clicado, e VLINK configura a cor de um link já visitado. EX: <BODY LINK=”Blue” VLINK=”Purple” ALINK=”Red”> configura uma página com links azuis, links activos vermelhos e links visitados roxos.

Esta estrutura inicial é simples, no entanto existem detalhes que devem ser respeitados:

Ø   Todas as marcas apresentadas são do tipo início-fim, ou seja, funcionam em pares.

Ø   Em cada documento HTML só deve haver uma marca de cada tipo acima.

Ø   Existe uma ordem sequencial lógica entre as marcas.

Estes detalhes devem ser respeitados, senão o browser não conseguirá apresentar o documento.

Como HTML não é uma linguagem de programação, você não será avisado de erros que tenha cometido na edição do seu documento.

Criando o primeiro documento HTML

 

<HTML>

<HEAD>

<TITLE>Este é o meu primeiro documento em HTML</TITLE>

</HEAD>

<BODY BGCOLOR=”Red” TEXT=”White”>

Agora no corpo do texto vou digitar o meu primeiro texto em Html, no momento não usarei nenhuma formatação especial aqui dentro.

</BODY>

</HTML>

 

Comentários

Podemos também acrescentar comentários ao nosso código HTML, estes comentários não aparecem para no navegado e somente no código, são representados pela seguinte TAG <!- - inicia o comentário  //- - >, finaliza o comentário.

São utilizados para ocultar scripts dentro do código Html, pois caso o script não possa ser processado o mesmo será ignorado pelo navegador.

Caracteres especiais

Existem caracteres que não podem ser obtidos através de teclado. Eles podem ser inseridos em sua página através da especificação de um código especial que o browser interpreta e substitui por um carácter específico. Esses códigos podem ser obtidos utilizando-se uma nomenclatura definida pela norma ISO.

Alguns dos símbolos mais utilizados no HTML é o &nbsp;            que corresponde ao espaço do teclado, já que na HTML ele considera apenas um espaço. Para uma tabela mais completa visite o link http://www.w3.org/TR/html401/sgml/entities.html

Sobre o Autor

Administração


Votação: 2.18

Comentários

Nenhum comentário adicionado.

Adicionar comentário

Não tem permissão para inserir comentários. Se fizer Log in, tem a possibilidade de comentar.