Convertisseur de tableaux HTML vers Markdown | thead, align, colspan / rowspan en une passe

Migrer un vieil article de HTML vers Markdown se passe presque toujours bien — sauf pour les tableaux, qui s'effondrent en une seule colonne ou perdent leur en-tête. Cet outil lit le HTML que vous collez, écrit le tableau en GitHub Flavored Markdown et conserve les en-têtes thead, la direction de align et l'expansion de colspan / rowspan en une seule opération.

💡 À propos de cet outil

La plupart des convertisseurs rapides HTML→Markdown ne distinguent pas la ligne d'en-tête du corps : ils écrivent | cellule | cellule | pour chaque ligne et omettent la ligne de séparation. Un renderer GFM lit ensuite cette sortie, traite la première ligne comme une donnée et le tableau s'affiche sans en-tête sur GitHub, Hugo, Docusaurus ou VuePress.

Ici, le convertisseur parcourt l'arbre DOM produit par le DOMParser natif du navigateur, identifie les lignes du thead comme en-tête et lit l'alignement depuis l'attribut historique align ou le text-align inline. Les cellules fusionnées (colspan / rowspan) sont déployées en matrice : le contenu reste en haut à gauche, le reste de la plage est rempli de cellules vides, et un bandeau orange vous prévient que Markdown ne représente pas nativement la fusion.

Tout se passe dans votre navigateur. Le HTML que vous collez ne quitte jamais la page.

🧐 Questions fréquentes

Q. Cela fonctionne-t-il avec des tableaux copiés depuis Excel, Numbers ou LibreOffice Calc ? A. Les tableurs déposent généralement à la fois du texte brut et du HTML dans le presse-papiers. Coller directement le HTML, ou exporter la feuille en HTML puis la coller ici, marche dans la grande majorité des cas. Les balises <meta> et les styles parasites ajoutés par certains exportateurs sont écartés automatiquement.

Q. Que se passe-t-il si le tableau n'a pas de <th> ? A. Le convertisseur insère une ligne d'en-tête vide (| | | |) pour que la ligne de séparation ait quelque chose à aligner. GFM exige une ligne d'en-tête syntaxiquement, mais une ligne vide se rend correctement.

Q. Comment sont traités les balises internes comme <a>, <strong> ou <code> ? A. En mode "Texte uniquement", le convertisseur ne garde que le texte brut. En mode "Garder les balises", il préserve le HTML inline dans la cellule Markdown puisque GFM laisse passer le HTML. Utilisez "Garder" pour conserver les liens et la mise en valeur ; "Texte uniquement" pour les imports propres.

Q. Comment sont gérés les caractères | à l'intérieur des cellules ? A. Ils sont échappés en \| pour ne pas couper la cellule en deux. Le renderer GFM décode l'échappement et affiche le | littéral.

Q. Peut-on coller un document HTML complet contenant plusieurs tableaux ? A. Oui. Les tableaux sont convertis dans l'ordre du document et séparés par une ligne vide. Les compteurs reflètent le total des lignes et la colonne la plus large parmi tous les tableaux.

Q. <caption> et <colgroup> sont-ils pris en charge ? A. Pas encore. GFM n'a pas de moyen standard d'exprimer un <caption> au-dessus du tableau et les indications de largeur de <colgroup> n'ont pas d'équivalent Markdown. Les deux sont ignorés silencieusement.

📚 Le saviez-vous

La syntaxe de tableau en pipes que GFM utilise vient à l'origine de PHP Markdown Extra (2004 environ), cinq ans avant que GitHub ne l'inscrive dans la spec GFM pour README.md. Les marqueurs d'alignement (:---, ---:, :---:) sont quasiment repris tels quels de Markdown Extra.

Le parser HTML5 a une règle dite de "foster parenting" : lorsque du contenu entre <table> et </table> n'est pas légalement à sa place dans une cellule, le navigateur l'expulse silencieusement hors du tableau. Ce convertisseur évite ce comportement en passant par DOMParser et en se limitant au sous-ensemble prévisible <tr> / <th> / <td>, qui se comporte identiquement dans Chrome, Firefox et Safari.