Aposta pel disseny accessible, 12 tips per un treball inclusiu

Imagineu que aneu en cadira de rodes i us trobeu unes escales que us impedeixen accedir a la vostra destinació.  Aquesta mateixa sensació té aproximadament el 15% de la població mundial quan visita una pàgina web que no és accessible.  Més de mil milions de persones han estat diagnosticades amb algun tipus de diversitat funcional que els impedeix navegar per internet. És el nostre deure com a dissenyadores i desenvolupadores fer que les (abans) noves tecnologies siguin accessibles, perquè tothom mereix un accés igualitari a la informació. 
 

Tipus de diversitats funcionals

• Deficiències visuals: ceguesa, visió reduïda i problemes en visualització de color (el 8% dels homes són daltònics i un 0,5% de les dones)

• Deficiències auditives:  sordesa, pèrdua d’oïda

• Deficiències motrius: són les relacionades amb la capacitat de mobilitat de l’usuari

• Deficiències cognitives i de llenguatge: són usuaris que presenten problemes en l’ús del llenguatge, la lectura, percepció, memòria, salut mental…
   

És important indicar que aquestes limitacions no només són les pròpies de l’individu, hi ha altres derivades del context d’ús i del dispositiu que s’utilitzi. Per exemple, comparteixen el mateix problema de visualització aquelles usuàries amb visió reduïda, com aquells que, sense patir discapacitat visual, utilitzin pantalles petites o accedeixin des d’entorns amb molt poca visibilitat. Per això és important aplicar el disseny accessible perquè millora l’experiència d’usuari per a tothom que utilitzi el producte.

Què és l’accessibilitat?

Segons l’Interaction Design Foundation “l’accessibilitat es preocupa per si tots els usuaris poden accedir a una experiència d’usuari equivalent”. A diferència de la usabilitat, l’accessibilitat se centra en les persones amb diversitat funcional.

No només és important el seu aspecte inclusiu sinó que també hi ha un fort benefici empresarial: els estudis demostren que els llocs web accessibles tenen millors resultats de cerca, arriben a un públic més gran, són compatibles amb SEO, tenen temps de descàrrega més ràpids, fomenten bones pràctiques de codificació i sempre tenen una millor usabilitat.
 

“Tothom hauria de poder accedir a Internet i gaudir de la web, i tenim el compromís de fer-ho realment.”   – Google
 

Com podem ser accessibles?

El web W3C   llista aquests consells bàsics per ajudar-te a començar a fer que el disseny sigui més accessible per a les persones amb diversitats funcionals i ajudar-te a complir els requisits de les Web Content Accessibility Guidelines (WCAG). 
 

1. Proporcionar suficient contrast entre primer pla i fons

El text en primer pla ha de tenir un contrast suficient amb els colors de fons. Això inclou text sobre imatges, degradats de fons, botons i altres elements.
 

2. No utilitzar el color com a únic mitjà visual per transmetre informació

El color no hauria de ser l’única manera de transmetre la informació. Quan utilitzis el color per diferenciar elements, també proporciona una identificació addicional que no es basi en la percepció del color (un asterisc a més del color per indicar els camps de formulari obligatoris, per exemple). Aquesta pràctica ajuda els usuaris que no poden distingir un color de l’altre o tenen dificultats per distingir-lo.
 

3. Assegurar que els elements interactius siguin fàcils d’identificar

Proporciona estils diferents per a elements interactius, com ara enllaços i botons, per facilitar-ne la identificació. Per exemple, canvia l’aparença dels enllaços al cursor del ratolí, el focus del teclat i l’activació de la pantalla tàctil. Assegura’t que els estils i la denominació d’elements interactius s’utilitzen de manera coherent a tot el lloc web.
 

4. Proporcionar opcions de navegació clares i coherents

Assegura’t que la navegació per pàgines d’un lloc web tingui noms, estil i posicionament coherents. Proporciona més d’un mètode de navegació al web, com ara una  opció de cerca o un mapa del lloc.
 

5. Confirmar que els elements del formulari incloguin etiquetes clarament associades

Has de garantir que tots els camps tinguin una etiqueta descriptiva adjacent. Evita tenir massa espai entre etiquetes i camps.
 

6. Proporcionar comentaris fàcilment identificables

Proporciona comentaris sobre les interaccions, com ara confirmar l’enviament del formulari, avisar l’usuari quan alguna cosa no funciona bé o notificar-li els canvis a la pàgina. Les instruccions haurien de ser fàcils d’identificar.

7. Escriure text alternatiu útil per a les  imatges i altres continguts que no siguin de text

Les persones amb poca visió sovint fan ús dels lectors de pantalla per “escoltar” el web. Aquestes eines converteixen el text en veu perquè la persona pugui escoltar les paraules en un lloc.
Hi ha dues maneres de presentar text alternatiu:

• Dins de l’atribut <alt> de l’element imatge.
• Dins del context o entorn de la mateixa imatge.
   

8. Fer que la navegació es pugui fer amb el teclat

Les persones amb discapacitat motora, les persones invidents que depenen dels lectors de pantalla o les persones que no tenen un control muscular precís, depenen d’un teclat per navegar pel contingut.
Una bona pràctica és provar el teu web mitjançant només el teclat. Utilitza el Tabulador per desplaçar-te pels enllaços i formularis i selecciona un element amb la tecla Retorn. 
 

9. Tenir una bona jerarquia visual (grandàries i espaiats)

És important que la informació estigui ben jerarquitzada i separada, perquè l’usuari sàpiga quin contingut va amb quin, d’aquesta manera facilitarem la lectura i la comprensió del producte. 
 

10. No escriure en majúscules

Alguns lectors de pantalla llegeixen aquests textos lletra per lletra en lloc de les paraules. S’alenteix la lectura en un 10%, els textos són més difícils de llegir perquè les majúscules, visualment, no es diferencien tan bé com les minúscules.
 

11. Definir una àrea tàctil gran

Dissenya botons amb molt de padding, i amb un bon espai amb els elements que l’envolten. Fes servir enllaços separats amb cos de text gran,  així  facilites a les persones amb dificultat per a controlar moviments l’acció de fer tab correctament.
 

12. Optimitzar els lectors de pantalla

Has de dissenyar utilitzant una composició lògica i lineal. Així el contingut es pot llegir i comunicar correctament. Sigues breu amb els textos i evita les redundàncies perquè el lector de pantalla llegeixi ràpid i l’usuari pugui navegar correctament.
 

Conclusió

L’accessibilitat ha de formar part de la teva investigació sobre qualsevol projecte. Verifica si les teories que tenies sobre accessibilitat eren correctes i sempre busca una oportunitat per millorar-les. Com a dissenyadores, desenvolupadores o creadores de continguts, tenim la responsabilitat de defensar l’accessibilitat. Amb ella, fem que la tecnologia sigui útil per a totes les persones independentment de les seves capacitats, situació econòmica, edat o educació.

 

Text: Bibiana Boix i Joan Pedrosa

Il·lustracions: Laura Illa