Tags principais
Semântica base
- header: topo ou introdução.
- nav: navegação principal.
- main: conteúdo principal da página.
- section: bloco temático.
- article: conteúdo independente.
- footer: rodapé ou fechamento.
Objetivo da aula
Dar significado para cada parte da página
Uma página profissional não deve ser um amontoado de tags. Ela precisa ter estrutura clara para humanos, navegadores, leitores de tela e mecanismos de busca.
Erro comum
Usar div para tudo
A tag div não tem significado. Ela é útil, mas não deve substituir tags semânticas quando existe uma tag mais clara para aquele papel.
Ruim:
Montar a página inteira só com div.
Melhor:Usar header, main, section, article e footer quando fizer sentido.
Modelo profissional
Estrutura recomendada
<header>Topo</header>
<main>
<section>Bloco de conteúdo</section>
</main>
<footer>Rodapé</footer>