En aquest tema, explorarem els diferents tipus de discapacitats que poden afectar la manera com les persones interactuen amb la web. Comprendre aquestes discapacitats és fonamental per dissenyar i desenvolupar llocs web accessibles per a tothom.
- Discapacitats Visuals
Les discapacitats visuals poden variar des de la ceguesa total fins a la visió parcial. Algunes de les condicions inclouen:
- Ceguesa: Les persones cegues depenen de lectors de pantalla per accedir al contingut web.
- Visió baixa: Pot requerir l'ús d'eines de magnificació o ajustaments de contrast.
- Daltonisme: Dificultat per distingir certs colors, especialment el vermell i el verd.
Exemples Pràctics
<!-- Exemple d'ús d'etiquetes alt per a imatges --> <img src="imatge.jpg" alt="Descripció de la imatge">
- Explicació: L'atribut
alt
proporciona una descripció textual de la imatge per a usuaris de lectors de pantalla.
- Discapacitats Auditives
Aquestes discapacitats inclouen la pèrdua auditiva parcial o total. Les persones amb discapacitats auditives poden necessitar:
- Subtítols: Per a vídeos i àudios.
- Transcripcions: Textos complets de continguts multimèdia.
Exemples Pràctics
<!-- Exemple d'ús de subtítols en un vídeo --> <video controls> <source src="video.mp4" type="video/mp4"> <track kind="subtitles" src="subtitols.vtt" srclang="ca" label="Català"> </video>
- Explicació: L'etiqueta
track
s'utilitza per afegir subtítols a un vídeo.
- Discapacitats Físiques
Aquestes discapacitats poden afectar la mobilitat i la destresa, dificultant l'ús de dispositius d'entrada tradicionals com el ratolí i el teclat.
- Paràlisi: Pot requerir l'ús de dispositius d'entrada alternatius.
- Destresa limitada: Pot necessitar interfícies simplificades i botons més grans.
Exemples Pràctics
<!-- Exemple d'ús de navegació per teclat --> <button onclick="alert('Hola!')">Fes clic aquí</button>
- Explicació: Assegura't que els elements interactius siguin accessibles mitjançant el teclat.
- Discapacitats Cognitives
Aquestes discapacitats poden afectar la memòria, l'atenció i la comprensió. Inclouen:
- Dislèxia: Pot requerir fonts i dissenys específics per millorar la llegibilitat.
- Trastorns de l'atenció: Pot necessitar interfícies clares i sense distraccions.
Exemples Pràctics
- Consell: Utilitza un llenguatge clar i senzill, i divideix el contingut en seccions petites i manejables.
- Discapacitats Neurològiques
Aquestes discapacitats poden incloure condicions com l'epilèpsia, que pot ser desencadenada per certs tipus de contingut visual.
- Epilèpsia fotosensible: Evita l'ús de llums intermitents o patrons visuals que puguin desencadenar convulsions.
Exemples Pràctics
- Consell: Evita animacions que parpellegin ràpidament o que tinguin un alt contrast.
Exercicis Pràctics
- Exercici: Crea una pàgina web amb una imatge i assegura't d'incloure una descripció
alt
adequada. - Exercici: Afegeix subtítols a un vídeo utilitzant l'etiqueta
track
.
Solucions
-
Solució:
<img src="paisatge.jpg" alt="Un paisatge muntanyós amb un llac al centre">
-
Solució:
<video controls> <source src="documental.mp4" type="video/mp4"> <track kind="subtitles" src="subtitols.vtt" srclang="ca" label="Català"> </video>
Conclusió
Comprendre els diferents tipus de discapacitats és essencial per crear llocs web accessibles. En aquest tema, hem explorat les discapacitats visuals, auditives, físiques, cognitives i neurològiques, i hem vist com podem adaptar el nostre contingut per satisfer les necessitats de tots els usuaris. En el següent tema, explorarem les tecnologies assistencials que ajuden les persones amb discapacitats a utilitzar la web.
Curs d'Accessibilitat Web
Mòdul 1: Introducció a l'Accessibilitat Web
- Què és l'Accessibilitat Web?
- Importància de l'Accessibilitat Web
- Visió General de les Lleis i Estàndards d'Accessibilitat
- Introducció a WCAG
Mòdul 2: Comprensió de les Discapacitats i les Tecnologies Assistencials
- Tipus de Discapacitats
- Visió General de les Tecnologies Assistencials
- Com les Persones amb Discapacitats Utilitzen la Web
Mòdul 3: Principis del Disseny Accessible
- Perceptible: Fer el Contingut Accessible als Sentits
- Operable: Interfície d'Usuari i Navegació
- Comprensible: Informació i Operació
- Robust: Compatibilitat amb Tecnologies Actuals i Futures
Mòdul 4: Implementació de l'Accessibilitat en HTML i CSS
- HTML Semàntic
- Formularis Accessibles
- Ús de Rols i Propietats ARIA
- Contrast de Color i Redimensionament de Text
Mòdul 5: Accessibilitat en JavaScript i Multimèdia
- Creació de Ginys JavaScript Accessibles
- Accessibilitat del Teclat
- Contingut de Vídeo i Àudio Accessible
- Proporcionar Alternatives de Text per a Imatges
Mòdul 6: Prova i Avaluació de l'Accessibilitat
- Tècniques de Prova Manual
- Eines de Prova Automatitzades
- Prova d'Usuari amb Tecnologies Assistencials
- Interpretació d'Informes d'Accessibilitat