Una senzilla introducció a l'accessibilitat web

Autora: Monica Porter
Data De La Creació: 19 Març 2021
Data D’Actualització: 17 Ser Possible 2024
Anonim
UX en Palabras Simples
Vídeo: UX en Palabras Simples

Content

1/5 de la població té discapacitat. Són moltes les persones a les que és possible que no arribem.

L’accessibilitat s’adapta a tot el públic, inclosos els discapacitats. Les discapacitats es produeixen quan la condició mèdica d'algú s'enfronta a barreres que li impedeixen participar plenament (model social de discapacitat), per exemple, un tram d'escales per accedir a un bar, un comentari discriminatori, menjar al màxim prestatge d'un supermercat o d'un formulari web inutilitzable.

Com a dissenyadors, desenvolupadors i redactors, sovint som responsables de causar discapacitat creant aquestes barreres. Però també tenim el poder d’evitar-los o eliminar-los, no només guanyant trànsit, sinó també millorant la vida de les persones en el procés.

L’accessibilitat consisteix en arribar al màxim possible al vostre públic objectiu. Per fer-ho, el primer pas és entendre qui és aquest públic i quines són les seves necessitats. De vegades es creu que el públic discapacitat és una cosa així:


Però en realitat això no és gens. Més que un mar de malalties, per sort és bastant senzill.

Només hi ha quatre tipus de discapacitat relacionades amb l’accés a la web: visual, auditiva, motora i cognitiva.

Moltes correccions per a aquests grups són senzilles i gratuïtes.

Tot i que aquest article no és una guia exhaustiva d’accessibilitat (hi haurà suggeriments al final d’on i com obtenir més informació), hi haurà una visió general de cadascuna d’aquestes quatre àrees, amb alguns exemples del tipus de adaptacions que poden marcar una diferència valuosa per a cada grup.

Visual

Les afeccions mèdiques associades inclouen miopia, daltonisme, glaucoma i albinisme

Atendre les deficiències visuals significa no dependre de pistes visuals subtils, o fins i tot no dependre en absolut de les imatges. La forma més senzilla és la mida i el contrast:


Podeu veure fàcilment la diferència que fa un bon contrast entre primer pla i fons, sobretot en mides més baixes. Snook.ca té un bon controlador de contrast per ajudar-vos amb això. Feu que els vostres enllaços siguin el més fàcils de veure possible, en negreta amb una diferència de color important, idealment també subratllada.

Hi ha molts tipus de pèrdua de visió, com la visió irregular, deformada o túnel, però no dependre de coses que siguin petites o de baix contrast serà útil per a la majoria d’elles.

Un altre tipus de deteriorament és el daltonisme. El més comú és el vermell / verd (que afecta el vuit per cent dels homes), però també n’hi ha d’altres, així que eviteu confiar en el color per transmetre informació.

Aquest exemple és d’un joc. Els marcadors de progrés van passar de vermell a verd quan els vau passar. El problema no era l’ús del color, sinó la dependència d’aquest. Afegir un símbol va evitar el problema i també ho va fer més clar per a tothom:


Això és extremadament comú als formularis web: "corregiu els camps marcats en vermell".

També hi ha programari de lector de pantalla, utilitzat per persones amb deficiències visuals greus o ceguesa per llegir el contingut de la pantalla en forma d’àudio. Els usuaris del lector de pantalla naveguen de la mateixa manera que ho fa qualsevol altre, revisant títols i enllaços per trobar articles d’interès. Per exemple:

Perquè això funcioni, tots els encapçalaments (correctament imbricats H1, H2 i H3) han d'estar etiquetats correctament i els vostres enllaços han de tenir sentit fora del context. Si no, acabareu amb alguna cosa així:

Per tant, eviteu enllaços genèrics com ara "feu clic aquí" i "més". En lloc d'això, feu que el text de l'enllaç descrigui la destinació. Això també ajudarà al vostre SEO.

També eviteu reproduir automàticament àudio / vídeo a tota costa: xoca amb el discurs dels lectors de pantalla, cosa que fa que el lloc sigui inutilitzable. Hi ha alguns grans jugadors que ho fan, però és un problema greu, actualment Disney està davant dels tribunals per la reproducció automàtica de vídeos. A més, no oblideu les etiquetes alt i feu-les descripcions concises però precises de l’aspecte de les vostres imatges. Per exemple, si algú llegeix l’etiqueta alt sense veure la imatge, hauria de poder tenir una bona punyalada a l’hora de dibuixar-la. Una vegada més, això també ajudarà al vostre SEO.

