2 Criando uma página HTML

domingo, 27 de março de 2016


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>

Nenhum comentário:

Postar um comentário

 

Post Populares

Sidebar One