Wcag uitgelegd

Voortgangsbalken

Voortgangsbalken — WCAG 1.3.1 Info en relaties (post 6/8)

Stap 2 van 4. Je ziet een balkje dat voor twee derde is gevuld. Je weet waar je bent in het proces.

Maar als dat balkje alleen uit CSS bestaat — een div met een breedte van 66% — weet een schermlezer niet hoeveel stappen er zijn, welke stap actief is, of hoever je bent.

Google indexeert meerstappenprocessen. Een goed gemarkeerde voortgangsbalk maakt het proces begrijpelijk voor hulpsoftware en zoekmachines.

Dit is niet zeldzaam. De meeste bestel- en aanvraagprocessen die ik audit hebben een visuele voortgangsindicator die in de code niks zegt.

De fix is een handvol attributen. En je bestelproces wordt beter vindbaar en bruikbaar.

Related Posts

Link naar een PDF zonder het te zeggen

Link naar een PDF zonder het te zeggen

“Algemene voorwaarden.” Je klikt. En ineens opent er een PDF in je browser. Of er start een download. Of je telefoon opent een PDF-viewer.

Labels

Labels

Klik eens op het woord naast een checkbox. Als er niks gebeurt, is het label niet gekoppeld aan het invoerveld. Dat is een gemiste kans, niet alleen voor toegankelijkheid, maar voor iedereen.

Foutmeldingen

Foutmeldingen

Je vult een formulier in, klikt op verzenden, en ergens bovenaan verschijnt een rode tekst.