Ugyldig ARIA-attributværdi

Silktide tjekker værdien af hver ARIA-attribut på dine sider op mod de værdier, som standarden tillader for den. En attribut med en forkert værdi, såsom en afkrydsningsfelttilstand på "yes" i stedet for "true", ignoreres af browsere, så den tilstand, den beskriver, aldrig annonceres.

<!-- Problem: "yes" er ikke en gyldig værdi, tilstanden udelades -->
<div role="checkbox" aria-checked="yes">Subscribe</div>

<!-- Løsning: Brug det definerede token -->
<div role="checkbox" aria-checked="true">Subscribe</div>

Hvorfor det er vigtigt

Hver -attribut definerer præcist, hvilke værdier den accepterer, og browsere kasserer alt andet frem for at gætte. Fejlene er som regel intuitivt udseende værdier – aria-expanded="1", aria-checked="yes", aria-level="0" – som består enhver visuel test, mens brugere af får et element uden annonceret tilstand: en menu, der aldrig angiver, om den er åben, et afkrydsningsfelt, der aldrig angiver, om det er afkrydset.

Sådan løser du det

Erstat uformelle værdier med de tokens, som attributten definerer: true og false i stedet for yes, no, 1 eller 0.
Tjek numeriske attributter: tællende attributter som aria-level og aria-rowindex starter ved 1, ikke 0.
Fjern attributter, der står tomme, såsom aria-checked="" – hvis der ikke er en tilstand at formidle, bør attributten ikke være til stede.

De præcise værdier, som hver attribut tillader, er angivet i MDN's reference for ARIA-attributter.

Sådan tester Silktide dette

Find hvert element på siden, der har mindst én aria--attribut.
Tjek hver attributværdi op mod den type, som ARIA 1.2 definerer for den: true/false-attributter, attributter med tre tilstande såsom aria-checked (true, false, mixed), tal og hele tal samt attributter med faste ordlister såsom aria-live og aria-current.
Rapportér hver værdi, der ikke overholder kravene, og angiv, hvad der forventedes.

Attributter, der henviser til element-id'er, testes af deres egne tjek, såsom Manglende aria-controls-id, og attributter med fritekst som aria-label accepterer enhver tekst.

Fejlfinding

Værdien angives af et framework

Komponentbiblioteker serialiserer af og til tilstande forkert (for eksempel ved at gengive aria-expanded="undefined"). Fundet peger på elementet, men løsningen ligger som regel i, hvordan komponenten er konfigureret, eller i en opdatering af biblioteket.

Dette tjek rapporterer intet, selv om jeg forventer fund

ARIA-test kan slås fra for hver enkelt website. Tjek de avancerede indstillinger for websitet.