Estou tentando a entender em quais as diferenças entre div x section(seção) mas é necessário trocar por section??
Estou tentando a entender em quais as diferenças entre div x section(seção) mas é necessário trocar por section??
Olá Lais, tudo bem?
De fato as duas tem o mesmo resultado estético. Ambas se comportam da mesma maneira visual.
O elemento <div>
é um doas elementos mais genéricos do HTML, pois não possui nenhum valor semântico, poderíamos usá-la até mesmo no lugar de um <h1>
ou <p>
, mas pq usar elementos especificos?
Pois o HTML é uma linguagem de marcação de conteúdo, ou seja, se marcamos o conteudo de forma genérica demais ou mesmo errada, estamos falhando em passar significado para nosso codigo, semantica.
Então quando utilizamos <div>
?
Pode ser utilizado para agrupar elementos afim de se aplicar estilos (usando class ou id), ou quando esse grupo compartilha valores de atributos, como o lang. Ele deve ser utilizado somente quando não houver sentido a aplicação de um outro elemento mais semântico que ele (article, section, nav, footer etc).
Já o <section>
, ainda pode ser considerado "genérico" para algumas literaturas, porém possuindo mais valor semântico que o <div>
. Geralmente, é utilizado para marcar uma seção da página, que é dotada de um cabeçalho (família <h1>
até <h6>
) que atuam como filhos do elemento <section>
. Um exemplo seria uma lista de resultados de pesquisa e para descrever as seções/tópicos de um blog.
Caso queira estudar mais sobre isso, aqui estão algumas indicações de leitura:
Sendo assim, temos sempre que buscar um HTML o mais semântico possível, pois isso impactará diretamente no SEO e acessibilidade web.
Espero ter ajudado, qualquer dúvida fique a vontade para perguntar. Bons estudos!
Esclarecido! Muito obrigada Beatriz!