Vergelijkingstabellen: Opmaak en Voorbeelden

Een vergelijkingstabel evalueert elke optie op dezelfde beslissingsdimensies, zodat een lezer betekenisvolle verschillen kan zien zonder ze uit afzonderlijke alinea’s te hoeven reconstrueren. Het is een van de meest waardevolle pagina-elementen voor conversie en extractie door antwoordmachines — maar alleen wanneer het wordt gepubliceerd als data en niet als een afbeelding van data.

Legenda: “Inbegrepen” betekent dat de functionaliteit deel uitmaakt van het genoemde abonnement zonder extra kosten. “Niet beschikbaar” betekent dat de aanbieder het niet aanbiedt in dat abonnement. “Onbekend” betekent dat de claim niet kon worden geverifieerd op basis van de genoemde bron. De namen en bedragen hierboven zijn illustratief; de structuur is het productiemodel.

Waarom dit element ertoe doet

Vergelijken kost cognitieve inspanning. Wanneer drie producten in drie aparte secties worden beschreven, moet de lezer elke prijs onthouden, verschillende bewoordingen normaliseren en beslissen of een ontbrekende functie afwezig of slechts niet genoemd is. Een tabel verwijdert die geheugentaak. De rijen geven de beslissingsdimensies weer, de kolommen bevatten de opties, en elke kruising levert het antwoord. De lezer kan langs één optie of over één criterium scannen zonder de relatie kwijt te raken.

Die structuur verbetert ook de machine-uitleesbaarheid: het vermogen van een zoeksysteem of antwoordmachine om de relatie tussen een label en de bijbehorende waarde te behouden bij het hergebruiken van content. Een duidelijke koprij, expliciete rijkoppen, één feit per cel en volledige dimensies creëren een compacte set subject–predicaat–waarde-stellingen. “Relay — minimaal contract — jaarlijks” is eenvoudig te isoleren en citeren. Een gekleurde kaartlayout met dezelfde woorden lijkt voor een ziende bezoeker misschien een tabel, maar legt geen betrouwbare rij-en-kolomrelaties bloot.

Een afbeelding van een tabel is geen vergelijkingstabel. Het is een schermafbeelding met tekst. Een persoon die een schermlezer gebruikt, kan de koppen en cellen niet navigeren. Een lezer kan een prijs niet netjes kopiëren, erin zoeken, tekst vergroten zonder de hele afbeelding te vergroten, of deze aanpassen aan een smal scherm. Crawlers en antwoordmachines kunnen optische tekenherkenning proberen, maar zelfs succesvolle tekenherkenning garandeert niet dat de juiste waarde aan de juiste rij en kolom blijft gekoppeld. Evenzo kan een stapel opgemaakte div-elementen een raster nabootsen terwijl de tabelsemantiek wordt weggegooid. De consequentie is hard: de pagina steekt onderzoeksinspanning in het produceren van feiten en verbergt vervolgens de relaties ervan voor veel mensen en machines.

Wanneer te gebruiken

Gebruik een vergelijkingstabel wanneer lezers ten minste twee opties moeten evalueren op ten minste drie gedeelde dimensies. Geschikte onderwerpen zijn producten, abonnementen, methoden, serviceniveaus, technische specificaties, geschiktheidsregels en een korte gerangschikte lijst. De dimensies moeten vergelijkbaar zijn: prijs tegen prijs, ondersteuningskanaal tegen ondersteuningskanaal, en contracttermijn tegen contracttermijn.

Gebruik er geen alleen omdat er meerdere feiten in rijen passen. Een tweekoloms label-en-waarde-lijst over één object is een specificatietabel, geen vergelijking. Een schema is een dienstregeling. Een matrix met ruwe metingen kan een gegevenstabel zijn waarvan het doel analyse is in plaats van keuze. Een lang narratief argument hoort thuis in proza, omdat een cel geen mini-essay mag bevatten.

Bijna-raakvlakken vereisen bijzondere aandacht:

• Verschillende criteria voor elke optie: gebruik eerst afzonderlijke profielen, vergelijk vervolgens alleen de gedeelde criteria. Een raster met niet-overeenkomende dimensies creëert een illusie van gelijkwaardigheid.
• Eén oordeel zonder ondersteunende dimensies: gebruik een directe aanbeveling en leg de redenering uit. Een tabel met één rij voegt ceremonie toe, geen duidelijkheid.
• Meer dan vijf optiekolommen: splits het veld op publiek of gebruik een filterbare, toegankelijke tabel. Tekst verkleinen tot alles past, maakt het element technisch aanwezig maar praktisch onbruikbaar.
• Een visuele functiechecklist: gebruik alleen een tabel als elk symbool een gedefinieerde betekenis heeft en elke optie voor elke rij een antwoord krijgt.
• Vaak veranderende live data: gebruik een onderhouden gegevensbron en een zichtbare verificatiedatum. Als geen eigenaar het actueel kan houden, publiceer de tabel dan niet.

