Curso Fundamentos de HTML: Construindo a Web
Sobre a Aula

Adicionando cabeçalhos de tabela (th)

Quando se trata de criar tabelas em HTML, os cabeçalhos de tabela desempenham um papel fundamental na estruturação e acessibilidade dos dados.

Cabeçalho de tabela

Os cabeçalhos de tabela (ou <th>) são usados para identificar e descrever as células de cabeçalho em uma tabela.

Eles fornecem informações importantes sobre o conteúdo das colunas ou linhas, permitindo que os leitores de tela e mecanismos de busca entendam melhor a organização dos dados.

Ao adicionar cabeçalhos de tabela, você ajuda a melhorar a legibilidade e a compreensão do conteúdo da tabela.

Além disso, os cabeçalhos de tabela também podem estilizar-se visualmente, permitindo que os usuários identifiquem facilmente as seções importantes da tabela.

Adicionar cabeçalhos de tabela

Para adicionar cabeçalhos de tabela, você deve usar a tag <th> dentro da tag <thead>. Cada célula de cabeçalho deve ser definida em uma coluna específica, alinhada com as células correspondentes das linhas de dados.

Aqui está um exemplo simples de código HTML:

<table>

  <thead>

    <tr>
      <th>Nome</th>
      <th>E-mail</th>
      <th>Telefone</th>
    </tr>
    
  </thead>

  <tbody>

    <tr>
      <td>João Silva</td>
      <td>joao@example.com</td>
      <td>(99) 1234-5678</td>
    </tr>

    <tr>
      <td>Maria Santos</td>
      <td>maria@example.com</td>
      <td>(99) 9876-5432</td>
    </tr>

  </tbody>

</table>

Nesse exemplo, temos uma tabela com três colunas: “Nome“, “E-mail” e “Telefone“. Os cabeçalhos de tabela estão definidos dentro da tag <thead>, enquanto os dados estão dentro da tag <tbody>.

Essa estruturação ajuda a diferenciar visualmente os cabeçalhos das células de dados.

Lembre-se de utilizar palavras-chave relevantes e sinônimos ao escrever o conteúdo da tabela e seus cabeçalhos.

Isso contribui para a otimização do SEO e torna o conteúdo mais acessível para os usuários e mecanismos de busca.

Assim, ao adicionar cabeçalhos de tabela em suas páginas HTML, você criará uma estrutura clara e organizada para apresentar informações tabulares.

Isso melhora a usabilidade do seu site e a experiência do usuário, permitindo que eles compreendam facilmente o conteúdo da tabela.

Agora que você aprendeu sobre os cabeçalhos de tabela em HTML, experimente aplicar esses conceitos em suas próprias tabelas e veja como eles podem melhorar a apresentação e a acessibilidade dos seus dados.

Confira nosso curso sobre tabela na Playlist no YouTube ou na forma escrita aqui mesmo no site.

Livro - e-book de HTML para iniciante

Entrar na conversa
Rolar para cima