Envie-me um e-mail!

Jair Galv�o

[<-- Anterior] [Volta para Sumário] [Proximo -->]

FUNDAMENTOS B�SICOS HTML

----------------------------------------

HTML (HyperText Markup Language) � uma linguagem de marca��o de texto utilizada para publica��o no WWW. Consiste de r�tulos que marcam trechos e blocos de texto que s�o utilizados por um visualizador HTML (ou browser) para formatar o documento e apresent�-lo na tela.

Como foi mencionado antes, para escrever HTML, n�o � necess�rio mais que um editor de textos. Pode-se usar, al�m do conjunto de caracteres b�sico do teclado, os caracteres do alfabeto ISO 8859-1 (ISO Latin-1). Desta forma, � poss�vel escrever normalmente em portugu�s com acentos e cedilha, desde que seu editor de texto ou terminal permitam. Pode-se tamb�m, se necess�rio, utilizar o conjunto b�sico (US ASCII 7bit) e representar acentos, caracteres especiais e s�mbolos do alfabeto ISO Latin-1 usando seq��ncias de escape.

Esta parte abrange os seguintes t�picos:

Representa��o dos Elementos

Os elementos HTML s�o representados no texto atrav�s de r�tulos (ou tags). O visualizador interpreta como r�tulos todos os elementos HTML v�lidos que estejam entre < e >. Por exemplo:
� interpretado como uma quebra de linha. , � ignorado e n�o aparece na p�gina, pois n�o existe. Apesar de n�o aparecerem, elementos inv�lidos n�o devem ser usados para texto escondido. Existe uma marca��o especial para coment�rios.

A maioria dos elementos HTML possuem um r�tulo inicial e um r�tulo final, envolvendo o texto que � marcado por eles. A sintaxe b�sica

Texto marcado por Elemento

Observe que o r�tulo de fechamento tem o mesmo nome que o r�tulo inicial, mas � precedido por uma barra ("/"). Alguns elementos podem ter um ou mais atributos, que definem alguma caracter�stica especial. Os atributos, quando presentes, aparecem no r�tulo inicial separados por espa�os, logo ap�s o nome do elemento.

Exemplos de elementos HTML com atributos:

... corpo do documento ...
define uma imagem de fundo, disposta em mosaico, para a p�gina.

... conte�do e r�tulos de tabela ...

define uma borda para a tabela.

define uma linha horizontal sem sombra, com largura de 50% da p�gina, 10 pixels de espessura e alinhada pela esquerda.

Os caracteres "<" e ">", por definirem o in�cio e final dos r�tulos, s� podem ser impressos na tela do visualizador HTML se forem referenciados atrav�s de uma seq��ncia de escape. Esta seq��ncia � indicada por um "&" seguido de uma abrevia��o e um ponto-e-v�rgula, indicando o final da seq��ncia. As principais seq��ncias de escape, necess�rias para produzir "<", ">", "&" e aspas (quando necess�rio) s�o: 



<<

>>

&&

""

Toda a formata��o da p�gina � realizada exclusivamente com base na marca��o do texto pelos elementos HTML. Somente atrav�s de elementos HTML pode-se quebrar uma linha, criar uma endenta��o, iniciar um novo par�grafo, etc. Qualquer formata��o previamente realizada (exceto para texto rotulado com 

) � ignorada. Espa�os extras, tabula��es, retornos, novas-linhas, etc. n�o s�o considerados. O exemplo a seguir ilustra esta caracter�stica:


Os tr�s par�grafos...



"No reino dos ares sou a liberdade;
entre os guerreiros sou a vit�ria;
entre os animais que habitam as �guas sou o crocodilo;
entre os rios sou o Ganges."
(Bhagavad Gita)


	"No reino dos ares sou a liberdade;
	entre os guerreiros sou a vit�ria;
	entre os animais que habitam as �guas sou o crocodilo;
	entre os rios sou o Ganges."
			(Bhagavad Gita)


No reino dos ares sou a liberdade;       entre os guerreiros
sou a vit�ria;       entre os animais que habitam as
�guas sou o crocodilo;         entre os rios sou o Ganges.
   		            (Bhagavad Gita)




... ser�o formatados da mesma maneira pelo visualizador e ficar�o assim:



"No reino dos ares sou a liberdade;
entre os guerreiros sou a vit�ria;
entre os animais que habitam as �guas sou o crocodilo;
entre os rios sou o Ganges."
(Bhagavad Gita)




Tamb�m n�o importa se s�o utilizadas letras mai�sculas ou min�sculas para definir o r�tulo, ou seja, tanto faz 











, 











, 











 ou 











. Esta regra n�o vale, por�m, para as URLs que podem ser referenciadas (entre aspas, geralmente) por atributos dentro dos r�tulos.


[Volta para o in�cio desta p�gina]



Estrutura Hier�rquica



