Discapacitat motriu: teclat, polsadors, veu i mirada

La discapacitat motriu és la més heterogènia de totes: inclou des d'un tremolor lleu a les mans fins a la tetraplegia, passant per l'artritis, l'esclerosi múltiple, el Parkinson, la paràlisi cerebral o l'amputació. El que tenen en comú els seus usuaris al web és que el ratolí, o el dit sobre la pantalla tàctil, no és el seu mitjà d'interacció principal o no els resulta precís. En aquesta lliçó veuràs amb què substitueixen el ratolí i què exigeix això al disseny.

El teclat com a base de tot

La major part de les tecnologies de suport per a la discapacitat motriu acaben traduint-se en pulsacions de teclat: un polsador emula Tab i Retorn, un programa de control per veu envia ordres que equivalen a tecles, un lector de pantalla es fa servir amb el teclat. Per això el criteri 2.1.1 Teclat (nivell A) és un dels pilars de les WCAG: tota la funcionalitat s'ha de poder fer servir mitjançant una interfície de teclat.

A la pràctica, un usuari de teclat es mou amb Tab i Maj+Tab entre els elements interactius, activa amb Retorn o Espai, es desplaça per llistes i menús amb les fletxes i tanca amb Esc. Perquè això funcioni calen diverses coses alhora:

• Que tots els controls siguin assolibles: els elements natius (<a href>, <button>, <input>) ho són per defecte; un <div> amb onclick, no.
• Que el focus sigui visible en tot moment (2.4.7 Focus visible, AA): si el disseny elimina el contorn amb outline: none i no el substitueix, l'usuari no sap on és.
• Que l'ordre del focus sigui lògic (2.4.3 Ordre del focus) i que no hi hagi trampes en què el focus entra i no pot sortir (2.1.2 Sense paranys per al focus del teclat).
• Que el focus no quedi ocult darrere de capçaleres fixes o bàners de galetes (2.4.11 Focus no ocult (mínim), nou a WCAG 2.2).

<!-- Incorrecte: no rep el focus ni respon a Retorn -->
<div class="tarjeta" onclick="abrir(12)">Mostra l'expedient</div>

<!-- Correcte: assolible, activable i amb nom -->
<a href="/expedientes/12">Mostra l'expedient</a>

Polsadors i escombratge

Un polsador (switch) és un botó gran, o un sensor de bufada, de pressió o de moviment del cap, que la persona pot activar amb la part del cos que controla. Amb un o dos polsadors es fa servir tot el dispositiu mitjançant l'escombratge: el sistema va ressaltant elements de manera seqüencial i l'usuari prem quan l'element desitjat està ressaltat. iOS l'inclou com a Control per botó i Android com a Accés amb interruptors.

L'escombratge és lent. Cada element interactiu innecessari, cada enllaç repetit, cada pas de més en un procés, es tradueix en segons o minuts d'espera. D'aquí la importància de:

• Un enllaç per saltar al contingut principal (2.4.1 Evitar blocs).
• Processos amb el mínim de passos i sense camps superflus.
• Temps suficient: els límits de sessió s'han de poder ampliar o desactivar (2.2.1 Temps ajustable). Un formulari que caduca al cap de deu minuts és impossible per a molts usuaris d'escombratge.

Control per veu

Programes com Dragon, l'Accés per veu de Windows o el Control per veu de macOS i iOS permeten fer servir l'ordinador parlant: «prem Envia», «fes clic a Contacte», «desplaça avall». Perquè «prem Envia» funcioni, el programari busca un control el nom accessible del qual contingui la paraula «Envia». Dues conseqüències pràctiques:

• Els controls necessiten noms accessibles coherents amb el seu text visible. El criteri 2.5.3 Etiqueta en el nom exigeix que el text visible d'un control estigui inclòs en el seu nom accessible. Si un botó mostra «Envia» però el seu aria-label és «Tramet el formulari», l'ordre de veu falla.
• Els controls que són només una icona sense text obliguen l'usuari a fer servir la quadrícula numerada, un mètode molt més lent. Afegeix-hi text visible o, com a mínim, un nom accessible previsible.

Seguiment ocular i altres alternatives

Els sistemes de seguiment ocular (eye tracking, com els de Tobii) detecten cap on mira la persona i mouen el punter; la selecció es fa mantenint la mirada fixa uns instants o amb un parpelleig. Els fan servir persones amb ELA, lesió medul·lar alta o paràlisi cerebral severa. També hi ha ratolins de cap, joysticks i punters bucals. Tots tenen en comú una precisió limitada i una fatiga elevada, cosa que porta a diversos criteris WCAG:

• 2.5.8 Mida de l'objectiu (mínim), nou a la 2.2, nivell AA: els objectius han de mesurar com a mínim 24 per 24 píxels CSS o tenir prou espai al voltant. Els botons diminuts i les icones enganxades entre si són inassolibles amb un punter imprecís.
• 2.5.1 Gestos del punter: qualsevol gest complex (pessigar, lliscar amb dos dits, traçar una ruta) ha de tenir una alternativa d'un sol punter.
• 2.5.7 Moviments d'arrossegament, nou a la 2.2: arrossegar i deixar anar ha de tenir una alternativa sense arrossegament (botons de pujar o baixar, per exemple).
• 2.5.2 Cancel·lació del punter: l'acció s'ha d'executar en deixar anar, no en prémer, perquè un clic accidental es pugui cancel·lar.

Com comprovar-ho

• Desconnecta el ratolí i recorre tot el web amb Tab: arribes a tot, veus sempre on ets, pots sortir de cada component?
• Mesura els objectius tàctils més petits: arriben a 24 per 24 píxels?
• Prova amb el control per veu del sistema operatiu: pots activar els botons dient-ne el text visible?

Resum

• La majoria de les tecnologies de suport motrius es basen en el teclat: el 2.1.1 Teclat n'és la base.
• El focus ha de ser visible (2.4.7), lògic (2.4.3), sense trampes (2.1.2) i no ha de quedar ocult (2.4.11).
• Els polsadors amb escombratge són lents: redueix passos, ofereix enllaços de salt i temps ajustable (2.2.1).
• El control per veu necessita que el text visible sigui al nom accessible (2.5.3).
• Els punters imprecisos exigeixen objectius de 24 per 24 píxels (2.5.8) i alternatives als gestos i a l'arrossegament (2.5.1, 2.5.7).