Fundamentos Básicos de HTML

HTML - hypertext markup language - É uma linguagem simples composta de marcações de formatação e diagramação de hipertexto/hipermídia (informações em texto, imagens, sons e ações ligadas umas às outras de uma forma complexa e não-sequencial através de chaves relacionadas).

É a linguagem da WWW (World Wide Web), justamente por essa capacidade de formatação e diagramação de hipertexto/hipermídia. Atualmente existem muitas outras linguagens utilizadas concorrentemente com o HTML (Java, ActiveX, etc...) mas a base da WWW ainda é , de longe, o HTML, que é interpretada por todos os navegadores (browsers) disponíveis (Netscape, Internet Explorer, Mosaic, etc...).

O documento em HTML é um arquivo texto comum (ASCII) que pode ser escrito através de qualquer editor de textos comum (Edit, E , Norton Editor, notepad, ...) e tem a terminação .htm ou .html .

Como é uma linguagem interpretada, a partir do momento em que se salvou o arquivo HTML o mesmo já pode ser aberto por qualquer navegador, que é o único software que pode determinar se o documento foi escrito dentro dos padrões da linguagem.

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: <BR> é interpretado como uma quebra de linha. <NHAC>, é 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

<Elemento> Texto marcado por Elemento </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:

<BODY BACKGROUND="backgrounds/papel-de-parede.gif">... corpo do documento ... </BODY>
define uma imagem de fundo, disposta em mosaico, para a página.

<table border> ... conteúdo e rótulos de tabela ... </table>
define uma borda para a tabela.

<hr noshadow width=50% size=10 align=left>
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 <PRE>) é ignorada. Espaços extras, tabulações, retornos, novas-linhas, etc. não são considerados.

Também não importa se são utilizadas letras maiúsculas ou minúsculas para definir o rótulo, ou seja, tanto faz <BODY>, <body>, <Body> ou <bOdY>. Esta regra não vale, porém, para as URLs que podem ser referenciadas (entre aspas, geralmente) por atributos dentro dos rótulos.

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

<!DOCTYPE HTML Public "-//IETF//DTD HTML//EN" -->
<HTML>
        <HEAD>
                <TITLE> Descrição do documento </TITLE>
                [elementos opcionais]
        </HEAD>
        <BODY>
                [texto e elementos HTML]
        </BODY>
</HTML>

A primeira linha: <!DOCTYPE HTML Public "-//IETF//DTD HTML//EN" --> é 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 <HTML>...</HTML>HTML>...</HTML> marca o início e o final do documento HTML. Deve conter duas sub-estruturas distintas: o cabeçalho, delimitado por <HEAD>e </HEAD>, e o corpo do documento, entre os rótulos <BODY> e </BODY>.

O bloco do cabeçalho, marcado por <HEAD> e </HEAD> 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.

<TITLE> é o único elemento obrigatório do bloco do cabeçalho. Deve conter o título do documento que aparece geralmente, fora da página, na barra de título do browser. 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:

<TITLE>Tutorial sobre HTML: Introducao</TITLE>

enquanto que os dois seguintes são títulos ruins:

<TITLE>Introducao</TITLE>

O bloco marcado por <BODY> e </BODY> 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 <BODY> (com exceção de <TITLE>, descrito acima, que fica em <HEAD>).