O elemento <footer> é uma tag semântica do HTML5 utilizada para representar o rodapé de uma página ou seção.
Normalmente contém informações como direitos autorais, contatos, links institucionais e informações complementares.
A tag <footer> define uma área de encerramento dentro da estrutura HTML.
<footer>
Informações finais da página
</footer>
| Informação | Exemplo |
|---|---|
| Direitos autorais | © 2026 Minha Empresa |
| Contato | Email e telefone |
| Links | Política de privacidade |
| Redes sociais | Instagram, LinkedIn |
<footer>
<p>
Todos os direitos reservados.
</p>
</footer>
<body>
<header>
Cabeçalho
</header>
<main>
Conteúdo principal
</main>
<footer>
Rodapé
</footer>
</body>
<footer>
<h3>
Empresa XYZ
</h3>
<p>
Tecnologia e inovação.
</p>
<a href="#">
Contato
</a>
</footer>
Um article também pode possuir seu próprio footer com informações específicas.
<article>
<h2>
Título da Notícia
</h2>
<p>
Texto da notícia.
</p>
<footer>
Autor: João
</footer>
</article>
| Div | Footer |
|---|---|
| Apenas agrupamento visual. | Possui significado semântico. |
| Não informa função. | Representa informações finais. |
| Header | Footer |
|---|---|
| Informações iniciais. | Informações finais. |
| Apresentação da página. | Encerramento da página. |
<footer>
<nav>
<a href="#">
Sobre
</a>
<a href="#">
Contato
</a>
<a href="#">
Privacidade
</a>
</nav>
</footer>
A utilização correta do footer ajuda os mecanismos de busca a entenderem informações institucionais da página.
Leitores de tela conseguem identificar melhor a estrutura da página quando os elementos semânticos são utilizados corretamente.
<body>
<header>
Cabeçalho
</header>
<main>
Conteúdo
</main>
<footer>
<p>
© Todos os direitos reservados
</p>
</footer>
</body>