Principais tags de layout em HTML
Para o cabeçalho do site, deve-se usar a tag
header, para o rodapé - a tag footer,
para a barra lateral - a tag aside, para o conteúdo
- a tag main. Vamos ver como
ficará o layout de um site escrito
com essas tags:
<div id="wrapper">
<header>
cabeçalho
</header>
<div id="container">
<aside>
barra lateral
</aside>
<main>
conteúdo
</main>
</div>
<footer>
rodapé
</footer>
</div>
Para o menu, deve-se usar a tag nav:
<nav>
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</nav>
Dado o seguinte código:
<div id="wrapper">
<div id="header">
<div id="menu">
<a href="#"></a>
<a href="#"></a>
<a href="#"></a>
</div>
</div>
<div id="container">
<div id="sidebar">
barra lateral
</div>
<div id="content">
conteúdo
</div>
</div>
<div id="footer">
rodapé
</div>
</div>
Converta este código usando as novas tags que você estudou.