Waar te plaatsen

Plaats de primaire vergelijkingstabel nadat de pagina het publiek, de selectiemethode en de dimensies heeft gedefinieerd, maar vóór lange optie-voor-optie-beoordelingen. Lezers hebben voldoende context nodig om de rijen te interpreteren; ze moeten niet de hele pagina hoeven te lezen voordat ze de vergelijking krijgen.

Op een A vs B-pagina volgt de hoofdtabel normaal gesproken na het directe antwoord en een korte notitie “hoe we vergeleken hebben”. Op een shortlist-pagina volgt deze na de inclusiecriteria en vóór gedetailleerde vermeldingen. Een kleinere specificatietabel kan verschijnen in een productsectie, maar mag niet in tegenspraak zijn met de primaire tabel of een andere betekenis introduceren voor hetzelfde label.

Plaats de tabel niet direct naast een andere dichte vergelijkingstabel, een niet-gerelateerde call-to-action of een volledige schermbrede schermafbeelding. Concurrerende rasters maken het leespad onduidelijk. Plaats geen promotionele banner tussen het bijschrift en de tabel, of een bronnoot tussen een rij en het feit dat het kwalificeert. Houd het bijschrift, de verificatiedatum, legenda, tabel en bronnoot als één afgebakende eenheid. Een call-to-action mag volgen op het verklarende oordeel, niet het bewijs onderbreken.

Anatomie

De gelabelde afbeelding moet deze gebieden identificeren zonder de uitleg in het asset zelf te verwerken:

1. Bijschrift: vermeldt wat wordt vergeleken, voor wie, en onder welk abonnement of scenario.
2. Verificatiedatum: geeft de exacte datum waarop prijzen en beschikbaarheid zijn gecontroleerd.
3. Kolomkoppen: noemen de opties; de eerste kop noemt de kolom met beslissingsdimensies.
4. Rijkoppen: benoemen elk één beslissingsrelevante dimensie.
5. Hoofdcellen: bevatten één feit, één getal met eenheid, of één gedefinieerd symbool.
6. Gemarkeerde kolom: geeft de redactionele aanbeveling aan wanneer die bestaat; het verandert of verbergt nooit de onderliggende feiten.
7. Legenda: definieert elk symbool en statuslabel in zichtbare tekst.
8. Bronnoot: noemt de primaire bron of methode die is gebruikt om claims te verifiëren.

Weergegeven legenda: ✓ = beschikbaar in het gespecificeerde abonnement; — = niet beschikbaar in dat abonnement; N.V.T. = de dimensie is niet van toepassing; Onbekend = het team kon het feit niet verifiëren. Het gepubliceerde onderdeel moet deze betekenissen ook blootstellen aan ondersteunende technologie — bijvoorbeeld zichtbare of visueel verborgen tekst in elke cel — en niet alleen op de tekens vertrouwen.

Ontwerpvoorbeelden

Elke variant gebruikt dezelfde semantische kern. Visuele behandelingen kunnen nadruk en dichtheid veranderen, maar mogen cellen niet in afbeeldingen veranderen, koppen verwijderen, cellen samenvoegen of betekenis alleen door kleur coderen.

Standaard: twee tot vier opties, drie tot acht beslissingsrijen, geen redactionele markering. Dit is de standaard wanneer de pagina afwegingen uitlegt in plaats van één winnaar aan te wijzen.

Gemarkeerde aanbeveling: één optiekolom mag een tekstlabel krijgen zoals “Beste voor kleine teams.” Kleur is aanvullend. Markering mag de rijvolgorde niet wijzigen, nadelen niet verbergen of de tekst van een andere optie een lager contrast geven.

Symbool-gestuurd: geschikt voor herhaalde binaire beschikbaarheidsfeiten. Gebruik het alleen wanneer de legenda zichtbaar is en elke cel een toegankelijk tekstequivalent behoudt. Prijzen, limieten en kwalificaties blijven tekst.

