Terug naar home Ontwikkelaar HTML-tabelgenerator

HTML-tabelgenerator

Converteer CSV/TSV naar HTML-tabellen

Hoe HTML-tabelgenerator te gebruiken

Converteer CSV/TSV naar HTML-tabellen Gratis online tool, geen registratie, geen opdringerige advertenties. Gebruik het nu.

Wanneer heb je een HTML-tabelgenerator nodig?

HTML-tabellen tonen tabelgegevens — rijen en kolommen met koppen. Het handmatig schrijven van HTML-tabelcode is uitgebreid en foutgevoelig, met name voor tabellen met veel kolommen. Een generator converteert gestructureerde gegevens direct naar geldige, opgemaakte tabelopmaak.

Toegankelijkheid van HTML-tabellen: Goed opgemaakte HTML-tabellen bevatten <th>-koppen met scope-attributen, een beschrijvend <caption>-element en gebruiken de secties <thead>/<tbody>/<tfoot>. Schermlezers zijn afhankelijk van deze structuur om tabelgegevens op een betekenisvolle manier te communiceren aan gebruikers met een visuele beperking — een vereiste conform WCAG 2.1 en de Wet digitale overheid in Nederland.

Frequently Asked Questions

Wanneer moet ik een tabel gebruiken in plaats van CSS Grid/Flexbox?

Gebruik tabellen voor echt tabelgegevens — gegevens met betekenisvolle rijen en kolommen, waarbij de betekenis van elke cel afhangt van zijn rij- en kolomkoppen. Gebruik CSS Grid en Flexbox voor lay-out — zelfs als het visuele resultaat op een raster lijkt, moeten niet-tabelmatige lay-outs geen <table>-elementen gebruiken vanwege semantische en toegankelijkheidsredenen.

Wat is het verschil tussen <th> en <td>?

<th> is een tabelkopcel — standaard vetgedrukt en gecentreerd, en markeert semantisch de cel als kop van zijn rij of kolom. Schermlezers gebruiken <th> om de kolom- of rijcontext aan te kondigen. <td> is een gegevenscel zonder speciale semantische betekenis. Gebruik altijd <th> voor kolom- en rijkoppen.

Hoe maak ik een tabel responsief op mobiel?

Gewone HTML-tabellen reageren niet op smalle schermen — ze overlopen of comprimeren de inhoud. Veelgebruikte oplossingen: voeg overflow-x:auto toe aan een containerdiv voor horizontaal scrollen. Of gebruik CSS om cellen verticaal te stapelen op mobiel, met data-label-attributen om kolomkoppen naast elke waarde te tonen.

Wat is de CSS-eigenschap border-collapse?

Standaard hebben aangrenzende tabelcellen gescheiden randen, waardoor dubbele lijnen tussen cellen ontstaan. border-collapse:collapse voegt aangrenzende randen samen tot één lijn — het standaard uiterlijk voor de meeste gegevenstabellen. border-collapse:separate behoudt gescheiden randen en maakt border-spacing tussen cellen mogelijk.

Kan ik tabellen genereren met samengevoegde cellen (colspan/rowspan)?

Deze generator maakt gewone tabellen van CSV-gegevens — alle cellen hebben dezelfde grootte. Voor tabellen met samengevoegde cellen (colspan, rowspan) is handmatige HTML-bewerking nodig. Gebruik dit hulpmiddel voor de basistabel en voeg samenvoegattributen toe in een code-editor.

HTML-tabel vs Markdown-tabel vs spreadsheet

Een HTML-tabel biedt volledige stijlcontrole en wordt weergegeven door browsers en de meeste e-mailclients. Een Markdown-tabel (gescheiden door verticale balken) wordt weergegeven door GitHub, GitLab en de meeste documentatieplatforms — eenvoudiger te schrijven, maar met beperkte stijlopties. Een spreadsheet (Excel, Google Sheets, LibreOffice) is beter voor gegevensanalyse met formules, sorteren en interactief filteren. Kies HTML voor webintegratie, Markdown voor technische documentatie en spreadsheets voor gegevensanalyse.

☕ Buy me a coffee