Tags de agrupamento semântico
Até agora para criar uma box-level usamos a tag div
e para criar caixas inline-level usamos a tag span
. Na versão 4 do HTML essas duas tags eram usadas para criar o layout do documento. Embora ainda seja possível usar div's e span's, no HTML5 podemos usar tags de agrupamento semânticos.
De maneira geral, todo site possui: cabeçalho, corpo principal e rodapé, com um menu de navegação sendo bastante comum também. As seguintes tags podem ser usadas como divs semânticas, que indicam a estrutura da página:
- header: Funciona como uma div mas já indica que a seção é de cabeçalho;
- main: Funciona como uma div e indica que é a parte principal do site;
- footer: Funciona como uma div e indica que é a parte de rodapé;
- nav: Indica que é a seção de navegação;
- section: Tag usada para indicar que é uma seção;
- article: Tag usada para indicar um artigo;
- aside: Conteúdo periférico ao artigo;