Vivimos en un mundo donde la tecnología ya forma parte de nuestras vidas. Actualmente existen más de 1240 millones de sitios web en internet, pero ¿cuántos cumplen con los principios de accesibilidad? Cuando una compañía lanza un sitio web al mercado debe considerar la accesibilidad como un factor importante ya que existen más de mil millones de personas que viven en todo el mundo con algún tipo de discapacidad; de ellas, casi el 20% experimentan dificultades considerables en la vida cotidiana. Los sitios web desarrollados con GeneXus están basados en los cuatro principios de la accesibilidad: Perceptible, Operable, Comprensible y Robusto, pero es tarea del desarrollador que la aplicación sea programada siguiendo estos principios. En esta charla estaremos conociendo un poco más sobre las herramientas que nos proporciona GeneXus para desarrollar aplicaciones accesibles, además estaremos viendo cómo podemos promover en nuestros proyectos la importancia del desarrollo de sistemas accesibles con prácticas que están al alcance de todos.

1. ACCESIBILIDAD EN
APLICACIONES WEB
GENEXUS
Ing. Lisandra Armas
@lisyarmas
#GX28

2. Mobile UX, Usability & Accessibility
Project Manager

5. Imagen de persona con dispositivos
¿Son accesibles las aplicaciones?

6. +1000 millones
http://www.who.int/disabilities/world_report/2011/es/

7. Productos de apoyo1
PrincipiosdeAccesibilidad2
Herramientasdecomprobación3
Agenda

8. Productos de apoyo1
PrincipiosdeAccesibilidad2
Herramientasdecomprobación3
Agenda

9. TalkBack/VoiceOver
Zoom
Dictado
Productos de apoyo de Accesibilidad a Usuarios
Visual
Web
Lectores de Pantalla
Magnificadores de Pantalla
Navegadores Alternativos
Traductores de braille
Mobile

10. Subtítulos
Alertas visibles y
vibratorias
Productos de apoyo de Accesibilidad a Usuarios
Auditiva
Mobile Web
Subtítulos
Alertas visibles y
vibratorias

11. Switch Access/Control
AssistiveTouch
Productos de apoyo de Accesibilidad a Usuarios
Motriz
Mobile Web
Teclados Virtuales
Mouse especiales

12. Productos de apoyo de Accesibilidad a Usuarios
Navegadores Accesibles
Mobile Web
Cognitiva
Acceso Guiado
Apoyo Lector

13. Visual
Auditiva
Motriz
Cognitiva
Productos de apoyo de Accesibilidad para Usuarios

15. La falta de accesibilidad en aplicaciones nos impacta a
TODOS

16. Las mejoras de accesibilidad en aplicaciones nos favorece a
TODOS

17. THE POWER OF THE WEB IS IN ITS UNIVERSALITY.
ACCESS BY EVERYONE REGARDLESS OF DISABILITY IS AN
ESSENTIAL ASPECT.
TIM BERNERS-LEE,
W3C DIRECTOR AND INVENTOR OF THE
WORLD WIDE WEB

18. Productos de apoyo1
PrincipiosdeAccesibilidad2
Herramientasdecomprobación3
Agenda

19. Web Content Accessibility Guidelines (WCAG)
Authoring Tool Accessibility Guidelines (ATAG)
User Agent Accessibility Guidelines (UAAG)

20. WCAG
2.1
Perceptible Operable
ComprensibleRobusto
Principios de Accesibilidad

21. “La información y los
componentes de la
interfaz de usuario
deben ser presentados
a los usuarios de modo
que ellos puedan
percibirlos.”
WCAG
2.1
Perceptible Operable
ComprensibleRobusto
Principios de Accesibilidad

22. ACEPTAR
BOTÓN
Perceptible – Textos Alternativos
IMÁGENES - “ALTERNATE TEXT”
BOTONES - “CAPTION”
VARIABLES Y ATRIBUTOS – “LABEL CAPTION”
CHECK.JPG
BOTÓN

