Heading
UX Richtlijnen
Gebruik en toegankelijkheid van headings (koppen)
- Gebruik altijd maar één H1 heading op een pagina met digitale content.
- Gebruik alleen een heading als er content onder staat.
- Gebruikers van screenreaders gebruiken headings vaak om een indruk te krijgen van de structuur van een pagina.
- Gebruik headings niet voor de opmaak maar alleen voor tekstuele hiërarchie van de content.
- Sla geen niveaus over met het gebruik van headings, bijvoorbeeld geen H3 gebruiken zonder dat er een voorgaande H2 is.
- Beperk het aantal headings op een pagina. In de meeste gevallen hebben teksten niet meer dan
<h2>
koppen nodig en heel soms een<h3>
. Alleen voor uitzonderlijk lange of complexe pagina's zouden<h5>
en<h6>
nodig zijn.
Terminologie
- heading: de HTML specificatie van
h1
/h2
/h3
/h4
/h5
/h6
. "h1" is nogal kortaf, daarom beschrijven we de token als "heading-1".
In HTML wordt de term "heading" gebruikt, niet "header" (dat is ook iets anders). Let dus op om niet per ongeluk "header" te schrijven in plaats van "heading".
Heading 1 Component
- HTML
- CSS
- Web Component
Heading 2 Component
- HTML
- CSS
- Web Component
Heading 3 Component
- HTML
- CSS
- Web Component
Heading 4 Component
- HTML
- CSS
- Web Component
Heading 5 Component
- HTML
- CSS
- Web Component