Tabeller i HTML — table-tagget og semantisk tabeldata

HTML-tabeller bruges til at præsentere relationel og sammenlignelig data i rækker og kolonner — prisoversigter, tekniske specifikationer, statistik og skemaer. For SEO er korrekt tabelstruktur relevant fordi Googlebot bruger semantiske tabel-elementer som <thead>, <th> og <caption> til at forstå tabelindholdet, og velstrukturerede tabeller er en af de hyppigste kilder til featured snippets i søgeresultater for sammenlignings- og specifikationsforespørgsler.

Hvad er HTML-tabeller?

HTML-tabeller bruges til at vise relationel data i rækker og kolonner — prisoversigter, sammenligninger, statistik, specifikationer og skemaer. Tabeller er ikke beregnet til layout (det var en gammel, forkert praksis) men til data der er strukturelt tabelform.

Korrekt tabel-markup hjælper Googlebot med at forstå sammenhængen mellem tabellens data og kan bidrage til featured snippets.

Grundlæggende tabelstruktur

<table>
  <caption>Prissammenligning — løbeskopakker 2026</caption>
  <thead>
    <tr>
      <th scope="col">Pakke</th>
      <th scope="col">Pris</th>
      <th scope="col">Inkluderer</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Basis</td>
      <td>499 kr.</td>
      <td>1 par sko</td>
    </tr>
    <tr>
      <td>Pro</td>
      <td>899 kr.</td>
      <td>2 par sko + taske</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="3">Priser inkl. moms. Levering ikke inkluderet.</td>
    </tr>
  </tfoot>
</table>

Tabelens elementer

<table> er container-elementet for hele tabellen.

caption

<caption> er tabelens overskrift — placeres som første child af <table>. Caption er vigtig for SEO og tilgængelighed: den giver tabellen kontekst og hjælper Googlebot med at forstå hvad data handler om. Skærmlæsere annoncerer caption-teksten når brugeren navigerer til tabellen.

thead, tbody og tfoot

<thead> gruperer header-rækker — indholdet gentages typisk ved print over flere sider. <tbody> gruperer selve tabellens datarækker. <tfoot> gruperer footer-rækker med f.eks. summer, noter eller opsummering.

tr, th og td

<tr> (table row) er en enkelt række. <th> (table header) er en header-celle der vises fed og centreret som standard — brug den til kolonne- og rækkeoverskrifter. <td> (table data) er en almindelig datacelle.

scope-attributten — semantisk kontekst

scope-attributten på <th> fortæller browsers og skærmlæsere om headeren gælder for en kolonne eller en række:

<!-- Kolonneoverskrift -->
<th scope="col">Pris</th>

<!-- Rækkeoverskrift -->
<th scope="row">Januar</th>

<!-- Gruppe af kolonner -->
<th scope="colgroup" colspan="3">Kvartal 1</th>

Korrekt scope er essentielt for at skærmlæserbrugere kan navigere komplekse tabeller og forstå sammenhængen. Google bruger det også som signal om tabelstruktur.

colspan og rowspan

Celler kan spænde over flere kolonner eller rækker:

<td colspan="2">Spænder over to kolonner</td>
<td rowspan="3">Spænder over tre rækker</td>

Brug med måde — for komplekse tabeller med mange colspan/rowspan kan det skabe forvirring for skærmlæsere og Googlebot.

Tabeller til layout — undgå!

I 1990’erne og 2000’erne brugte udviklere tabeller til at opbygge side-layouts — kolonner, header, footer. Det er forkert praksis og bør aldrig bruges i ny kode. Tabel-layout skaber et semantisk rod fordi Googlebot ser “tabel-data” i stedet for layout-elementer, og skærmlæsere har svært ved at navigere den lineære tabel-rækkefølge. Tabeller er desuden stive og ikke responsivt mobile-venlige. Moderne CSS med Flexbox og Grid er langt bedre til layout.

Responsivt tabel-problem

Tabeller bryder responsivt design — de har en fast minimum-bredde baseret på kolonnernes indhold. På smalle mobil-skærme kan tabeller skabe vandret scroll.

Løsninger:

/* Wrap tabellen i en container med overflow-x: auto */
.tabel-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

<div class="tabel-container">
  <table>...</table>
</div>

Alternativt: omform tabellen til kort-layout på mobil via CSS media queries.

Structured data og tabeller

Google understøtter ikke et specifikt Table schema, men indhold i velstrukturerede tabeller kan vises som featured snippets i SERP. Prisoversigter og sammenligninger i tabelformat er hyppige featured snippet-kandidater.

---

Hvornår skal jeg bruge table frem for en liste?

Brug tabeller til data med klare relationer på tværs af rækker og kolonner — sammenligninger, specifikationer og skemaer. Brug lister til sekventielle eller grupperede elementer uden kolonne-relation.

Er caption obligatorisk?

Teknisk nej, men stærkt anbefalet. Caption giver tabellen en titel der er synlig for alle brugere, hjælper skærmlæsere med at annoncere tabelindholdet og giver Googlebot kontekst om hvad dataene handler om.

Kan tabeller hjælpe med featured snippets?

Ja. Google viser tabeller som featured snippets for sammenlignings-forespørgsler. Korrekt tabel-markup med caption og <th>-headers øger chancen for tabel-featured snippets.

Sidst opdateret: marts 2026. Denne artikel er en del af Stegger.dk’s SEO-ordbog. → Denne artikel er en del af Indholdselementer i kode — Links, billeder og formularer.