HTML: A minha primeira página HTML
Já sabemos o que é o HTML ? Então estamos prontos, certo ? Vamos abrir um editor de texto simples, pode ser o Notepad, e queremos fazer uma página WEB com o recurso à programação HTML.
Muito bem. Vamos começar!
Para iniciarmos esta linha de exercícios de maneira simples, vou dizer exactamente o que precisa fazer e depois explicar o que foi feito e o que está contido nestas linhas de programação.
Passo 1 — Abrir o Notepad
Passo 2 — Inserir o seguinte texto (podem fazer copy-paste):
<html> <head> <title>A minha primeira página html</title> </head> <body> Aqui está a minha primeira página html. </body> </html>
Passo 3 — Gravar o nome do ficheiro como mypage.html
Passo 4 — Fazer duplo-clique no ficheiro ou arrastar para o navegador web.
O resultado que deverá surgir será:
Bem, agora que isto foi um sucesso, é necessário retirar daqui os pontos importantes.
Analisando o que foi feito retiramos que:
- Uma página web é composta por um ficheiro de texto normalissimo (ou mais do que um mas vemos isto mais tarde);
- Uma página web é criada com uma linguagem estruturada, composta por marcadores (tags) de formatação (<html>,<head>, <body>, <title>, etc) e conteúdo (“A minha primeira página html”);
- Por ser estruturada, tem uma ordem e uma hierarquia — primeiro vem a tag <html>, depois a <title> e depois a <body>
- Os marcadores — tags — encapsulam-se na sua hierarquia — o <html> é superior a todos e encapsula tudo, o <head> e o <body> possuiem hierarquias semelhantes mas definem dados diferentes, ambos pertencem ao <html>, e o <title> — que define o título da página — está contido no <head>
A nível da estrutura, temos de pensar nas bonequinhas russas, ou seja, os marcadores englobam outros como as bonecas pequenas estão inseridas nas grandes. Se pensarem nas tags, temos tags de abertura (ex:<html>) que funciona como a tampa de cima da boneca russa, e a tag de fecho (ex:</html>) que funciona como a tampa de baixo. Entre uma e outra fica o conteúdo ou outras marcações com as suas tags de abertura e fecho.
No caso da tag <html>, pode ser dito que esta representa a boneca maior, dado que, se repararem, a sua tag de abertura é a primeira marcação efectuada no código que escrevemos e a sua tag de fecho é a última marcação efectuada, o que quer dizer que esta tag engloba TODO o restante código.
Agora para a explicação dos marcadores:
<html> — É a tag inicial do html e que define que o html vai começar;
<head> — Define a posição e as marcações do cabeçalho da página, onde se encontra o título, entre outras coisas;
<title> — Marcador que define exclusivamente o título — é a sua única função;
<body> — Define o corpo do documento. Tudo o que aqui estiver vai aparecer no corpo do navegador web;
Este ínicio foi, para quem já sabe, de facto muito simples, mas é importante iniciarmos com passos pequenos e para quem não conhecia e conseguiu hoje criar uma página web, os meus parabéns e continuem a ler artigos deste género aqui no blog.
Bons projectos!
E você ? Qual a sua opinião ?
Este artigo trouxe-lhe algo à memória ? Tem alguma dica ou informação para partilhar comigo ? Acha alguma informação incorrecta e deseja rectificar ? Quer deixar a sua impressão, a sua própria opinião ? Comente! Participe!
Eu agradeço :).
Um abraço e tudo de bom,
Temas: Artigo Técnico, HowTo, HTML
