Linguagens de Programação

Um dos objectivos principais do HTML era ser independente da plataforma. Isto é, para ser usado numa variedade de sistemas de computador sem mudanças. Foi desenvolvido para descrever a estructura do documento, em vez de apresentação do documento em si. Assim, os elementos básicos do HTML especificam coisas como títulos e parágrafos, mas não marges e fontes. Foi deixado para o browser, em qualquer sistema especifico, a tarefa de tratar da apresentação do documento da maneira como desenhado.

Isto era apropriado para o público alvo inicial - cientistas e investigadores - mais interessados no conteúdo da página do que na sua aparência. O conceito de WWW tornou-se rapidamente popular e atraíu a atenção do sector comercial. E no mundo comercial, a imagem é muito importante. Mas o HTML original tinha um suporte reduzido para apresentações muito elaboradas, o que criou a necessidade de novas extensões. Vários programadores de browsers introduziram novos elementos HTML orientados para apresentações gráficas (a Netscape é um exemplo) e alguns foram a adoptados e utilizados nas propostas de criação de standards para o HTML.

A colocação de apresentações directamente nos documentos vai contra o objectivo inicial do HTML, e torna díficil mudar a apresentação mais tarde. A solução correcta, chamada style sheets, era conhecida desde antes do ínicio do projecto WWW. Pouco depois da sua formação em 94, o W3C publicou a primeira proposta concreta, e implementações antecipadas foram pioneiras pela Arena e browsers emacs-w3 no ínicio de 95. IIRC, Navipress, Panorama, e talvez mais algumas ferramentas comerciais de browser/editor também tiveram algum suporte para style sheet à volta do mesmo tempo. O primeiro browser de "mercado de massas" a adoptar os style sheet foi o MSIE, cerca de um ano mais tarde.

Elementos, Tags e Atributos

As Tags especificam elementos estruturadores, como headings:

<h2> Tags e atributos </h2>

As Tags começam com < e acabam com >. A primeira palavra entre os dois sinais é o nome da tag. As palavras e carácteres que venham depois são os atributos , ex. align=right.

A Tag é assim o item básico, e o atributo é um detalhe extra tal como o ajustar o conteúdo. Um elemento tem três partes: a tag de ínicio, o conteúdo e a tag do fim. A maioria das tags possui 'tags que fecham' tais como <h2> que marcam o sítio onde o efeito da tag já aberta deve acabar.

As Tags não se importam com o tamnho de letra, podendo ser em letras pequenas, grandes ou qualquer mistura. Uma convenção comum é escrevê-las com maiúsculas para as evidenciar do resto do documento. Nos documentos HTML podemos usar espaços e letras maiúsculas à nossa vontade, e partir linhas em qualquer parte. Espaçoes em branco e quebras de linha não vão afectar a aparência do documento num browser excepto quando usados dentro de algumas Tags especiais.

Algumas pessoas acham que o HTML pode ser díficil de ler. Isto não precisa de ser necessariamente assim, se a escrita estiver "arrumada". Os browsers permitem uma grande flexibilidade no que diz respeito às Tags que o utilizador precisa de colocar na sua página de rede.

Estrutura do Documento

Um documento de HTML consiste em duas partes principais: a Cabeça (Head) e o corpo (Body). A estrutura básica é:

<HTML>
</Head>
<Body> ... </Body>
</HTML>

A Head contém informação sobre o documento, como links para páginas de que se pode fazer load.O elemento principal da Head de que se precisa de ter conhecimento é a Tag <Title>. Cada documento deve ter um título- ele aparece como rótulo na janela do browser. Deve-se tomar cuidado para que o título seja bom e faça sentido. "Introdução" não será grande ajuda se o utilizador não se conseguir lembrar o que está a ser apresentado. Outra Tag de Head util é a <Meta> Tag se quisermos optimisar a nossa página para motores de busca. Eis aqui um documento HTML um pouco mais realista:

<HTML>
<Head>
<Title>Um Documento Simples</Title>
<Meta Name = "Keywords"
Content = "Hypertext">
</Head>
<Body>
...Esta treta é o que o utilizador vê ...
</Body>
</HTML>