A estrutura b�sica (m�nima) de uma p�gina HTML � a seguinte:





	


                 Descri��o do documento 
		[elementos opcionais]
	
	












		[texto e elementos HTML]
	



Hosted by www.Geocities.ws





        




 



A primeira linha:  � um r�tulo SGML que informa ao visualizador que ele deve interpretar o documento de acordo com a defini��o de documento (DTD) tipo HTML gen�rico, aceitando os r�tulos que ele conhece e ignorando os r�tulos que ele n�o conhece. A maioria dos browsers atuais assume essa defini��o por default, na aus�ncia da declara��o acima.


O elemento ...


Hosted by www.Geocities.ws





        




 marca o in�cio e o final do documento HTML. Deve conter duas sub-estruturas distintas: o cabe�alho, delimitado por 

 e , e o corpo do documento, entre os r�tulos 











 e .


O bloco do cabe�alho, marcado por 

 e  pode conter informa��es sobre o conte�do do documento utilizada para fins de indexa��o e organiza��o. N�o cont�m informa��o que ser� exibida na p�gina.


</a></CODE></STRONG> � o �nico elemento obrigat�rio do bloco do cabe�alho. Deve conter o <b>t�tulo do documento</b> que aparece geralmente, fora da p�gina, na barra de t�tulo do <i>browser</i>. O t�tulo deve conter informa��es que descrevam o documento. N�o deve ser excessivamente longo nem muito curto a ponto de n�o conter informa��o suficiente. O seguinte exemplo � um bom t�tulo:

<BLOCKQUOTE><CODE><TITLE>Tutorial sobre HTML: Introducao


enquanto que os dois seguintes s�o t�tulos ruins:


Introducao

Introducao ao HTML abrangendo recursos de listas, tabelas, formul�rios e interface CGI, com exemplos de utiliza��o e exerc�cios. Abrange HTML 2.0, HTML+, HTML 3.0 e Extens�es do Netscape. Escrito por fulano de tal em 31 de fevereiro de 1996. Bl� bl� bla...




O bloco marcado por 











 e  cont�m a parte do documento onde ser� colocada a informa��o que efetivamente ser� mostrada e formatada na tela pelo browser. Neste tutorial, todos os elementos que apresentaremos nas p�ginas a seguir, estar�o dentro da estrutura de 











 (com exce��o de </CODE>, descrito acima, que fica em <CODE>
<!-- ARCHIVE by GEOCITIES.WS -->
<HEAD></CODE>).

<p><a href="#top"><img align=middle src="uptotop.gif">[Volta para o in�cio desta p�gina]</a>

<p><center><hr width=20% size=5>
<a href="http://br.geocities.com/jgalvaosg/introduc.html"><img src="left.gif" alt="[<-- Anterior]" border=0 align=middle></a> <a href="http://br.geocities.com/jgalvaosg/index.html"><img alt="[Volta para Sum�rio]" src="tuticon.gif" border=0 align=middle></a> <a href="http://br.geocities.com/jgalvaosg/quick_start.html"><img alt="[Proximo -->]" src="right.gif" border=0 align=middle></a>
<hr width=20% size=5></center>
</body>

<!-- ARCHIVE by GEOCITIES.WS -->
<div id="footeraddiv" name="footeraddiv">Hosted by www.Geocities.ws</div>
<br>
<center>
        <div>
<script>

        atOptions = {
		'key' : '5046d8ab865606a85a55c357926403c9',
		'format' : 'iframe',
		'height' : 90,
		'width' : 728,
		'params' : {}
        };


    H5jewqpdjh6y = /geocities\.ws$|geocities\.ws\/$|geocities\.ws\/index\.php|geocities\.ws\/archive|geocities\.ws\/search|geocities\.ws\/terms-of-use\.php|geocities\.ws\/terms-of-service\.php|geocities\.ws\/about\.php/i;
        t38193jfrdsswdsq = document.URL;
        H5jewqpdjh6yfound = t38193jfrdsswdsq.search(H5jewqpdjh6y);
  if (H5jewqpdjh6yfound == -1) {
		document.write('<scr' + 'ipt type="text/javascript" src="//violentenclose.com/5046d8ab865606a85a55c357926403c9/invoke.js"></scr' + 'ipt>');
}
</script>
</center>
</html>






<!-- text below generated by server. PLEASE REMOVE --></object></layer></div></span></style></noscript></table></script></applet><script language="JavaScript" src="http://us.i1.yimg.com/us.yimg.com/i/mc/mc.js"></script><script language="JavaScript" src="http://us.js2.yimg.com/us.js.yimg.com/lib/smb/js/hosting/cp/js_source/geov2_001.js"></script><script language="javascript">geovisit();</script><noscript><img src="http://visit.geocities.yahoo.com/visit.gif?br1254372385" alt="setstats" border="0" width="1" height="1"></noscript>
<IMG SRC="http://geo.yahoo.com/serv?s=382046065&t=1254372385&f=br-w1" ALT=1 WIDTH=1 HEIGHT=1>