WCAG-succescriterium 4.1.1 Parsen

Vervallen

Let op: De werkgroep die WCAG maakt heeft 4.1.1 de afgelopen jaren besproken en vastgesteld dat dit criterium tegenwoordig niet meer relevant is, omdat browsers en hulptechnologieën intussen zijn verbeterd (zie de WCAG FAQ). Het criterium is misschien in jouw situatie niet meer van toepassing. In WCAG-versie 2.2 is het helemaal verwijderd. In versie 2.1 is een opmerking toegevoegd dat content in HTML of XML automatisch aan het criterium voldoet. Zie ook: Wat is verplicht?.

W3C referenties WCAG-versie 2.1

• Engelse tekst van het WCAG-succescriterium: 4.1.1 Parsing.
• Nederlandse vertaling van het WCAG-succescriterium: 4.1.1 Parsen.
• Engelstalige informatie op How to Meet WCAG: Quick Reference 4.1.1 Parsing.
• Engelstalige toelichting: Understanding SC 4.1.1 Parsing.

Uitleg

De 'markup' van pagina's, denk aan bijvoorbeeld HTML-code, moet voldoen aan bepaalde technische voorwaarden. Zo wordt de samenwerking tussen webpagina's, browsers en hulptechnologieën minder foutgevoelig.

Er zijn 4 voorwaarden gedefinieerd.

1. Elementen zijn volgens hun specificaties afgesloten

Denk hier bijvoorbeeld aan headings, divs, spans en andere elementen die een sluittag vereisen. Een <div> moet afsluiten met een </div>.

2. Elementen zijn genest volgens hun specificaties

Verkeerd nesten van elementen kan voorkomen bij interactieve elementen: een button die een tweede button bevat. Of bij het verkeerd combineren van elementen: een label die een link bevat. Daarnaast moeten bijvoorbeeld lists en definition lists goed opgebouwd zijn.

Silvestar Bistrović beschrijft een aantal Common nesting issues in HTML.

3. Elementen bevatten geen dubbele attributen

Gebruik een attribuut maximaal één keer. Vermijd bijvoorbeeld meerdere class-attributen:

<!-- Foute code, niet gebruiken -->
<h1 class="heading" class="x-large">Contact</h1>

In het geval van het class-attribuut scheid je meerdere waarden met een spatie:

<h1 class="heading x-large">Contact</h1>

4. Alle ID's zijn uniek, behalve waar de specificatie deze eigenschappen toelaat

Dit is voor formulieren belangrijk. Labels en formuliervelden zijn via een ID aan elkaar gekoppeld. Komt een ID meerdere keren voor op een pagina, dan kan het verkeerde label bij een formulierveld worden voorgelezen.

In code:

<label for="kleur">Wat is je lievelingskleur?</label> <input type="text" id="kleur" name="lievelingskleur" />

Bij de richtlijnen over labels staat hoe deze for/id relatie werkt.

Een ander probleem is het toevoegen van twee keer hetzelfde formulier met hetzelfde formulier-ID, de foutafhandeling staat dan misschien bij het verkeerde formulier.

Gebruikersonderzoek

Heb je gebruikersonderzoek gedaan dat betrekking heeft op dit succescriterium en wil je dit delen? Kijk eens bij Gebruikersonderzoeken delen op gebruikersonderzoeken.nl.

Hoe te testen

• Controleer de webpagina op de Markup Validation Service.
• axe Devtools markeert enkele (maar niet alle) parse-fouten in de HTML.

Voor developers:

• Gebruik een HTML-linter, of een linter naar keuze die ook voor correcte HTML test.
• Bij twijfel: check de 'Permitted content' bij de 'Technical Summary' van een HTML-element op de MDN-website. Bijvoorbeeld de technische samenvatting voor een link.

Veelgemaakte fouten

Fout: dubbele ID's doordat een formulier meerdere keren wordt gebruikt.

Met sommige formulierenplugins kun je hetzelfde formulier meerdere keren toevoegen op een pagina. Let in dit geval op dat de plugin wel unieke ID's toevoegt aan de velden en het formulier. Dat kan er, naast problemen bij de for/id relaties, ook voor zorgen dat validatiescripts op de verkeerde plek worden uitgevoerd.

Een formulier dat vaak twee keer wordt toegevoegd, is een aanmeldformulier voor de nieuwsbrief. Wil je toch hetzelfde formulier meerdere keren op een pagina, maak dan verschillende formulieren aan.

Aanvullingen of opmerkingen?

Deze pagina's over WCAG worden onderhouden door het NL Design System. Heb je aanvullingen of opmerkingen? Deel je mening op GitHub.