Converter tabela HTML em Markdown — Barras, quebras e linhas irregulares

Converter uma tabela HTML em Markdown

Tem uma <table> em HTML e precisa dela como tabela Markdown para um README, uma issue do GitHub ou uma página do Notion? Cole o HTML no conversor de HTML para Markdown do FormatArc e copie o resultado. Tudo roda no seu navegador — nada é enviado.

1. Abra a ferramenta HTML para Markdown
2. Cole seu HTML (o elemento <table> inteiro ou um trecho que o contenha)
3. Clique em Run e copie a tabela Markdown compatível com GitHub na saída

O restante desta página mostra exatamente o que a conversão faz: como ela evita que a tabela quebre e onde tem limites.

Exemplo de tabela HTML: antes e depois

Esta é uma tabela HTML simples:

<table>
  <tr><th>Nome</th><th>Função</th><th>Time</th></tr>
  <tr><td>Aoi</td><td>Engenheira</td><td>Plataforma</td></tr>
  <tr><td>Ben</td><td>Designer</td><td>Web</td></tr>
</table>

Ao colá-la no conversor, você obtém uma tabela em Markdown do GitHub (GFM):

| Nome | Função | Time |
| --- | --- | --- |
| Aoi | Engenheira | Plataforma |
| Ben | Designer | Web |

O primeiro <tr> vira a linha de cabeçalho e a linha separadora (---) é gerada automaticamente. A saída é GFM alinhado à esquerda, que aparece corretamente no GitHub, GitLab, Notion e na maioria dos editores Markdown.

Tabelas que costumam quebrar, resolvidas para você

O difícil ao passar tabelas de HTML para Markdown não é o caminho feliz, e sim o conteúdo de célula e o número de células por linha, que quebram a tabela silenciosamente. O conversor trata os três casos mais comuns para que a linha permaneça intacta.

Uma célula que contém uma barra vertical

No Markdown, | é o separador de colunas, então uma barra dentro de uma célula divide a linha no lugar errado. O conversor a escapa para você:

<td>a | b</td>

vira a \| b na saída, de modo que a tabela mantém o número certo de colunas.

Uma célula com quebras de linha

Uma quebra de linha dentro de uma célula empurraria o resto da linha para uma nova linha e quebraria a tabela. As quebras de linha dentro de uma célula são reduzidas a um único espaço, mantendo cada linha em uma só linha.

Linhas com número diferente de células

Se algumas linhas tiverem mais ou menos células que o cabeçalho, o conversor normaliza cada linha para o número de colunas do cabeçalho: descarta as células extras e preenche com células vazias as linhas curtas. Você obtém uma tabela válida em vez de uma desalinhada.

Para as regras do formato em si, veja a sintaxe de tabelas em Markdown e a folha de referência de tabelas GFM.

Converter uma tabela copiada de uma página web

Muitas vezes você não tem o HTML de origem — só vê uma tabela renderizada em uma página. Há duas formas confiáveis de levá-la para o Markdown.

Copiar o HTML

No navegador, clique com o botão direito na tabela e escolha Inspecionar; depois clique com o botão direito no elemento <table> nas DevTools e escolha Copiar, Copiar elemento. Cole esse HTML na ferramenta HTML para Markdown e converta.

Copiar as células

Se você seleciona e copia as células visíveis (ou as copia de uma planilha), normalmente obtém texto separado por tabulações em vez de HTML. Esse caso combina com a ferramenta CSV para Markdown, que lê linhas separadas por tabulação ou vírgula. A mesma abordagem é detalhada em Excel ou Google Sheets para Markdown.

Ou seja: cole HTML real em HTML para Markdown e cole as células copiadas em CSV para Markdown.

Quando o resultado fica errado

O conversor mira tabelas HTML comuns. Algumas estruturas não se mapeiam de forma limpa para uma tabela Markdown, porque as próprias tabelas Markdown não as suportam:

• Sem linha de cabeçalho na origem: o primeiro <tr> é sempre usado como cabeçalho. Se sua tabela não tem cabeçalho, a primeira linha de dados aparecerá como tal; adicione um na saída se precisar.
• Células mescladas (rowspan / colspan): tabelas Markdown não têm células mescladas (veja Tables (extension)Abre em uma nova aba na especificação GFM), então as mesclagens não são expandidas. Uma tabela que depende de células mescladas não será reproduzida igual; desfaça a mesclagem primeiro.
• Tabelas aninhadas: uma tabela dentro de uma célula se mistura à varredura de linhas e não sobrevive de forma limpa. Converta a tabela interna separadamente.
• Links e negrito dentro de uma célula: o conteúdo da célula é tratado como texto puro, então a formatação e os links são achatados para o texto. Adicione links Markdown de volta na saída se precisar.
• Alinhamento de colunas: as colunas de saída ficam alinhadas à esquerda. Se quiser colunas centralizadas ou à direita, altere a linha separadora (por exemplo :---:) depois; veja a sintaxe de tabelas em Markdown.