23. Perceptible – Estructura del contenido
“RESPONSIVE WEB APPLICATION”
Información Per
Nombre
Apellidos
+
Zoom 150x
Información Personal
Nombre
Apellidos
+
Zoom 150x

24. Perceptible – Contraste de colores
“CASCADING STYLE SHEETS”
Información Personal
Nombre*
Apellidos*
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *
Información Personal
Nombre*
Apellidos*
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *

25. https://developer.paciellogroup.com/resources/contrastanalyser/
Colour Contrast Analyser
Perceptible – Contraste de colores

28. “Los componentes de la
interfaz de usuario y la
navegación deben ser
operables.”
WCAG
2.1
Perceptible Operable
ComprensibleRobusto
Principios de Accesibilidad

29. Información Personal
Nombre
Apellidos
CancelarAceptar
Operable – Accesible por teclado
TAB - “FIELD EXIT PROPERTY”
ENTER - “ENTER EVENT”
F1, F2, ETC - “FUNCTION KEYS EVENT”
Información Personal
Nombre
Apellidos
CancelarAceptar

30. Operable – Foco
“FOCUS CONTROL”
Información Personal
Nombre*
Apellidos*
I
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *Información Personal
Nombre*
Apellidos*
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *

31. Operable – Título de páginas
“FORM CAPTION PROPERTY”
Información Personal
Nombre*
Apellidos*
I
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *
Solicitud de Partida de Nacimiento
Información Personal
Nombre*
Apellidos*
I
Dirección
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *

32. “La información y el
manejo de la
interfaz de usuario
deben ser
comprensibles.”
WCAG
2.1
Perceptible Operable
ComprensibleRobusto
Principios de Accesibilidad

33. Comprensible – Identificación de errores
“ERROR, WARNING, ISVALID EVENT MESSAGES”
Información Personal
Nombre*
Apellidos*
Matias
Cédula Identidad I64561238
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Nombre *
Solicitud de Partida de Nacimiento
El campo apellidos es obligatorio
Información Personal
Nombre*
Apellidos*
Matias
Cédula Identidad I64561238
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Nombre *
Solicitud de Partida de Nacimiento

34. Comprensible – Ayuda contextual
“NOTIFY CONTEXT CHANGE PROPERTY”
“TRACKCONTEXT EVENT”
Solicitud de Partida de Nacimiento
Información Personal
Nombre*
Apellidos*
Cédula Identidad I6.
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *
Ingrese la cédula de identidad sin
puntos ni guiones
Solicitud de Partida de Nacimiento
Información Personal
Nombre*
Apellidos*
Cédula Identidad I6.421.578-1
Todos los campos requeridos se visualizan de color rojo y con un
asterisco * : Ejemplo: Name *
La cédula no debe llevar puntos ni
guiones.

35. “El contenido debe
ser suficientemente
robusto como para
ser interpretado de
forma fiable por los
productos de
apoyo.”
WCAG
2.1
Perceptible Operable
ComprensibleRobusto
Principios de Accesibilidad

36. ROBUSTO – COMPATIBILIDAD CON
PRODUCTOS DE APOYO
Información Personal
Nombre
Apellidos
Matias
Perez Perez
Cancelar Continuar
Información Personal
Nombre
Apellidos
Matias
Perez Perez
Cancelar Continuar

37. Información Personal
Dirección
Departamento
Cancelar Continuar
Información Personal
Nombre
Apellidos
Matias
Perez Perez
Cancelar Continuar
ROBUSTO – COMPATIBILIDAD CON
PRODUCTOS DE APOYO

38. Productos de apoyo1
PrincipiosdeAccesibilidad2
Herramientasdecomprobación3
Agenda

39. COMPROBACIÓN DE ACCESIBILIDAD
Color Contrast Analyser

42. Inclusión

43. ACCESIBILIDAD EN
APLICACIONES WEB
GENEXUS
Ing. Lisandra Armas
@lisyarmas
#GX28