Os numeros e os dois pontos não devem fazer parte do ficheiro de HTML, mas servem para associar os seguintes comentários/explicações com as linhas em cima e fazem parte da lista usada para ordenar estes segmentos de texto

Declara o documento como sendo um documento de HTML
A Head contém Items que são sobre o documento
O título usado na barra de título do browser, hotlists, listas, etc.
Tags de Meta podem ser usadas para adicionar informação que ainda não foi especificada no sistema HTML/HTTP.
Alguns motores de busca fazem uso de Keywords, bem como aquelas no Body
Fecha a Head
O Body contém o contéudo do documento exibido
Comandos do texto. Ver a fonte (Source) do documento para exemplos
Fecha o Body
Fecha o HTML

O HTML também suporta formas interactivas, "hotspots" em figuras, escolhas e estilos de formatação mais versáteis, e listas formatadas, bem como muitos outros melhoramentos, tais como um correio URL, para que os Hyperlinks possam ser usados para mandar e-mails mecânicamente. Por exemplo, escolher um endereço de e-mail numa parte de hypertexto abre uma aplicação de mail, pronto para enviar uma mensagem para esse endereço. Agora vamos para Tags do Body. É ai que está a acção...

Headers

A linha exactamente em cima, o título, é uma header, isto é, um título para uma nova secção do documento. Existem 6 Headers: H1, H2, H3, H4, H5 e H6. H1 é o titulo príncipal, normalmente usado no topo do documento. H6 é o Header mais pequeno e é usado muito raramente, embora seja usado abusivamente para fazer pequeno texto bold.

Uma das filosofias sobre o HTML foi que devia ser designado para ferramentas de software para extrair informação util de documentos HTML. As Tags de Header eram supostas ser uteis para gerar uma tabela de conteúdos.

Links

A caracteristica principal do WWW que o torna tão poderoso é obviamente os links de hypertexto. A Tag que cria esses links é chamada Tag Ancôra. Tem um atributo usualmente usado: o HREF, que especifica o URL do documento alvo

Imagens

As imagens fizeram uma profunda diferença na maneira como a Web se apresenta. Provavelmente não haveria a incrivel explosão de interesse na web se não se podessem inserir imagens

<Img src ="/Icons/graphics.gif">

O exemplo de cima mostra a maneira mais simples de fazer uma imagem inline. Podemos coloca-la dentro de Tags Ancora e então será uma imagem clicável:

<a href = "../../Graphics/">
<img src = "/Icons/graphics.gif"></a>

Mas é uma boa ideia especificar as dimensões da imagem (permite ao browser mostrar a página mais depressa) e o que fazer se o browser não tiver suporte para a imagem ou se o utilizador têm o loading da imagem desligado.

<a href = "../../Graphics/">
<Img src = "/Icons/graphics.gif
width = 108
height = 44
border = 0
hspace = 16
alt = "Graphics"
align = left
></a>

Estilos de caracteres

Vamos ver como emphasise o texto

Vamos ver como <em>emphasise</em> o texto...

Em é chamado um estilo lógico: o utilizador esecifica o que ele está a tentar fazer, mais do que como fazê-lo. Outro estilo é o STRONG

Outro estilo é o <strong>STRONG</strong>

Emphasis normalmente é indicado em itálico

Strong é normalmente indicado em bold

E se quisermos que alguma coisa apareça exactamente como a escrevemos, usamos o PRE.

Notar que as Tags HTML ainda estão dentro de PRE. Se quisermos usar usar sinais de maior ou igual ou Tags HTML então podemos escrever £1t; for <e escrever £gt; for*>; ou tentar a Tag XMP que renderiza tudo literalmente até que se feche a Tag.

Parágrafos e quebras de linhas

Como mencionado em cima, espaços em branco e quebras de linha são ignoradas pelo browser excepto quando dentro de Tags especiais. Temos então que nos servir de Tags para o indicar. Se quisermos uma quebra de linha usamos <br> e se quisermos uma quebra de paragrafo (quebra de linha e depois uma linha vazia entre parágrafos) usamos <p>. A Tag de paragrafo tem uma Tag opcional de fecho </p>

página principal

Votações