Mobiel met blijvende eerste kolom: de tabel scrollt horizontaal binnen zijn eigen gelabelde container. De pagina zelf mag nooit horizontaal scrollen krijgen. Houd de eerste kolom blijvend zodat een lezer de dimensie kan onthouden terwijl hij door opties beweegt; behoud toetsenbordtoegang en een zichtbare focusstatus voor het scrollgebied.

Parameters

De onderstaande parameters vormen het draagbare contentcontract. “Bron” betekent waar de auteur of renderer de waarde vandaan haalt, niet het bewijs dat voor een commerciële claim wordt aangehaald.

Drie optiekolommen plus de rijkoppenkolom is een gangbare, leesbare standaard. Zes kolommen totaal is de normale bovengrens voor een redactionele tabel. Een grotere dataset vraagt om bewust filteren of segmenteren, niet om steeds kleinere typografie.

Syntaxis en codevoorbeelden

Alle drie de vormen moeten naar hetzelfde bijschrift, controledatum, kolomvolgorde, rijen, legenda en markering verwijzen. De Markdown-pijptabel is brongegevens binnen een getypeerde directive; het buitenste element levert metadata en gedrag.

Draagbare Markdown-directive

:::comparison-table{caption="E-mailplatforms voor een team van 10 personen" verification-date="2026-08-27" highlight-column="relay"}
| Beslissingsdimensie | Northstar | Relay | Postbox |
|---|---:|---:|---:|
| Maandprijs, 10 gebruikers | $90 | $120 | Niet beschikbaar |
| Goedkeuringsworkflow | Inbegrepen | Inbegrepen | Niet beschikbaar |
| Minimaal contract | Maandelijks | Jaarlijks | Onbekend |

Legenda: Inbegrepen = onderdeel van het genoemde abonnement; Niet beschikbaar = niet aanwezig in het abonnement; Onbekend = niet geverifieerd.

Bron: abonnements- en prijspagina's van de aanbieder.
:::

Hugo shortcode

De bestaande generieke tabelhelper bevat geen bijschrift, verificatiedatum, rijkoppenbereik, legenda, bron of markering als eersteklas velden. Totdat de renderer aan dit contract voldoet, gebruik semantische HTML voor een live vergelijking in plaats van een visueel vergelijkbaar maar structureel onvolledig raster te accepteren. De beoogde Hugo-mapping is:

{{< comparison-table caption="E-mailplatforms voor een team van 10 personen" verification-date="2026-08-27" highlight-column="relay" >}}
| Beslissingsdimensie | Northstar | Relay | Postbox |
|---|---:|---:|---:|
| Maandprijs, 10 gebruikers | $90 | $120 | Niet beschikbaar |
| Goedkeuringsworkflow | Inbegrepen | Inbegrepen | Niet beschikbaar |
| Minimaal contract | Maandelijks | Jaarlijks | Onbekend |

Legenda: Inbegrepen = onderdeel van het genoemde abonnement; Niet beschikbaar = niet aanwezig in het abonnement; Onbekend = niet geverifieerd.

Bron: abonnements- en prijspagina's van de aanbieder.
{{< /comparison-table >}}

De renderer moet een native <table class="art-table">, <caption>, <thead> en <tbody> uitvoeren; scope="col" op kolomkoppen; scope="row" op rijkoppen; en een omsloten horizontaal scrollgebied. De notatie is geen toestemming om kaarten of een afbeelding te gebruiken.

WordPress-block of shortcode

[comparison_table caption="E-mailplatforms voor een team van 10 personen" verification_date="2026-08-27" highlight_column="relay"]
Beslissingsdimensie | Northstar | Relay | Postbox
Maandprijs, 10 gebruikers | $90 | $120 | Niet beschikbaar
Goedkeuringsworkflow | Inbegrepen | Inbegrepen | Niet beschikbaar
Minimaal contract | Maandelijks | Jaarlijks | Onbekend
[legend]Inbegrepen = onderdeel van het genoemde abonnement; Niet beschikbaar = niet aanwezig in het abonnement; Onbekend = niet geverifieerd.[/legend]
[source]Abonnements- en prijspagina's van de aanbieder.[/source]
[/comparison_table]

Een aangepast WordPress-block kan dezelfde velden in formulierbesturingselementen tonen. Het moet native tabelmarkup opslaan of renderen en de relaties behouden wanneer stijlen of scripts falen.

Voorbeelden

Goed: een beslissingsklare vergelijking

Dit werkt omdat elk abonnement elke beslissingsdimensie beantwoordt, getallen hun eenheden en stoelaanname bevatten, afwezigheid expliciet is en de controledatum de claim begrenst. De meest beslissingsrelevante rij — totale prijs voor het daadwerkelijke team — staat vooraan. Elke cel bevat één feit in plaats van een verkoopclaim.

