DEV Community

loading...
Cover image for TAGs importantes para estruturar um pagina HTML.

TAGs importantes para estruturar um pagina HTML.

fabriciovaladares profile image Fabricio-valadares ・2 min read

Hoje vamos ver algumas Tags que server para estruturar melhor nosso HTML, elas geralmente e usada para guiar onde vai ficar o cabeçalho do nosso site, onde vai ficar o conteúdo principal, e onde vai fica o rodapé de nosso site.

Mas antes de estuda as Tags quero falar que visualmente elas não afeta em nada a interface, mas essas Tags têm um peso semântico para os navegadores, por isso e importante usar elas em nossa aplicação.

TAGs que vamos estudar:

<header></header>
<aside></aside>
<main></main>
<footer></footer>
Enter fullscreen mode Exit fullscreen mode

Para que serve a TAG <header></header> no Html:

<header></header>
Enter fullscreen mode Exit fullscreen mode

A Tag header serve para indicar para os navegadores onde está o cabeçalho do nosso site, uma parte muito importante de nosso site, então quando fomos criar um cabeçalho em nossa aplicação devemos pensar em usar a Tag header.

Para que serve a TAG <aside></aside> no Html:

<aside></aside>
Enter fullscreen mode Exit fullscreen mode

A tag aside mostrar para nosso navegador que temos um menu lateral em nosso site, então a tag aside e usada meio que para incluir um cabeçalho lateral, hoje os menus laterais não e tão usados, mas e importante saber essa Tag.

Para que serve a TAG <main></main> no Html:

<main></main>
Enter fullscreen mode Exit fullscreen mode

A tag main diz para os navegadores onde está o conteúdo principal de nossa aplicação, portanto quando fomos criar nosso site devemos ter claro qual e o assunto principal para que assim possamos da destaque nele.

Para que serve a TAG <footer></footer> no Html:

<footer></footer>
Enter fullscreen mode Exit fullscreen mode

A tag footer diz respeito ao rodapé de nosso site, então quando quisermos criar um rodapé para nossa aplicação e importante usar a tag footer.

Conclusão:

Obrigado por ler esse artigo até aqui, espero ter acrescentado algo em seu conhecimento e em sua jornada como programador.

Ahhh, me deixe um comentário aqui.

Discussion (0)

pic
Editor guide