Audithouse logo
Offerte aanvragen
Audithouse logo

Description list

De description list kan gebruikt worden om informatie programmatisch aan elkaar te koppelen. Zo kunnen schermlezers ook de onderlinge relaties bepalen en overbrengen aan gebruikers. Op deze pagina vind je een voorbeeld van een digitaal toegankelijke description list.

Auteur

Vincent van Brakel

Als onderzoeker digitale toegankelijkheid voert Vincent ruim 8 jaar audits uit voor websites en apps. De focus ligt hierbij niet alleen op de criteria, maar vooral op de drempels voor de doelgroep en hoe we deze samen kunnen oplossen.

In dit artikel

Inhoudsopgave

Plan een intakegesprek

De description list (dl)

Een description list <dl> gebruik je om paren van term + uitleg/waarde te markeren, zoals contactgegevens, afkortingen met betekenis of productspecificaties. In HTML doe je dat met:

  • <dl>: de description list zelf.
  • <dt>: de term (bijv. “Telefoonnummer”)
  • <dl>: de bijbehorende waarde of uitleg (bijv. “070 217 01 07”)

Door deze semantiek kunnen schermlezers en andere hulpmiddelen de relatie tussen label en waarde goed begrijpen. Gebruik een description list dus niet voor gewone opsommingen; daar zijn <ul> en <ol> voor bedoeld.

Voorbeeld van een description list

In de onderstaande voorbeelden staat de broncode van een description list voor contactgegevens en de description list zoals bezoekers van de website deze zien.

HTML-broncode van een description list

&lt;dl&gt;

&lt;dt&gt;Telefoonnummer: &lt;/dt&gt;
&lt;dd&gt;&lt;a href="tel:+31702170107"&gt;070 217 01 07&lt;/a&gt;&lt;/dd&gt;

&lt;dt&gt;E-mailadres: &lt;/dt&gt;
&lt;dd&gt;&lt;a href="mailto:info@audithouse.nl"&gt;info@audithouse.nl&lt;/a&gt;&lt;/dd&gt;

&lt;/dl&gt;

Voorbeeld zoals bezoekers deze zien

Telefoonnummer 070 217 01 07 E-mailadres info@audithouse.nl

Toegankelijkheidsonderzoek

Audit House onderzoekt websites en apps op de mate waaraan ze aan de WCAG 2.2 voldoen. Dit doen wij volgens de WCAG-EM methode. Binnen 30 dagen inzicht in de toegankelijkheid van je website of app? Neem contact op voor meer inofrmatie.

Plan een intakegesprek
WCAG-Audit