Células mescladas não apenas deixam de ser expandidas: dependendo da posição, podem descartar dados por completo. Quando colspan está na linha de cabeçalho, o número de colunas da tabela Markdown é definido pelo número de células dessa linha, então uma coluna inteira pode desaparecer (medido em scripts/benchmarks/html-table-merged-cells/).

Antes:

<table>
  <tr><th colspan="2">Name</th><th>Price</th></tr>
  <tr><td>Widget</td><td>Blue</td><td>$3</td></tr>
</table>

Depois (medido):

| Name | Price |
| --- | --- |
| Widget | Blue |

$3 nunca aparece na saída. O cabeçalho conta como duas células (Name e Price), então a tabela fica com duas colunas, e a terceira célula da linha de dados é descartada.

rowspan não descarta valores, mas desloca as colunas.

Antes:

<table>
  <tr><th>Region</th><th>City</th><th>Pop</th></tr>
  <tr><td rowspan="2">APAC</td><td>Tokyo</td><td>14M</td></tr>
  <tr><td>Seoul</td><td>9M</td></tr>
</table>

Depois (medido):

| Region | City | Pop |
| --- | --- | --- |
| APAC | Tokyo | 14M |
| Seoul | 9M |  |

Seoul cai na coluna Region da segunda linha, e Pop fica vazia: a célula que o rowspan omite nunca é preenchida de volta. Se uma tabela depende de células mescladas, desfaça a mesclagem (escreva o valor de volta em cada célula) antes de colá-la.

Se uma tabela sai desalinhada, quase sempre é um dos casos acima: uma célula mesclada ou uma tabela aninhada. Para HTML de documento completo (títulos, listas, links, não só uma tabela), use o guia mais amplo de HTML para Markdown.

Quando a tabela convertida fica larga demais

Se uma tabela HTML já tem mais de 10 colunas, ou as células contêm textos longos, o Markdown convertido vira uma única linha larga cheia de pipes (|), difícil de ler tanto no editor quanto em um diff de repositório. Isso não é falha de conversão — é uma limitação da própria sintaxe de tabelas do Markdown.

• Considere reduzir colunas. Elimine antes de converter as colunas que não são essenciais ao objetivo principal da tabela (IDs internos, data de geração)
• Se a largura for realmente necessária, divida uma tabela em várias menores (por exemplo uma tabela só com a coluna de resumo e outra só com as colunas de detalhe)
• Não é preciso alinhar os pipes manualmente (igualar a largura em | --- | --- |). Os renderizadores GFM interpretam a tabela corretamente mesmo quando os pipes não estão alinhados. Alinhar à mão só aumenta o custo de manutenção e não afeta a aparência.

Se a tabela convertida já está saindo quebrada, veja o que fazer quando uma tabela Markdown não renderiza para soluções por sintoma.

No navegador, sem upload

A conversão roda no seu navegador com JavaScript: o HTML que você cola nunca é enviado a um servidor, registrado ou armazenado. Isso importa quando a tabela contém dados internos: linhas de clientes, preços, qualquer coisa de um painel privado. Muitos conversores online enviam o que você cola; o FormatArc não. Mais sobre por que essa diferença importa: conversores online são seguros?

Perguntas frequentes

Como converto uma tabela HTML em uma tabela Markdown?

Cole o HTML (o elemento <table> ou um trecho que o contenha) no conversor de HTML para Markdown do FormatArc e clique em Run. A primeira linha vira o cabeçalho e você obtém uma tabela Markdown do GitHub para copiar.

Por que minha tabela Markdown convertida está quebrada?

As causas mais comuns são células mescladas (rowspan / colspan) e tabelas aninhadas, que as tabelas Markdown não conseguem representar. Barras e quebras de linha dentro das células são tratadas automaticamente, então, se a tabela está desalinhada, procure uma célula mesclada ou aninhada e desfaça-a primeiro.

Ela mantém links e negrito dentro das células?

Não. O conteúdo da célula é convertido como texto puro, então links e formatação viram o texto. Adicione links Markdown de volta na saída se precisar.

Minha tabela HTML não tem linha de cabeçalho — o que acontece?

O primeiro <tr> é sempre tratado como cabeçalho. Se sua tabela não tem cabeçalho, a primeira linha de dados será usada; adicione ou ajuste um cabeçalho na saída.

Posso converter uma tabela que copiei de um site?

Sim. Copie o elemento <table> pelas DevTools (Copiar, Copiar elemento) e cole o HTML em HTML para Markdown. Se você copiou as células visíveis, cole-as em CSV para Markdown, que lê linhas separadas por tabulação.

Resumo

• Cole uma <table> HTML em HTML para Markdown para obter uma tabela Markdown do GitHub
• As barras são escapadas, as quebras de linha dentro das células viram espaços e as linhas desiguais são normalizadas, então a tabela não quebra
• Células mescladas, tabelas aninhadas e links em células não se mapeiam para tabelas Markdown; desfaça-os primeiro
• Para células copiadas de uma planilha ou página web, CSV para Markdown lê linhas separadas por tabulação
• Tudo roda no seu navegador, sem upload