Grouping Tags

Antigamente, era comum utilizar inúmeras "<div>" umas dentro das outras para a criação de cabeçalhos, rodapés etc. Porém, com a chegada do HTML5 há formas mais adequadas para a criar tais elementos:

Cabeçalho:

Para criarmos o cabeçalho podemos utilizar a tag "<header>". Apesar de também ser um tipo de "<div>", ela possui um valor semântico (significado), permitindo que o mecanismo de busca ou navegador indentifique qual é cada elemento em seu site com mais facilidade. O mesmo se aplica para as demais tags.

Conteúdo principal:

Para criarmos o conteúdo principal do nosso site podemos utilizar a tag "<main>". Que tal qual o "<header>", possui um valor semântico e é um tipo de "<div>".

Rodapé:

Para criarmos um rodapé podemos utilizar a tag "<footer>". Onde, igual as tags anteriores, possui um valor semântico e é um tipo de "<div>".


Importante:

É importante ressaltar que as "grouping tags" são muitas, para diversas funcionalidades. Entretanto, nehnhuma delas aplica estética ao seu site, logo que isso fica destinado para as CSS. Ainda assim, é importante utilizá-las para dar sentido ao conteúdo e estrutura do seu site.

Exercício Extra