Headings danken hun naam aan de HTML-elementen <h1> tot <h6>, waarbij de “h” staat voor heading (kop). Samen vormen ze de inhoudsopgave van een pagina, net als de hoofdstukken en paragrafen van een boek: de H1 kondigt het onderwerp aan, de H2’s verdelen de grote delen, de H3’s werken een deel verder uit, enzovoort. Browsers, schermlezers en zoekmachines gebruiken die opbouw om te begrijpen hoe de content in elkaar zit.
<h1>Een back-up maken van een WordPress-site</h1>
<h2>Wat je moet back-uppen</h2>
<h3>De bestanden</h3>
<h3>De database</h3>
<h2>Waar je de kopieën bewaart</h2>Waar dienen ze echt voor?
Voor lezers
De meeste mensen scannen een pagina voordat ze gaan lezen. Duidelijke koppen helpen ze het deel te vinden dat hen interesseert. Voor wie een schermlezer gebruikt, is dat nog sterker: die springt van kop naar kop om te navigeren, en een ontbrekend niveau brengt hem in de war. MDN raadt dan ook aan geen niveaus over te slaan (van H2 naar H4) en in het algemeen maar één H1 per pagina te gebruiken.
Voor zoekmachines
Koppen helpen Google te begrijpen waar elke sectie over gaat. De H1, of de meest zichtbare titel, kan ook dienen om de titellink in de resultaten samen te stellen wanneer de title-tag als onbetrouwbaar wordt gezien. Een tussenkop in de vorm van een vraag, gevolgd door een direct antwoord, maakt het ook makkelijker dat een passage als featured snippet wordt overgenomen, al is dat nooit gegarandeerd.
Relativeer het wel: Google geeft aan dat de volgorde van koppen niet uitmaakt voor Zoeken en dat er geen ideaal aantal koppen per pagina is. Een nette hiërarchie is vooral een kwestie van toegankelijkheid en leesbaarheid, wat je zoekmachineoptimalisatie indirect ten goede komt.
Goede praktijken
- Een H1 die het onderwerp aankondigt, in lijn met de title-tag maar niet per se identiek.
- Informatieve tussenkoppen: “Hoelang je back-ups bewaart” zegt meer dan “Deel 2”.
- Een logische hiërarchie, zonder niveaus over te slaan.
- Geen kop voor de opmaak: wil je tekst groter maken, gebruik dan stijl (CSS), geen H-tag.
- Geen opvulling: hetzelfde zoekwoord in elke tussenkop herhalen maakt de pagina vervelend om te lezen en levert niets op.
Voor WordPress
In de meeste thema’s wordt de titel van het bericht al als H1 getoond. Begin je tussenkoppen in de blokeditor dus op niveau H2 met het blok Koptekst, waarvan je het niveau in de werkbalk kiest. Het documentoverzicht bovenaan de editor toont de koppen van het document en waarschuwt bij onjuiste niveaus.
De klassieke valkuilen komen van thema’s en pagebuilders: een logo dat op alle pagina’s in een H1 staat, widgettitels als H2 in de zijbalk, of een “titel”-module die het niveau kiest op basis van de gewenste lettergrootte. Controleer dat via de broncode of met een browserextensie die de opbouw van de pagina tekent. Navigatielinks tussen secties horen bij je interne linkstructuur en mogen koppen nooit vervangen.