Pular para o conteúdo principal

2 - Estrutura Básica HTML

Estrutura Básica HTML

O documento HTML sempre inicia com o que chamamos de estrutura básica. Esta estrutura é quase que imutável. Sempre será dessa forma e você sempre, sempre começará seu HTML começando por esse código. Geralmente os editores como o Sublime Text já tem atalhos para iniciar os documentos HTMLs com essa estrutura, logo, você não precisa se preocupar em decorá-la, mas é bom que faça. Veja abaixo como ela se inicia:


<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <title>Título da página</title>
    <meta charset="utf-8">
  </head>
  <body>
    Aqui vai o código HTML que fará seu site aparecer.
  </body>
</html>


É possível compreender o documento em HTML de uma maneira muito simples, através de uma divisão de blocos das tags essenciais, conforme a a seguinte estrutura:

Definição do documento (doctype)
Cabeça (head)
Corpo (body)
Doctype - Definindo o documento
Uma coisa importante: SEMPRE deve existir o doctype, que é este código <!DOCTYPE html>.

O doctype não é uma tag HTML, mas uma instrução para o navegador e outros programas que podem ler seu site, que o código encontrado ali é um código HTML. Assim eles sabem o que fazer para mostrar seu site da melhor forma possível. Lembre-se: o doctype é OBRIGATÓRIO e deve ser sempre a PRIMEIRA LINHA do seu documento.

HEAD
Contém informações que não são transpostas visivelmente para o usuário/leitor do documento. São dados implícitos, de uso e controle do documento: vinculação com outros arquivos, aplicação de lógica de programação de scripts e metadados. Na prática, todo o conteúdo do cabeçalho fica delimitado entre a abertura e fechamento tag head.

BODY
Trata-se do documento em si, ou seja, a informação legível para o usuário/leitor do documento. É todo e qualquer texto que se deseja apresentar, assim como toda e qualquer forma de mídia de saída (imagens, sons, miniaplicativos embutidos, conteúdo multimídia, etc). Além disso, toda a apresentação de entrada de dados (formulários) também se aplica neste seção do documento. Na prática, o corpo do documento é delimitado pelo par de tags <body> e </body>.

Este é o preceito básico que deve estar muito bem claro para você: onde as marcações se aplicam, e quais são os resultados deste modelo. Por exemplo: se vocês deseja informar conteúdo textual para saída legível ao usuário do seu sistema web, esta marcação deverá obrigatoriamente estar no bloco do corpo da página. Ainda: para definir qual o tipo de codificação da página (uma meta informação do documento), esta deve obrigatoriamente estar marcada no cabeçalho do mesmo documento.


Dentro do elemento BODY sua estrutura de página terá os elementos semânticos da construção da sua página, onde serão declarados e identificados cabeçalhos, rodapé, conteúdo principal, etc.

Links adicionais 

w3schools.com - https://www.w3schools.com/html/
tutorialspoint - https://www.tutorialspoint.com/html/index.htm








Fonte: https://tableless.com.br/.

Comentários

Postagens mais visitadas deste blog

11 - Links Internos

Link Internos Os links internos, nos levan a a determinado local de uma página web, por padrão os links apontam o inicio de um  documento, porém, utilizando o simbolo #, podemos selecionar em que parte do documento o link nos levará.

12 - Tabelas

Tabelas As tabelas são muito importantes para o designer de uma home-page. Com elas pode-se fazer alinhamentos que dificilmente seriam possíveis com simples comandos. A funcionalidade de uma tabela faz com que um determinado site tenha um aspecto mais profissional e o usuário possa navegar de forma mais eficiente, pois os objetos podem estar melhor posicionados na home-page. Vamos discutir, nesta parte, quais são os comandos para se criar uma tabela e mostrar alguns exemplos. Fonte: http://www.ancibe.com.br/html/tabelas.html

10 - Link HTML

Link HTML Talvez  a característica mais importante de web. O links permitem que a internet esteja ligada, criando a grande rede mundial, em inglês: World Wide Web, também conhecida pelos termos em inglês web e WWW