R-pd.3.2

Markup voor kopregels

Als de juiste headerelementen in een document worden gebruikt, kan de structuur eenvoudiger uit een document worden afgeleid. Voor veel mensen kan een eenvoudige zoekopdracht naar de headers van een pagina een snel overzicht van de inhoud geven.

Uitleg van deze richtlijn

Voor kopregels heeft de webontwikkelaar de beschikking over de heading elementen: h1, h2, h3, h4, h5 en h6. De <h1></h1> tags worden gebruikt voor de belangrijkste kopregel(s) op een pagina, de <h2></h2> voor kopregels hieronder. Daaronder volgen kopregels met <h3></h3>, enzovoort.

De webontwikkelaar moet dus nagaan waar binnen de hiërarchie een kopregel thuishoort en de heading-elementen van overeenkomstig niveau te gebruiken.

Let op: Het is niet raadzaam om niveaus in de heading-hiërarchie over te slaan. Zie R-pd.3.3: Sla in de markup geen niveaus in de hiërarchie van kopregels over.

Navigatiemenu’s en andere secundaire paginainhoud

Een heading hiërarchie heeft niet alleen betrekking op de primaire inhoud van een pagina, maar op alle inhoud van een pagina. Een h1 element vormt de hoofdkopregel van een pagina; het belangrijkste onderwerp van die pagina. Alles wat op die pagina voorkomt, is gerelateerd, en ondergeschikt, aan dit onderwerp.

Op de meeste webpagina’s is echter meer te vinden dan alleen een nieuwsartikel, een fotogalerie of andere specifieke inhoud: een pagina bevat ook navigatie- en subnavigatiemenu’s, lijsten met de laatste nieuwstitels, kolommen met links naar aanverwante inhoud, enzovoorts. In dit verband noemen we dat secundaire inhoud.

Het uiterlijk van de kopregels van secundaire inhoud is te beïnvloeden met CSS (Cascading Style Sheets) dat kan worden toegepast op kopregels van een speciale klasse (het class attribuut).

h2 kopregel van een speciale klasse (HTML)

Of je plaatst een ander element van een speciale klasse om alle secundaire inhoud heen om deze te groeperen.

Gegroepeerde kopregels (HTML)

Andere soorten kopregels

Naast de heading-elementen heeft men de beschikking over enkele andere elementen voor kopregels in bijzondere situaties. Hiertoe behoren onder andere caption voor tabellen en legend voor formulieren.

Referenties naar subonderwerpen

Het komt voor dat een pagina meerdere kopregels bevat. Men wil soms naar een specifiek onderdeel op deze pagina linken. Dit is mogelijk als aan elke kopregel een uniek anker wordt meegegeven.

Ankers aan kopregels geven (HTML)

Er kan ook een uniek nummer worden gebruikt, zoals een (sub-)hoofdstuknummering. Bijvoorbeeld id="H3-2-4a". (Het id attribuut mag geen punten bevatten en moet beginnen met een letter, vandaar het gebruik van streepjes en de letter H)

Naar deze ankers kan vanaf andere pagina’s (maar ook op dezelfde pagina) gelinkt worden, zoals in het volgende voorbeeld.

Naar ankers linken (HTML)

Het pro-actief aangeven van ankers in enkele kopregels van een pagina, vergroot de mogelijkheden om informatie te linken en verhoogt daardoor dus de bereikbaarheid van de informatie. Zie ook Links naar pagina-ankers.

Links en referenties

• Aan de slag: Beschrijvende markup

Gerelateerde richtlijnen

• R-pd.3.3: Sla in de markup geen niveaus in de hiërarchie van kopregels over.
• R-pd.11.7: Gebruik het caption element of heading markup voor het geven van een kopregel boven een tabel.
• R-pd.2.9: Bouw een website volgens de Web Content Accessibility Guidelines (WCAG 1.0) van het W3C.

Bijbehorende ijkpunten normdocument

• IJkpunt 3.5: Gebruik headerelementen om de documentstructuur over te brengen en gebruik ze volgens de specificatie.