Tabelas existem no HTML para organizar dados tabulares. Elas não servem para montar layout de página — e entender isso muda tudo.

Nesta aula, vamos aprender a usar tabelas corretamente e evitar um dos maiores erros do passado da web.

O que é uma tabela no HTML?

Uma tabela é uma estrutura formada por linhas e colunas, usada para representar dados relacionados.

Exemplos de uso correto:

  • Resultados de vendas
  • Horários
  • Relatórios
  • Comparações de dados

Estrutura básica de uma tabela

A estrutura mínima de uma tabela envolve estas tags:

  • <table> — tabela
  • <tr> — linha da tabela
  • <td> — célula de dados

  <table> 
    <tr> 
      <td>Produto</td> 
      <td>Preço</td> 
    </tr> 
    <tr> 
      <td>Teclado</td> 
      <td>R$ 120</td> 
    </tr> 
  </table> 

O código acima resultará na seguinte página sendo criada:

Exemplo de página HTML

Cabeçalhos de tabela com <th>

Para indicar títulos de colunas ou linhas, usamos a tag <th>.

 
  <table> 
      <tr> 
        <th>Produto</th> 
        <th>Preço</th> 
    </tr> 
    <tr> 
      <td>Mouse</td> 
      <td>R$ 80</td> 
    </tr> 
  </table> 

O código acima resultará na seguinte página sendo criada:

Exemplo de página HTML
O uso de <th> melhora a acessibilidade e a leitura dos dados.

Tabelas são para dados, não para layout

Antigamente, tabelas eram usadas para montar o layout de sites. Hoje isso é considerado uma prática errada.

Nunca use tabelas para:

  • Organizar colunas de layout
  • Alinhar textos visualmente
  • Montar estrutura de página

Para layout, usamos CSS. Para dados, usamos tabelas.

Exemplo de uso correto

 
<table> 
  <tr> 
    <th>Aluno</th> 
    <th>Nota</th> 
  </tr> 
  <tr> 
    <td>Ana</td> 
    <td>9.5</td> 
  </tr> 
  <tr> 
    <td>João</td> 
    <td>8.0</td> 
  </tr> 
</table> 

O código acima resultará na seguinte página sendo criada:

Exemplo de página HTML

Resumo visual

💾🧠 Resumo da aula para nunca mais esquecer

  • Tabelas servem para organizar dados
  • <table> cria a tabela
  • <tr> cria linhas
  • <td> cria células
  • <th> cria cabeçalhos
  • Nunca use tabelas para layout

Na próxima aula, vamos aprender sobre HTML semântico (HTML5) e entender por que ele é tão importante hoje.


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 console Nintendo Entertainment System (NES), da Nintendo, detém o recorde de videogame mais clonado em todo o mundo. Já foram catalogados mais de 300 aparelhos diferentes capazes de reproduzir seus jogos! Saiba mais sobre ele aqui.


Criar um jogo é muito mais complexo do que parece. São milhares, às vezes, milhões de linhas de código. Isso não é exagero! Apenas o jogo Ultima Online possui 6.006.313 linhas de programação, totalizando 25.103.295 palavras


As primeiras máquinas de fliperama do mundo a utilizarem moedas, chamadas de Galaxy Game, custavam mais de 20 mil dólares para serem produzidas. Saiba mais sobre elas aqui.


O épico jogo River Raid, do Atari, foi desenhado e boa parte de sua programação foi feita por uma mulher: Carol Shaw, uma excelente programadora e funcionária da Activision em 1982. Saiba mais sobre a história deste incrível jogo, aqui.


Ao completar o nível 99 do jogo Duck Hunt, para Nintendo, o jogo retorna ao primeiro nível, mas um bug impede que se acerte os patos neste recomeço. Este é um exemplo do que é chamado no mundo dos games de "Kill Screen".