Até agora, você aprendeu várias tags isoladas. Nesta aula, vamos juntar tudo e montar a estrutura completa de uma página HTML real.

Ainda sem CSS e sem JavaScript — foco total na estrutura.

Pensando como um ser humano (e como um navegador)

Antes de escrever qualquer código, pense:

  • O que é o cabeçalho da página?
  • Onde fica a navegação?
  • Qual é o conteúdo principal?
  • O que é complementar?
  • Onde fica o rodapé?

Essas respostas guiam o uso correto das tags semânticas.

Estrutura semântica básica

Uma página HTML moderna costuma seguir esta estrutura:

 
<header> 
</header>

<nav>
</nav>

<main>
</main>

<footer>
</footer>

Dentro dessas áreas, colocamos o conteúdo adequado.

Montando uma página simples

Veja um exemplo completo de página semântica:

 <!DOCTYPE html> <html> <head> <title>Página de exemplo</title> </head>

<body>
<header>
<h1>Meu Site</h1>
</header>

<nav>
  <a href="#">Início</a>
  <a href="#">Sobre</a>
  <a href="#">Contato</a>
</nav>

<main>
  <section>
    <h2>Bem-vindo</h2>
    <p>Este é o conteúdo principal da página.</p>
  </section>

  <article>
    <h2>Artigo em destaque</h2>
    <p>Um conteúdo que faz sentido sozinho.</p>
  </article>
</main>

<footer>
  <p>© 2026 - Contém Bits</p>
</footer>




Entendendo cada parte

  • <header> — identidade da página
  • <nav> — links de navegação
  • <main> — conteúdo principal (apenas um por página)
  • <section> — agrupa conteúdos relacionados
  • <article> — conteúdo independente
  • <footer> — informações finais
Se você consegue explicar o papel da área em voz alta, provavelmente está usando a tag certa.

Leitura humana × leitura por máquinas

HTML semântico permite duas leituras:

  • Humanos entendem melhor o código
  • Máquinas interpretam melhor o conteúdo

Isso é essencial para acessibilidade e SEO.

💾🧠 Resumo da aula para nunca mais esquecer

  • Páginas reais usam estrutura semântica
  • Tags explicam o papel do conteúdo
  • <main> deve existir apenas uma vez
  • Semântica melhora acessibilidade e SEO

Na próxima aula, vamos aprender sobre formulários no HTML — o primeiro contato com interação do usuário.


HARDWARE

Entendendo o seu computador

O que há dentro do meu computador?

Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.

  • Gabinetes

  • Placas-Mãe

  • Processadores

  • Memória

  • Fontes

  • Drives Ópticos

  • Discos Rígidos

  • SSD

  • Placas de Som

  • Placas de Vídeo

Você Sabia?

O primeiro jogo a fazer uso de uma Inteligência Artificial foi o Mouse in the Maze, criado em 1955, na União Soviética. Você pode saber mais sobre ele clicando aqui.


O mouse foi criado em 9 de dezembro de 1968, por um americano chamado Douglas Engelbart, que o batizou de "XY Position Indicator for a Display System". Conheça a história do mouse clicando aqui.


A empresa Take-Two pagou à Infogrames mais de 22 milhões de dólares pelos direitos de Civilization, em novembro de 1994. Ainda sobre este título, Sid Meier, um dos seus fundadores, é o profissional da área dos games mais premiado em todo o mundo.


A partida mais longa do clássico Space Invaders durou incríveis 38 horas e 32 minutos e esta façanha foi conseguida por um jogador de apenas 12 anos! O jogo, claro, podia ser pausado para alimentação e descanso, mas ainda assim o recorde, estabelecido no dia 02/09/1980, ainda não foi quebrado. Saiba mais.


O título Tetris detém o recorde de jogo mais adaptado de todos os tempos. No total foram mais de 60 plataformas diferentes que receberam alguma versão do quebra-cabeças criado por Alexey Pajitnov. Conheça mais sobre este incrível jogo clicando aqui.