Audició

Les afeccions mèdiques associades inclouen presbycusis, traumes acústics, trastorn del processament auditiu i otosclerosi

Com que la web és majoritàriament un mitjà visual, les persones amb discapacitat auditiva solen estar ben ateses. Normalment no es confia en el so per transmetre informació, amb un parell d’excepcions: la principal és el vídeo.

Idealment, tots els vídeos haurien d’estar subtitulats. Els subtítols han d'incloure sons de fons importants (per exemple, un cop de porta) i han de reduir-se perquè es puguin llegir tan ràpidament com es pronuncien les paraules (la veu arriba a 150 wpm, la velocitat de lectura és de 120 wpm). Els subtítols també requereixen una implementació tècnica al reproductor de vídeo. A causa d’aquests problemes, els subtítols de vegades poden ser massa difícils / costosos per a les petites empreses / pressupostos.

Si el títol complet està fora del vostre pressupost, hi ha una alternativa més barata que, tot i que no proporciona una experiència equivalent, permet l'accés a la informació (una transcripció). Aquesta és una versió HTML simple de la informació continguda al vídeo. Per exemple, aquest vídeo i transcripció d'Alexander McQueen:

En comparació, silencieu el volum i intenteu donar sentit a aquest vídeo de notícies de Sky:

Les transcripcions són fàcils de fer (escrivint o utilitzant un servei de transcripció barat) i tenen molts avantatges, no només per atendre discapacitats auditives, sinó també per a persones sense so (per exemple, en una oficina o en un navegador mòbil), i per a SEO, citant , revisió, cerca al navegador a la pàgina, etc.

Motor

Les afeccions mèdiques associades inclouen RSI, paràlisi cerebral, Parkinson i distròfia muscular

Les persones amb discapacitat motora troben difícil, o fins i tot a vegades impossible, l’ús d’un ratolí i un teclat tradicionals i utilitzen diverses tecnologies d’assistència, com ara aquests botons:

Els dispositius d’entrada tenen un ampli ventall de complexitat, a partir de la simple causa i efecte de prémer una sola tecla o botó, passant per la metàfora espacial (premeu la tecla més llunyana per moure cap amunt) de les tecles de fletxa, fins a la moviments analògics fins necessaris per utilitzar un ratolí, mantenint un control precís sobre la velocitat i la direcció simultàniament.

Afortunadament, tot i que els navegadors (i Flash també, però per desgràcia encara no Canvas) admeten l'accés al teclat senzill. Tabulador per desplaçar-se entre les coses seleccionables i introduïu-les per seleccionar-les. Assegureu-vos de no trencar això i també comproveu que la seqüència de pestanyes estigui en un ordre lògic.

Per evitar problemes per a les persones que puguin fer servir un ratolí o una pantalla tàctil però els resulti difícil, no facis que els elements en què es pugui fer clic siguin massa petits ni junts i no confiïs únicament en moviments o gestos complexos com arrossegar i deixar anar o lliscar. Els botons amunt / avall, així com fer clic i arrossegar, haurien fet que aquesta cronologia de la història de la música de Guardian fos utilitzable per molta més gent:

Per últim, si voleu que es pugui fer clic a alguna cosa, mantingueu-lo estacionari o, literalment, demaneu a la gent que toqui un objectiu en moviment, com en aquest exemple de Marc Ecko:

Tanmateix, si teniu una interfície en moviment, hi ha una solució ràpida: incloeu un botó de pausa evident per congelar el moviment. Com a alternativa, com ha fet Marc Ecko, incloeu una versió estàtica independent de la navegació.

Cognitiu

Les afeccions mèdiques associades inclouen la síndrome de Down, l’autisme, el retard global del desenvolupament i la dislèxia

El deteriorament cognitiu significa no poder processar la informació amb tanta facilitat. La solució més òbvia és simplificar la informació, mantenir-la al mínim necessari per conèixer-la i evitar jerges o acrònims de llenguatge innecessàriament complexos, ja que la còpia de les pàgines inicials de Facebook i Blogger té èxit.