Slecht: een overtuigend ogend raster

De slechte versie faalt nog voordat styling wordt overwogen. “Uitstekende waarde” en “krachtig” zijn marketingzinnen zonder toetsbare betekenis. Het vinkje heeft geen legenda. “Geavanceerde tools” is ongedefinieerd. De lege Starter-cel kan afwezig, niet van toepassing, onbekend of vergeten betekenen. “Alles wat je nodig hebt” bundelt een onbeperkte set claims in één cel. De rijen volgen promotionele thema’s in plaats van kopersbeslissingen, er is geen controledatum en er is geen bron.

Herstel het door precieze dimensies te noemen, zoals gastlimiet, periode van goedkeuringsgeschiedenis en beschikbaarheid van eenmalige aanmelding; alle drie abonnementen te verifiëren voor elke rij; lege plekken te vervangen door expliciete statussen; symbolen te definiëren; en de beoordeling te dateren. Als die feiten niet kunnen worden verkregen, publiceer dan een eerlijk “Onbekend”, geen gunstige gevolgtrekking.

Schema-markup en toegankelijkheid

Er is geen algemeen Schema.org-type of eigenschap voor een vergelijkingstabel. Het element blijft onderdeel van de omringende Article-, Product- of verzamelpagina. Feiten kunnen alleen geldige product-, aanbiedings- of beoordelingseigenschappen voeden wanneer de pagina onafhankelijk voldoet aan de geschiktheids- en bewijsregels voor die gestructureerde data. Converteer een gemarkeerde kolom niet naar aggregateRating-, review- of offers-markup, tenzij de onderliggende inhoud die waarden werkelijk levert.

Toegankelijkheid komt voort uit relaties, niet uit uiterlijk. Gebruik <th scope="col"> voor elke optiekop en <th scope="row"> voor elke beslissingsdimensie. Voeg een beknopt <caption> toe dat de tabel identificeert. Vermijd samengevoegde cellen omdat rowspan en colspan navigatie en extractie bemoeilijken; herhaal in plaats daarvan een label of splits de tabel. Houd de bronvolgorde logisch en verwijder de tabel niet uit de toegankelijkheidsboom.

Op kleine schermen plaats je overflow op een container rond de tabel, nooit op de pagina. Geef een toetsenbord-focusbaar scrollgebied een toegankelijke naam en zichtbare focusstatus. Een blijvende eerste kolom kan helpen context te behouden, maar mag geen gefocuste inhoud bedekken of afhankelijk zijn van scripts om gegevens bloot te stellen. Symbolen vereisen zichtbare tekstdefinities en tekstequivalenten op celniveau. Kleur kan een aanbevolen kolom markeren, maar de kop heeft ook een tekstlabel nodig.

Schrijfregels

Kies rijen op basis van beslissingswaarde, niet op gemak. Zet het criterium dat de keuze van de lezer het meest waarschijnlijk verandert eerst, daarna noodzakelijke mogelijkheden, totale kosten, beperkingen, ondersteuning en secundaire details. Alfabetische volgorde is alleen nuttig wanneer lezers aankomen met kennis van de dimensienaam; het is meestal verkeerd voor een koopbeslissing. De navigatievolgorde van de aanbieder is promotionele taxonomie, geen prioriteit van de lezer.

Dimensiepariteit is absoluut: elke optie moet worden beoordeeld op elke rij. Een blanco is nog steeds een antwoord, maar een dubbelzinnig antwoord, dus blanco’s zijn verboden in gepubliceerde tabellen. Gebruik deze statussen precies:

• Niet beschikbaar: de optie biedt de functionaliteit niet onder het genoemde abonnement of de genoemde voorwaarden.
• Niet van toepassing: de dimensie is logischerwijs niet van toepassing op die optie.
• Onbekend: het team kon het antwoord niet verifiëren via een geschikte bron.

Eén cel bevat één feit, getal of gedefinieerd symbool. Voeg eenheden en voorwaarden toe: “$49/maand voor 5 stoelen” is bruikbaar; “Betaalbaar” is dat niet. “10 GB per werkruimte” is bruikbaar; “Ruime opslag” is dat niet. Als een waarde een kwalificatie nodig heeft, houd deze dan kort en voeg de bronnoot toe aan de tabel. Als het een alinea nodig heeft, leg het dan onder de tabel uit en gebruik een beknopt cellabel zoals “Voorwaardelijk.”

