Páginas HTML possuem uma estrutura básica, isso nos permite
criar um arquivo padrão que será usando como base para criação de outros
arquivos.
Análise abaixo a estrutura retirada do site da w3c
schools. Cada tag será explicada ainda
neste tópico.
É importante fixar esta estrutura devido ao fato de que esta
é a base de qualquer página web.
HTML: esta é a tag principal do nosso arquivo dentro dela será
colocado todo o conteúdo da nossa página.
HEAD: esta tag é o que seu próprio nome já diz, ela define o cabeçalho
da página. Dentro dela podemos colocar algumas configurações da nossa página.
Como:
·
TITLE: titulo da página. ( titulo mostrado na aba
do navegador)
BODY: esta tag define a região com todo o conteúdo da página propriamente
dito. Dentro desta da tag body será adicionado todo o texto imagens, etc.
2.1 Vamos a prática
2.1.1 Criando página HTML padrão
Criaremos agora um arquivo HTML padrão para ser utilizado
como modelo sempre que formos criar uma nova página HTML. Para o exemplo iremos
utilizar o Brackets, você pode utilizar outro editor de sua preferência.
Veja no artigo Instalação ecriação de projeto com Brackets, como criar um projeto no Brackets.
Assim, criaremos um projeto e ao longo dos próximos artigos iremos evolui-lo.
Crie uma pasta em seu computador com o nome de THUG_HTML. Usaremos esta pasta para salvar todos os nossos
arquivos.
No
Brackets, acesse o menu File > Open
Folder…
Abra a pasta criada.
Em seguida crie uma subpasta com o nome de padrao.
Crie um novo arquivo com o nome de default.html e digite o seguinte código:
Clique no ícone 
para executar o arquivo,
ou navegue até a pasta e abra o arquivo com seu navegador.
Ao abrimos a página no navegador nenhum resultado é exibido,
pois, definimos apenas o título, ainda não adicionamos nenhum conteúdo a
página. Veja:
Note que no arquivo dentro da tag body o
texto: <!-- Comentario -->
Em html para definirmos um
comentário utilizamos <!-- para abrir um
bloco de comentário e --> par fechar o bloco.
Usaremos muitos comentário
para facilitar o entendimento dos códigos utilizados.
Para finalizar este tópico vamos
adicionar mais uma coisa ao nosso arquivo padrão.
2.1.2 DOCTYPE
O conteúdo da primeira linha de código de um arquivo HTML
deve sempre ser o DOCTYPE. O Doctype serve para avisar aos browsers, robôs de
busca, leitores de tela entre outros, qual o tipo de documento que está preste
a ser carregado. Existem outras informações que podemos carregar com por
exemplo XML, definir a região do arquivo, coisas que abordaremos futuramente.
Por isso o Doctype avisa o browser para que ele saiba como se comportar ao ler
o código fonte do arquivo.
Vamos adicionar o Doctype
ao início do nosso arquivo:
<!DOCTYPE html>
Dessa forma nosso código ficará assim:
<!DOCTYPE html> <html> <head> <title>Titulo da minha pagina</title> </head> <body> <!-- Comentario --> <!-- Aqui será adicionado nosso conteudo em breve --> </body> </html>
