PDF de programación - TECNOLOGÍAS DE APOYO - Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de

Aplicaciones Web

Sergio Luján Mora

Accesibilidad en el Diseño de Aplicaciones Web

TECNOLOGÍAS DE APOYO

1

Accesibilidad en el Diseño de Aplicaciones Web

Contenido

• Ayudas técnicas, tecnologías de apoyo, …
• Dispositivos de entrada
• Dispositivos de salida

Accesibilidad en el Diseño de Aplicaciones Web

AYUDAS TÉCNICAS, TECNOLOGÍAS
DE APOYO, …

2

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

DISPOSITIVOS DE ENTRADA

3

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Permiten la introducción de información

y ordenes al ordenador:
– Mediante teclado o ratón adaptado
– Sin utilizar el teclado o ratón de forma

convencional

• La persona con discapacidad debe poder

realizar procesos similares mediante el
dispositivo adaptado

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Vídeos de demostración

4

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Teclado virtual con selección por barrido

5

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Accesibilidad en el Diseño de Aplicaciones Web

6

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

7

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivo de entrada

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• DEMO

– Mostrar el teclado en pantalla de Microsoft

8

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Interruptor por aire
(Sip-Puff Switch)
Inspiración y expiración

Interruptor por agarre
(Grasp Switch)

Interruptor flexible
(Flex Switch)

9

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Interruptor por microluz
(Microlight Switch)

Interruptor de almohada
(Pillow Switch)
Para la cabeza o barbilla

Interruptor de infrarrojos
(IR Switch)

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• The Libertas Switch:

– http://www.emgswitch.com/

• Emplea electromiografía: detecta el potencial
eléctrico que producen las células musculares
cuando se contraen o están en reposo
• El dispositivo se coloca sobre cualquier

músculo sobre el que el usuario mantenga el
control voluntario

10

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

Como navegan los discapacitados

• Teclado reducido

11

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Teclado
ampliado

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Teclado protegido

12

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Teclado
para una sola
mano

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Teclado braille

13

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Ratón de bola

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Ratón de cabeza

14

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Reconocimiento facial

15

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Tabletas especiales

16

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de entrada

• Control mediante la voz:

– Ejemplo: IBM ViaVoice
– Ejemplo: Dragon NaturallySpeaking

Accesibilidad en el Diseño de Aplicaciones Web

DISPOSITIVOS DE SALIDA

17

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Estándar:

– Monitor e impresora

• Ampliación de caracteres
• Sintetizador del habla
• Línea braille
• Combinación de las anteriores

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Estándar:

– Para usuarios con visión reducida
– Monitor de alta resolución 21’’ (o mayor)
– Ampliador de monitor:

• Ejemplo: Beam Scope TV Screen Magnifier 12 -

15 inches

• Duplica el tamaño de la pantalla (no la

resolución)

18

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

19

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Ampliación de caracteres o magnificador

de pantalla
– Screen magnifier
– Mediante software
– Para visión reducida (pero no ceguera total)

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• ZoomText Screen Magnifier/Screen

Reader

20

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• DEMO

– Mostrar el ampliador de pantalla de

Microsoft

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Sintetizador del habla o de la voz:

– Lector de pantalla (screen reader)
– Problemas para pronunciar siglas, fechas y

números

– Imposibilidad de pronunciar gráficos o

símbolos complejos

21

Accesibilidad en el Diseño de Aplicaciones Web

Accesibilidad en el Diseño de Aplicaciones Web

22

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• DEMO

– Mostrar el JAWS

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• DEMO

– Mostrar el narrador de Microsoft

23

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Línea braille

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

24

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

• Línea braille:

– Existen dispositivos que combinan la línea y

el teclado braille en uno solo

– Por ejemplo, en la siguiente imagen se

muestra un dispositivo que es línea braille,
con 40 celdas, y teclado braille con 8 teclas
principales

Accesibilidad en el Diseño de Aplicaciones Web

Dispositivos de salida

25