Gebruik drie tot acht rijen voor een samenvatting en niet meer dan tien zonder sterke reden. Gebruik twee tot vijf optiekolommen, plus de rijkoppenkolom. Houd koppen concreet en parallel. Plaats geen knoppen, formulieren, automatisch afspelende media, alinea-lange verkoopteksten, getuigenissen, sterbeoordelingen zonder vermelde methodologie of geneste tabellen in cellen. Gebruik nooit samengevoegde cellen in de redactionele vergelijking.

De controledatum is vereist omdat prijzen, voorraad, abonnementsnamen en functiebeschikbaarheid veranderen. Schrijf een exacte datum, niet “recentelijk” of “actueel.” Wijs een eigenaar en beoordelingsfrequentie toe vóór publicatie. Een verouderde tabel is erger dan geen tabel: de schone structuur laat een verouderde claim ongewoon gezaghebbend en gemakkelijk te herhalen lijken.

Posttypen die het gebruiken

De postTypes in de frontmatter is de machineleesbare koppeling naar deze zes documenten. De zichtbare tabel verklaart de redactionele plaatsing die de identifier alleen niet kan overbrengen.

QA-checklist

• De uitvoer is een native HTML-tabel, geen afbeelding, canvas, CSS-grid of stapel div-elementen.
• De tabel heeft een nuttig bijschrift, één duidelijke koprij, kolomkoppenbereik en rijkoppenbereik.
• Elke optie wordt beoordeeld op elke dimensie; geen gepubliceerde cel is blanco.
• “Niet beschikbaar”, “Niet van toepassing” en “Onbekend” worden gebruikt volgens hun specifieke betekenissen.
• Elke cel bevat één feit, getal met eenheid of gedefinieerd symbool — nooit een marketingzin.
• Elk symbool heeft een zichtbare tekstlegenda en een toegankelijk tekstequivalent in zijn cel.
• Rijen zijn geordend op beslissingsrelevantie in plaats van alfabetisch of volgens aanbiedervolgorde.
• De tabel blijft binnen de kolomlimiet, of de inhoud is bewust gesegmenteerd.
• Op mobiel is horizontaal scrollen beperkt tot het gelabelde tabelgebied en de pagina scrollt niet zijwaarts.
• Een blijvende eerste kolom blijft, wanneer gebruikt, leesbaar, toetsenbordveilig en met hoog contrast.
• Geen cellen zijn samengevoegd en geen cellen bevatten geneste tabellen of complexe interactieve besturingselementen.
• Een precieze controledatum en passende primaire bronnoot zijn aanwezig.
• De gemarkeerde kolom, indien aanwezig, heeft een tekstlabel en onderdrukt geen ongunstige feiten.
• De tabel communiceert nog steeds zijn relaties wanneer aangepaste stijlen en scripts niet beschikbaar zijn.

FAQ

Hoeveel opties moet een vergelijkingstabel bevatten?

Gebruik twee tot vijf optiekolommen in de hoofdtabel. Als meer opties nodig zijn, splits de vergelijking dan op in publieksspecifieke tabellen of zorg voor een filterbare interface die native tabelsemantiek behoudt.

Mag een vergelijkingstabel vinkjes en kruisjes gebruiken?

Ja, maar elk symbool heeft een zichtbare tekstlegenda en een toegankelijk tekstequivalent nodig. Een vorm of kleur alleen is geen antwoord omdat lezers niet betrouwbaar kunnen afleiden of het opgenomen, aanbevolen, getest of slechts aanwezig betekent.

Wat moet een lege cel betekenen?

Niets. Lege cellen zijn verboden omdat hun betekenis niet kenbaar is. Schrijf “Niet beschikbaar”, “Niet van toepassing” of “Onbekend” en gebruik elke term volgens zijn gedefinieerde betekenis.

Heeft een vergelijkingstabel gestructureerde data nodig?

Meestal niet. Er bestaat geen algemeen schema voor vergelijkingstabellen. Houd het binnen het geldige schema van de pagina en wijs product-, aanbiedings- of beoordelingseigenschappen alleen toe wanneer de pagina het bewijs heeft dat die eigenschappen vereisen.

Hoe vaak moet de tabel worden gecontroleerd?

Stem de frequentie af op volatiliteit. Prijzen en abonnementsrechten kunnen maandelijkse of driemaandelijkse controle vereisen; stabiele specificaties veranderen mogelijk minder vaak. Toon in elk geval de exacte datum van de laatste controle, zodat lezers zelf de actualiteit kunnen beoordelen.