Wat niveau AA werkelijk betekent
WCAG kent drie niveaus. A is de bodem, AA is het niveau waarvan Europese aanbestedingen en EN 301 549 uitgaan, en AAA is een streven dat niemand over een hele website hoeft te halen. Vraagt een aanbesteding om “WCAG 2.2 AA”, dan betekent dat elk A- en AA-succescriterium, op elke pagina binnen de reikwijdte, in elke toestand die een gebruiker kan bereiken.
Succescriteria zijn toetsbare uitspraken, geen technieken. “Contrast (minimum)” zegt niet welk token u moet wijzigen; het zegt welke gemeten verhouding een stuk tekst moet halen. Dat onderscheid telt in een audit: een bevinding is verdedigbaar wanneer zij het criterium, het element en de meting noemt, niet wanneer zij een gereedschap noemt.
Een website slaagt of zakt niet als geheel. Conformiteit wordt per pagina geclaimd, en één niet-conform element op een pagina haalt de claim voor die pagina onderuit. Daarom wint doorlopende bewaking het van een eenmalige audit: een thema-update kan de claim voor honderd pagina’s tegelijk ongedaan maken.
De negen criteria die WCAG 2.2 toevoegde
Zes ervan staan op A of AA en vallen dus binnen de reikwijdte van een EN 301 549-beoordeling. De laatste kolom zegt of een scanner het kan beoordelen of dat een mens dat moet doen.
| SC | Naam | Niveau | Hoe het wordt getoetst |
|---|---|---|---|
| 2.4.11 | Focus niet afgedekt (minimum) | AA | handmatig |
| 2.4.12 | Focus niet afgedekt (uitgebreid) | AAA | handmatig |
| 2.4.13 | Verschijning van de focus | AAA | handmatig |
| 2.5.7 | Sleepbewegingen | AA | handmatig |
| 2.5.8 | Doelgrootte (minimum) | AA | geautomatiseerd |
| 3.2.6 | Consistente hulp | A | handmatig |
| 3.3.7 | Overbodige invoer | A | handmatig |
| 3.3.8 | Toegankelijke authenticatie (minimum) | AA | deels geautomatiseerd |
| 3.3.9 | Toegankelijke authenticatie (uitgebreid) | AAA | handmatig |
Wat de scanner controleert, regel voor regel
Elke geautomatiseerde regel draagt beide verwijzingen, zodat één bevinding voor de ontwikkelaar leest als een WCAG-succescriterium en voor de beoordelaar als een artikel uit EN 301 549. Dit zijn de regels in de publieke koppeltabel; de catalogus in het product is groter en wordt centraal onderhouden.74 rules seeded
| Regel | What it detects | WCAG | EN 301 549 | Gebruikelijke impact |
|---|---|---|---|---|
| accesskeys | Twee elementen claimen dezelfde sneltoets | 2.1.1 | 9.2.1.1 | serious |
| area-alt | Gebied in een afbeeldingskaart zonder alternatieve tekst | 1.1.1, 2.4.4, 4.1.2 | 9.1.1.1, 9.2.4.4, 9.4.1.2 | critical |
| aria-allowed-attr | ARIA-attribuut niet toegestaan bij deze rol | 4.1.2 | 9.4.1.2 | critical |
| aria-command-name | Aangepaste knop, link of menu-item zonder naam | 4.1.2 | 9.4.1.2 | serious |
| aria-hidden-body | Volledig document verborgen voor hulptechnologie | 4.1.2 | 9.4.1.2 | critical |
| aria-hidden-focus | Focusbaar element verborgen voor hulptechnologie | 1.3.1, 4.1.2 | 9.1.3.1, 9.4.1.2 | serious |
| aria-input-field-name | Aangepast invoerveld zonder toegankelijke naam | 4.1.2 | 9.4.1.2 | serious |
| aria-meter-name | Meter zonder toegankelijke naam | 1.1.1 | 9.1.1.1 | serious |
| aria-progressbar-name | Voortgangsindicator zonder toegankelijke naam | 1.1.1 | 9.1.1.1 | serious |
| aria-required-attr | ARIA-rol mist een vereist attribuut | 4.1.2 | 9.4.1.2 | critical |
| aria-required-children | Samengestelde rol zonder de vereiste onderliggende rollen | 1.3.1 | 9.1.3.1 | critical |
| aria-required-parent | ARIA-rol buiten de vereiste container geplaatst | 1.3.1 | 9.1.3.1 | critical |
| aria-roles | Rolwaarde is geen erkende ARIA-rol | 4.1.2 | 9.4.1.2 | critical |
| aria-toggle-field-name | Selectievakje, keuzerondje of schakelaar zonder toegankelijke naam | 4.1.2 | 9.4.1.2 | serious |
| aria-tooltip-name | Tooltiprol zonder tekst | 4.1.2 | 9.4.1.2 | serious |
| aria-valid-attr | Attribuutnaam is geen geldig ARIA-attribuut | 4.1.2 | 9.4.1.2 | critical |
| aria-valid-attr-value | ARIA-attribuut verwijst naar een waarde die niet bestaat | 4.1.2 | 9.4.1.2 | critical |
| audio-caption | Audio zonder ondertitel- of transcriptiespoor | 1.2.1 | 9.1.2.1 | critical |
| autocomplete-valid | autocomplete-waarde niet herkend | 1.3.5 | 9.1.3.5 | serious |
| avoid-inline-spacing | Tekstafstand vastgezet door een inline stijl | 1.4.12 | 9.1.4.12 | serious |
| blink | Knipperende inhoud die niet te stoppen is | 2.2.2 | 9.2.2.2 | serious |
| button-name | Knop zonder toegankelijke naam | 4.1.2 | 9.4.1.2 | critical |
| bypass | Geen manier om de herhaalde navigatie over te slaan | 2.4.1 | 9.2.4.1 | serious |
| color-contrast | Tekstcontrast onder de vereiste verhouding | 1.4.3 | 9.1.4.3 | serious |
| css-orientation-lock | Inhoud vastgezet op één schermoriëntatie | 1.3.4 | 9.1.3.4 | serious |
| definition-list | Definitielijst opgebouwd uit verkeerde onderliggende elementen | 1.3.1 | 9.1.3.1 | serious |
| dlitem | Definitieterm of -omschrijving buiten een lijst | 1.3.1 | 9.1.3.1 | serious |
| document-title | Pagina heeft geen titel | 2.4.2 | 9.2.4.2 | serious |
| duplicate-id-active | Dubbel id op een interactief element | 4.1.1 | 9.4.1.1 | serious |
| empty-heading | Kop zonder tekst | 1.3.1 | 9.1.3.1 | minor |
| empty-table-header | Tabelkopcel zonder tekst | 1.3.1 | 9.1.3.1 | minor |
| focus-order-semantics | Focusbaar element zonder interactieve rol | 2.4.3 | 9.2.4.3 | minor |
| form-field-multiple-labels | Veld gekoppeld aan meer dan één label | 3.3.2 | 9.3.3.2 | moderate |
| frame-title | Frame zonder titel | 2.4.1, 4.1.2 | 9.2.4.1, 9.4.1.2 | serious |
| heading-order | Kopniveau overgeslagen | 1.3.1 | 9.1.3.1 | moderate |
| html-has-lang | Paginataal niet opgegeven | 3.1.1 | 9.3.1.1 | serious |
| html-lang-valid | Taalcode van de pagina is niet geldig | 3.1.1 | 9.3.1.1 | serious |
| html-xml-lang-mismatch | lang en xml:lang komen niet overeen | 3.1.1 | 9.3.1.1 | moderate |
| identical-links-same-purpose | Links met dezelfde tekst leiden naar iets anders | 2.4.9 | 9.2.4.9 | minor |
| image-alt | Afbeelding zonder tekstalternatief | 1.1.1 | 9.1.1.1 | critical |
| input-button-name | Invoerknop zonder waarde of label | 4.1.2 | 9.4.1.2 | critical |
| input-image-alt | Afbeeldingsknop zonder alternatieve tekst | 1.1.1, 4.1.2 | 9.1.1.1, 9.4.1.2 | critical |
| label | Formulierveld zonder programmatisch label | 1.3.1, 4.1.2 | 9.1.3.1, 9.4.1.2 | critical |
| landmark-banner-is-top-level | Banner-landmark genest in een ander gebied | 1.3.1 | 9.1.3.1 | moderate |
| landmark-complementary-is-top-level | Complementary-landmark genest in een ander gebied | 1.3.1 | 9.1.3.1 | moderate |
| landmark-no-duplicate-main | Meer dan één main-landmark op de pagina | 1.3.1 | 9.1.3.1 | moderate |
| landmark-one-main | Pagina heeft geen enkel main-landmark | 1.3.1, 2.4.1 | 9.1.3.1, 9.2.4.1 | moderate |
| landmark-unique | Twee landmarks delen een rol en een naam | 1.3.1 | 9.1.3.1 | moderate |
| link-name | Link zonder waarneembare tekst | 2.4.4, 4.1.2 | 9.2.4.4, 9.4.1.2 | serious |
| list | Lijst bevat elementen die geen lijstitems zijn | 1.3.1 | 9.1.3.1 | moderate |
| listitem | Lijstitem buiten een lijst | 1.3.1 | 9.1.3.1 | serious |
| marquee | Schuivende marquee-inhoud | 2.2.2 | 9.2.2.2 | serious |
| meta-viewport | Zoomen uitgeschakeld door de viewport-metatag | 1.4.4 | 9.1.4.4 | serious |
| nested-interactive | Interactief element genest in een ander | 4.1.2 | 9.4.1.2 | serious |
| no-autoplay-audio | Audio start vanzelf en duurt langer dan drie seconden | 1.4.2 | 9.1.4.2 | moderate |
| object-alt | Ingesloten object zonder tekstalternatief | 1.1.1 | 9.1.1.1 | serious |
| p-as-heading | Alinea opgemaakt om op een kop te lijken | 1.3.1 | 9.1.3.1 | serious |
| page-has-heading-one | Pagina heeft geen kop van niveau één | 1.3.1 | 9.1.3.1 | moderate |
| presentation-role-conflict | Presentatierol tenietgedaan door andere opmaak | 4.1.2 | 9.4.1.2 | minor |
| region | Inhoud staat buiten elk landmark | 1.3.1 | 9.1.3.1 | moderate |
| role-img-alt | Element met rol img heeft geen alternatieve tekst | 1.1.1 | 9.1.1.1 | serious |
| scrollable-region-focusable | Scrollbaar gebied is niet met het toetsenbord te bereiken | 2.1.1 | 9.2.1.1 | serious |
| select-name | Keuzelijst zonder toegankelijke naam | 1.3.1, 4.1.2 | 9.1.3.1, 9.4.1.2 | critical |
| server-side-image-map | Server-side afbeeldingskaart in gebruik | 2.1.1 | 9.2.1.1 | minor |
| summary-name | Samenvatting van een uitklapelement zonder naam | 4.1.2 | 9.4.1.2 | serious |
| svg-img-alt | Betekenisvolle SVG zonder tekstalternatief | 1.1.1 | 9.1.1.1 | serious |
| tabindex | Positieve tabindex doorbreekt de natuurlijke focusvolgorde | 2.4.3 | 9.2.4.3 | serious |
| table-fake-caption | Tabeltitel opgemaakt als bijschrift in plaats van als zodanig gemarkeerd | 1.3.1 | 9.1.3.1 | serious |
| target-size | Aanraakdoel kleiner dan 24 bij 24 pixels | 2.5.8 | 9.2.5.8 | moderate |
| td-has-header | Datacel in een grote tabel heeft geen koptekst | 1.3.1 | 9.1.3.1 | serious |
| td-headers-attr | Datacel niet gekoppeld aan een koptekst | 1.3.1 | 9.1.3.1 | serious |
| th-has-data-cells | Tabelkop zonder gekoppelde datacellen | 1.3.1 | 9.1.3.1 | serious |
| valid-lang | Taal van een passage is geen geldige code | 3.1.2 | 9.3.1.2 | serious |
| video-caption | Video zonder ondertitelspoor | 1.2.2 | 9.1.2.2 | critical |
Wat automatisering wel en niet ziet
Bij elke score in Conforma staat dezelfde zin, want het getal is maar een deel van het beeld. Geautomatiseerde regels zijn uitstekend in meetbare eigenschappen en blind voor bedoeling.
Geautomatiseerd testen dekt slechts een deel van de toegankelijkheidsbelemmeringen. Voor een volledige beoordeling is handmatige verificatie noodzakelijk.
Hoe Conforma WCAG 2.2 AA toetst
- Geautomatiseerde regels lopen op elke pagina van een scan, en elke overtreding wordt weggeschreven als bevinding met de regel, de selector, het HTML-fragment en een schermafbeelding van het element op zijn plek.
- Elke bevinding draagt beide verwijzingen: het WCAG-succescriterium en het artikel uit EN 301 549, zodat een rapport voor een ontwikkelaar en voor een inkoopbeoordelaar hetzelfde leest.
- Bevindingen krijgen een vingerafdruk uit regel, selector en pad. Een herstel dat na een deploy terugkomt, wordt gemeld als regressie in plaats van stilletjes als nieuw werk geteld.
- De handmatige checklist dekt wat regels niet kunnen beoordelen, met videobewijs, de gebruikte hulptechnologie en een tester met naam, en wordt verzegeld in hetzelfde bewijspakket als de geautomatiseerde uitvoering.
Vragen die wij hierover krijgen
Is WCAG 2.2 AA hetzelfde als voldoen aan de toegankelijkheidswet?
Nee. De European Accessibility Act is de wet, EN 301 549 is de geharmoniseerde norm waarmee dat wordt aangetoond, en EN 301 549 verwijst voor webcontent naar WCAG 2.2 niveau AA. AA halen is de technische grondslag voor een verklaring, geen certificaat.
Moeten wij nu van 2.1 naar 2.2?
Voor alles wat nieuw is: ja, dat is het veilige antwoord. WCAG 2.2 is achterwaarts compatibel: content die aan 2.2 voldoet, voldoet ook aan 2.1, dus toetsen tegen de nieuwere versie kost niets en dekt beide.
Betekent een perfecte geautomatiseerde score dat de website conform is?
Het betekent dat er op de gescande pagina’s geen geautomatiseerde overtreding is aangetroffen. Toetsenbordbediening, focusvolgorde en de gang van de schermlezer vragen nog altijd een mens voordat er iets wordt beweerd.