Antes de explicar de fato o que são TAGS, você precisa saber mais sobre a linguagem estruturada HTML, pois as ditas TAGS fazem parte de páginas HTML.
HTML (Linguagem de Marcação de HiperTexto) é o bloco de construção mais básico da web. Define o significado e a estrutura do conteúdo da web. Outras tecnologias além do HTML geralmente são usadas para descrever a aparência/apresentação (CSS) ou a funcionalidade/comportamento (JavaScript) de uma página da web.
“Hipertexto” refere-se aos links que conectam páginas da Web entre si, seja dentro de um único site ou entre sites. Links são um aspecto fundamental da web. Ao carregar conteúdo na Internet e vinculá-lo a páginas criadas por outras pessoas, você se torna um participante ativo na world wide web.
O HTML usa “Marcação” para anotar texto, imagem e outros conteúdos para exibição em um navegador da Web. A marcação HTML inclui “elementos” especiais, como <head>, <body>, <header>, <footer>, <section>, <div>, <nav> e muitos outros.
Um elemento HTML é separado de outro texto em um documento por “tags”, que consistem no nome do elemento entre “<” e “>“. O nome de um elemento dentro de uma tag é insensível a maiúsculas e minúsculas. Isto é, pode ser escrito em maiúsculas, minúsculas ou um mistura. Por exemplo, a tag <title> pode ser escrita como <Title>, <TITLE> ou de qualquer outra forma.
FONTE: Mozilla.org
Um pouco mais sobre cada TAG
O elemento head representa uma coleção de metadados para o documento. Metadados são, como o próprio nome diz, dados sobre os dados. De forma resumida, você poderá informar o navegador alguns detalhes sobre o conteúdo da página. Por exemplo, <meta charset="UTF-8"> você está especificando a coleção de caracteres que o navegador deve utilizar para analisar sua página. Você ainda pode especificar o autor, descrever o conteúdo da página, ter configurações para SEO, informar folhas de estilos para o navegador utilizar na renderização da página, etc. Toda a documentação, incluindo todos os elementos possíveis para a tag head
O elemento <body> do HTML representa o conteúdo de um documento HTML, ou seja o conteúdo que visível quando navegamos. Sendo permitido apenas um <body> por documento.
O que é header?
Este nome é mais conhecido como “cabeçalho” no Brasil, tratando-se da parte superior do site, a qual fica destacada do resto do conteúdo. Pode ser difícil descrever dessa forma, mas você certamente reconhece o cabeçalho de um site quando o vê.
Para que serve?
A ideia é que esta parte do site contenha tudo que seja absolutamente necessário para a melhor navegação e experiência do cliente. Dessa forma, caso ele faça o primeiro acesso, ele pode facilmente encontrar o que busca. Para isso, o header costuma conter algumas informações principais:
- logo: naturalmente, uma das primeiras coisas que o lead deve ver em seu site é a logotipo da sua empresa, para fácil identificação;
- título da página: junto à logo, quase sempre há também o nome, escrito em letras grandes ou, pelo menos, em tamanho mínimo para ser legível;
- aba de navegação: no cabeçalho, também é comum encontrar os principais ícones de navegação, os quais levam às partes mais importantes do site;
- pesquisa de conteúdo: uma aba de pesquisa por palavras-chave é o melhor caminho para encontrar algo específico no site;
- carrinho de compras: caso seu site também tenha uma loja ou um plugin como o woocommerce, então o lead vai querer acompanhar seu carrinho de compras facilmente;
- redes sociais e contatos: informações de contato e mídias sociais são indispensáveis para dar continuidade ao atendimento e ampliar seu banco de dados de clientes.
Alguns headers apresentam diferentes estruturas e níveis de elaboração, mas quase todos têm esses componentes básicos.
A tag <footer> em HTML é usada para definir um rodapé de um documento HTML. Esta seção contém as informações do rodapé (informações do autor, informações de direitos autorais, transportadoras, etc.). A tag de rodapé é usada na tag body.
A tag <section> é utilizada para marcar as seções de conteúdo de uma página. Com Esse elemento agrupamos de forma lógica nosso conteúdo, separando a informação em áreas diferentes.
A tag div é conhecida como tag de divisão. A tag div é usada em HTML para fazer divisões de conteúdo na página da web como (texto, imagens, cabeçalho, rodapé, barra de navegação, etc). A tag div possui ambas as tags de abertura <div> e fechamento </div> e é obrigatório fechar a tag. O Div é a tag mais utilizável no desenvolvimento web porque nos ajuda a separar os dados na página web e podemos criar uma seção particular para dados ou funções particulares nas páginas web.
O elemento NAV agrupa blocos de links de um mesmo assunto ou links internos do website. Ele indica que um determinado bloco é um bloco de navegação.
Conclusão
Cada tag, vai desempenhar uma função diferente dentro da página html. Você provavelmente já se deparou com alguma dessas tags, além dessas tags que vimos acima, existem inúmeras outras.
Mas se você esta pensando em criar suas páginas ou caso você já esteja criando e utilize o Elementor, então não tem com o que se preocupar mesmo, pois utilizando o Elementor você não precisa digitar uma linha se quer de código 😉
