Estrutura e Sintaxe do HTML

<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
    <body>

    </body>
</html>

Primeiro nós definimos a instrução doctype que informa ao navegador que o tipo do documento utilizado é o html 5, doctype não é um elemento, é uma instrução.

<!DOCTYPE html>

Depois abrimos e fechamos a tag do elemento html, todo código deve ser escrito dentro dessa tag. É recomendado usar o atributo lang com o valor pt-br para informar ao navegador que estamos usando a língua português brasileiro.

A sintaxe do atributo é: depois do nome da tag, um espaço, o nome do atributo, o caracter igual (=) e o valor entre aspas duplas (“”).

<!DOCTYPE html>
<html lang=”pt-br”>
			
</html>

Logo abaixo da tag de abertura do elemento html, abrimos e fechamos a tag do elemento head (cabeça), dentro da tag do elemento head inserimos metadados que serão lidos pelo navegador e que não serão exibidos na página html.

<!DOCTYPE html>
<html lang=”pt-br”>
    <head>

    </head>
</html>

Um dos metadados que podemos passar ao elemento head é o sistema de codificação de caracteres utilizado, no Brasil é utilizado a codificação utf-8.

A codificação é passada com o elemento meta, utilizando o atributo charset e o valor utf-8.

<!DOCTYPE html>
<html lang=”pt-br”>
    <head>
        <meta charset=”utf-8”>
    </head>
</html>

Note que a tag do elemento head foi escrita indentada em relação à tag do elemento html, pois a tag head é considerado tag “filha” do elemento html, que é considerada tag “pai”, assim como a tag meta é filha da tag head.

Outra informação que passamos à tag head é o título da página html, que irá aparecer na barra de título do navegador e que serão lidos pelos robôs das páginas de busca.

O título é passado com o elemento title.

<!DOCTYPE html>
<html lang=”pt-br”>
    <head>
        <meta charset=”utf-8”>
        <title>Título da Página</title>
    </head>
</html>

Abaixo da tag do elemento head abrimos e fechamos a tag do elemento body (corpo), e todo o código colocado dentro do elemento body é que vai ser exibido no site pelo navegador.

<!DOCTYPE html>
<html lang=”pt-br”>
    <head>
        <meta charset=”utf-8”>
        <title>Título da Página</title>
    </head>
    <body>
    
    </body>
</html>

Essa é a sintaxe e a estrutura básica de uma página html, o que for escrito dentro da tag do elemento body será exibido pelo navegador, mas sem nenhuma estrutura, formatação, marcação de hipertexto ou interatividade.