Això és senzill de fer i una bona pràctica estàndard per escriure al web en general, però també és fantàsticament útil per a l’enorme percentatge de població que té una dificultat de lectura important (inclosos més d’un milió d’adults del Regne Unit que tenen una edat de lectura inferior als cinc anys) vell).

Una altra eina poderosa és la simplicitat de la interfície, evitant situacions com aquest lloc de Torbay Council on la gent està desbordada amb massa opcions i no hi ha una jerarquia adequada:

Assegureu-vos també que els elements de navegació es mantinguin coherents. Sovint la gent navega fent clic en una posició familiar en lloc de llegir tot el text de cada element del menú.

L’ús d’una tipografia clara i fàcil de llegir és una altra manera òbvia d’ajudar.

Per últim, animació o moviment.

No és fàcil vigilar el text amb tota aquesta animació al costat. Pot semblar extrem, però en algunes condicions (com ara ADD o Asperger) s’amplifica l’efecte distractor del moviment. Per tant, aquest exemple pot ser exactament com se sent fins i tot un moviment moderat, molt intrusiu. Així, doncs, una cosa tan simple com un núvol que deriva lentament darrere del formulari d’inscripció de Vimeo ...

... pot ser molt distret, cosa que dificulta la concentració en els elements interactius.

També els moviments sense previ avís (especialment la reproducció automàtica de vídeos) poden anar més enllà de dificultar l’accés i causar angoixa real a les persones que no poden fer front a canvis inesperats sobtats a causa de condicions com l’espectre autista. Per tant, utilitzeu el moviment i l’animació amb moderació, només quan hi hagi una necessitat real. Si l’utilitzeu, feu-lo moure com a resultat d’una acció de l’usuari en lloc de moure’s automàticament i eviteu les coses que s’animin contínuament, és a dir. només cal que feu servir una transició ràpida o un efecte de desplaçament del ratolí en lloc d’alguna cosa que es repeteixi per sempre.

Si no hi ha cap sortida i haureu de tenir animació de reproducció automàtica, al igual que passa amb les interfícies mòbils, assegureu-vos d’incloure un botó de pausa evident.

Què després?

Tot i que no és una llista exhaustiva de cap manera, aquests exemples, almenys, us haurien de donar una idea de qui beneficia l'accessibilitat, el tipus de barreres amb què es troben i alguns consells pràctics, ràpids i senzills, per evitar-los.

Passar temps amb persones amb discapacitat és, amb diferència, la millor manera d’aprendre més. Si podeu dur a terme investigacions sobre el públic i proves d’usuaris, incloeu participants discapacitats, els reclutadors no cobren més que ningú per trobar-los.

Si no, la majoria de la gent coneix algú amb discapacitat (els parents grans són una bona aposta, sovint tenen una varietat de deficiències menors-mitjanes). Seieu a un ordinador amb ells i xategeu sobre allò que els resulta difícil i el que els agradaria veure millorat o proporcionat. Sigui quin sigui el vostre nivell d’informació del públic, sempre serà això, perspicaç.

També hi ha excel·lents estàndards d’accessibilitat web (WC3 WCAG2.0) i àrees d’expertesa en tècniques de disseny, codi, còpia i contingut, però en realitat tot es redueix a això:

Mantingueu aquests quatre grups (persones que tenen dificultats per veure, escoltar, controlar o processar informació) al cap des del començament d’un projecte, i faràs una diferència real.

Popular
Com es corregeix l’error del disc de restabliment de la contrasenya
Llegeix Més

Com es corregeix l’error del disc de restabliment de la contrasenya

“He creat un dic de retabliment de contraenya en un compte local per retablir la contraenya d’un compte d’adminitrador de qui he oblidat la contraenya. No obtant això, quan ’obre l’aitent i inten...
2 maneres principals d’actualitzar Windows 10 Home a Pro
Llegeix Més

2 maneres principals d’actualitzar Windows 10 Home a Pro

Window 10, l’últim itema operatiu de Microoft i ucceor de Window 8.1, età diponible en divere edicion, amb una part Home i Pro de le edicion bàique. Tot i que ambdue verion tenen le mat...
Com esborra la carpeta Windows.old al Windows 10
Llegeix Més

Com esborra la carpeta Windows.old al Windows 10

Actualitzar el itema operatiu Window é una de le taque mé important que podríeu realitzar. La raó é imple; una actualització aportarà nove funcion al dipoitiu i elim...