Introdução ao HTML
Tim Berners-Lee, a culpa é toda dele. No começo dos anos 90, o dito cujo, inventou o HTML (HyperText Markup Language) que significa Linguagem de Marcação de Hipertexto. Ele queria facilitar a comunicação de suas pesquisas com seus colegas e acabou resolvendo o problema de todo mundo, nascia a web.
A idéia era simples e genial, era possível criar e disponibilizar um arquivo de texto simples com conteúdo HTML, via rede, para outro computador. No computador de destino, um software chamado web-browser (navegador web) era encarregado de exibir o conteúdo HTML. Não podemos esquecer de mencionar o protocolo HTTP (Hypertext Transfer Protocol, Protocolo de Transferência de Hipertexto) que também é invenção de Lee e é peça primordial da web.
A web teve um crescimento rápido. Nessa época, “nosso bebê”, já tinha pernas e músculos bem desenvolvidos e dava seus primeiros passos. Não demorou muito para surgirem empresas interessadas na tecnologia, como foi o caso da Netscape. Ela estava interessada no navegador web e criou um com o mesmo nome da empresa. A Microsof, apesar de atrasada, também queria sua fatia do mercado e lançou e destemido (ou talvez temido) Internet Explore, vulgo IE.
Essa passagem histórica ficou connhecida como “a guerra dos navegadores”, procure na web por esse termo. Nas Faculdades de tecnologia é muito comum exibirem um filme que deve ter o mesmo nome (não lembro bem). Vale apena assitir.
Essa fase definiu o que conhecemos hoje por Cross-browser, que nada mais é do que a habilidade de construir um site com suporte a vários navegadores, falaremos dele em breve, apenas adianto que dá para perder alguns cabelos.
HTML não é linguagem de programação mas sim uma linguagem de marcação.
Essa “marcação” consiste em determinar o que é cada parte do conteúdo. Um HTML dirá quais são os parágrafos, os títulos, as imagens, as tabelas, as listas, etc…
HTML, como dito, marca o conteúdo, ele faz isso através de suas etiquetas, ou melhor, através de suas tag’s.
Um arquivo HTML é composto de enúmeras tags.
Por exemplo, a tag p define um parágrafo, vejamos algumas tag’s bem conhecidas:
html- define o próprio documento HTML.head- define o cabeçalho do documento.titlte- define o título.body- define o corpo.h1- define o primeiro título.h2- define o segundo título.h3- define o terceiro título e assim até o h6.a- define uma âncora, quero dizer, o famoso link.img- define uma imagem
As tag’s devem ser abraçadas pelos sinais de maior e menor, dessa forma: <nome da tag>
Toda tag aberta deve ser fechada.
A barra para direita indica qual é a tag de fechamento, exemplo: <p>aqui é um parágrafo</p>.
Quem define a especificação do HTML e CSS?
O W3C é um consórcio que regulamenta as especificações tanto do HTML como do CSS, é a fonte oficial do HTML e CSS.
É possível encontrar as traduções das especificações para a língua portuguesa:
- Recomendações do W3C XHTML 1 - Tradução do Majour
- Recomendações do W3C CSS nível 1 - Tradução do Majour
Dois pequenos alertas:
- Estudar pela especificação é mais difícil (e mais chato também) e
- Nem todos os navegadores implementam as especificações em sua totalidade, isso significa que a especificação diz uma coisa e seu navegador comporta-se de outro, restando para o programador e/ou designer “se virar” para encontrar um solução.
HTML, DHTML , XHTML, HTML5… no final das contas é tudo HTML!
No início era apenas HTML, depois veio DHTML (o “d” era de Dynamic), depois o XHTML e hoje temos o HTML5. Sim, são coisas distintas umas das outras, mas em sua essência não passam de mero HTML.
Por simplificação, utilizaremos o termo HTML de forma gernérica e quando for necessário ser mais específico utilizaremos o termo correto.
O HTML5 é a versão mais atual do HTML. O grupo WHATWG não teve a mesma pasciência que o pesoal da W3C e saiu na frente com as especificações. A nova versão excluíu alguns elementos já defazados, inseriu alguns outros mais “semânticos” e trouxe novidades como videos, armazenamento local, canvas(uma prancheta para você desenhar via código), geo-location, web off-line, campos com autofoco, placeholders e muito mais. Se você é novato em HTML talvez não tenha entendido nada do que listamos sobre o HTML5, mas fique tranquilo(a), veremos HTML juntamente com o HTML5.
A imagem abaixo é velha, mas serve para der uma visão panorâmica da evolução do HTML:
