Entendiendo la

accesibilidad digital
Karla Araya Orozco

Marzo, 2022
¿Qué es lo que está de moda/tendencia?
¿Cuál ha sido su mejor y su peor experiencia?
Es el proceso de generar la
satisfacción del usuario al mejorar la
usabilidad, la accesibilidad y el
placer, proporcionados por la
interacción con un producto y/o
servicio.
El producto o el servicio es solo
el instrumento. La experiencia
va mas allá, se refleja en las
necesidades,
emociones o prácticas
asociadas de los usuarios.
 ¿Usted sabía qué?

4 de cada 5
aplicaciones fallan o fracasan por una mala
experiencia o porque no aportan nada nuevo
al usuario.

Bluumi, consultora tecnológica

¿Por qué?
Difícil de usar
Falta de información
Mala gestión de la información
 “Para la mayoría de la gente,
la tecnología pone las cosas más fáciles,
para las personas con discapacidad las
hace posibles.”
Rick Hansen- Man in motion
 “Para la mayoría de la gente,
la tecnología pone las cosas más fáciles,
para las personas con discapacidad las
hace debería hacer posibles.”
Usabilidad

Accesibilidad

Experiencia de usuario
 Usabilidad
Atributo de calidad que evalúa que tan fácil es
utilizar una interfaz y mejorarla de forma iterativa
en el proceso
 Usabilidad

• Capacidad de aprendizaje (facilidad de uso)

¿Qué
• Eficiencia (rapidez)
evalúa? • Memorabilidad (recordar la herramienta)
• Errores (cuantos y como corregirlos)
• Satisfacción (el uso es placentero)

• Mediante pruebas con

¿Cómo se
usuarios antes, durante y
aplica? después del desarrollo
 Es el grado en que una plataforma
digital pueda ser visitada y utilizada
por el mayor número de
Accesibilidad
personas posibles de forma
digital satisfactoria, independientemente
de las limitaciones derivadas del
entorno.

Carreras, O. (2012). Accesibilidad web y SEO.

Beneficios de la accesibilidad
W3C, Pautas WCAG 2.1
 ¿Qué es la W3C?

World Wide Web Consortium (W3C)

Organismo internacional que define estándares

para la web.
 ¿Qué son las WCAG 2.1?

Son una serie de pautas que cubren una amplia gama de recomendaciones
para hacer contenidos web más accesibles.

https://www.w3.org/TR/WCAG21
 Directriz presidencial

Plan Nacional de Desarrollo de Telecomunicaciones 2015-

2021

Directriz Número 051 MTSS-Micitt:

Implementación de sitios web accesibles en el sector público
costarricense

Objetivo:
“...requerir a los órganos, entes, instituciones y empresas que
conforman el Sector Público, incluyendo las instituciones autónomas,
las semiautónomas y las empresas privadas, y entes públicos no
estatales, la utilización de criterios de accesibilidad establecidos en la
norma WCAG 2.1…”
 WCAG 2.1 Estructura

4 pautas y 29
1. Perceptible
criterios

5 Pautas y 29
2. Operable
criterios
WCAG 2.1 Principios
3 pautas y 17
3. Comprensible
criterios

1 pauta y 3
4. Robusto
criterios
 WCAG 2.1: pautas según directriz

Criterio de Pautas
éxito

A 30

AA 20

AAA 28
Código fuente
 Revisiones

Revisiones Revisiones
automáticas manuales
**
 Revisiones automáticas

Herramientas de validación gratuitas:

• WAVE Web Accessibility Tool

• Accessibility Insights for Web

• Equalweb A11 y Checker

• Siteimprove

• T.A.W.

• Contrast Checker
Plataforma

Contenido
Información efectiva y
accesible
¿Qué tenemos que hacer para
generar una buena experiencia
de usuario?
 Paso 1:
Conocer a nuestras personas usuarias
¿Cómo es el usuario estándar?
Personas con discapacidad

Personas Personas Personas Personas con

con con con discapacidad
discapacidad discapacidad discapacidad intelectual o
física visual auditiva psicosocial
 Paso 2:
Conocer el contexto de uso
 Contexto

Es el marco espacio-temporal en el que ocurre la experiencia

Lugar Momento Ambiente Cultura

Consejos para…
Consejos para…
Audio

Formatos alternativos
✓ Transcripción
✓ LESCO
Ejemplo
 Video

Largometraje Cortometraje Imagen real, Animación Gif

o live action
Consejos para…
Video

LESCO Subtítulos incrustados

✓ Contraste entre fondo,
ropa y piel del intérprete
✓ Resolución mínima de
1920x1080
✓ Recuadro de 1/4 pantalla
✓ Plano medio
Ejemplo
✓ Tipografía accesible
✓ Contraste de color con
el fondo
✓ Acorde con el diálogo
Ejemplo
Consejos para…
Audio Video

Corto Largo
✓ Utilización de ✓ Audio descripción
sonido ambiente que permita
✓ Diálogo descriptivo ambientar
Imagen

Fotografías Dibujos Infografías

Consejos para… Imagen

Decorativa
✓ Realizar la indicación en el
texto alternativo
✓ Evitar marcas de agua
Imagen

Fotografías Dibujos Infografías

Consejos para… Imagen

Decorativa
✓ Realizar la indicación en el
texto alternativo
✓ Evitar marcas de agua
Imagen
Consejos para…
Decorativa
✓ Realizar la indicación en el
texto alternativo
✓ Evitar marcas de agua
Imagen
Funcional
✓ Texto alternativo
✓ Descripción dentro del texto
✓ Contraste de tamaños,
colores, texturas visuales y
formas
✓ Orden lógico de lectura
Imagen
Texto

Documentos

Presentación Tabla Prosa PDF

Documentos

❖Estilo del documento

✓Estilos predeterminados

✓Tabla de contenidos

✓Encabezados, pies de

página y números de página

Documentos

❖Selección de la fuente
✓Tipo de letra

✓Distinción

✓Tamaño
 Verdana Helvetica
Calibri Tahoma
Arial The serif Hand black
Times New Roman Lato Script Mt
Edwardian Script Comic Sans MS
Stencil Monotype Corsiva
Arial Italic
Documentos

Giro a 90°

Giro a 270°
A
p
❖Disposición del texto i
✓Orientación
l
a
d
Horizontal o
Documentos

1
2
❖Disposición del texto 3
✓Espaciado

1
2
3
Documentos

❖Disposición del texto 2

✓Interlineado

1 2
3
Documentos

❖Disposición del texto

✓Alineado

La alineación o marginado del

bloque de texto e otro factor de
importancia. También
repercuten la funcionalidad y la
estética de la pieza.
Documentos

❖Disposición del texto

✓Listas viñetas o numeración
Documentos

❖Disposición del texto

✓Columnas
Documentos

❖Disposición del texto

Uso de espacios en blanco seguidos
Documentos

Utilice el botón
derecho del
❖Idioma del documento
“mouse” para
ingresar al
“sotfware”.
Documentos
Para conocer más de la
aplicación del subtitulado de
manera accesible, refiérase a la

❖Uso de hipervínculos
norma UNE 153010 Subtitulado
para personas sordas y personas
con discapacidad auditiva
(https://ouad.unizar.es/sites/oua
d.unizar.es/files/users/ouad/UNE
_153010_2012.pdf)
Documentos
Costa Rica: Población de 18 años y más por situación de discapacidad, según actividades de
tiempo libre, octubre y noviembre 2018
(Valores absolutos y relativos)
Personas sin Personas en
situación de situación de
Actividades de tiempo libre discapacidad discapacidad
Absoluto Absoluto
Relativos Relativos
s s
❖Diseño de tablas Ver televisión, escuchar música o leer algún
material
2 972 824 98,9 648 482 96,7

✓Encabezados y filas Participar en reuniones sociales 2 558 744 85,1 481 281 71,8
Visitar alguna tienda 2 489 014 82,8 436 450 65,1
de título Visitar restaurantes 2 030 789 67,6 309 816 46,2
✓Estructura de tabla Asistir a actividades religiosas 1 904 196 63,3 400 352 59,7
Practicar actividades al aire libre 1 964 458 65,3 272 784 40,7
simple Practicar deporte 1 635 772 54,4 175 658 26,2

Celdas combinadas y
Asistir a actividades culturales 1 111 514 37,0 127 375 19,0
Jugar juegos varios 1 075 589 35,8 152 519 22,7
en blanco para dar Asistir a eventos deportivos 998 802 33,2 109 752 16,4
Realizar actividades artísticas 616 801 20,5 106 402 15,9
formato Realizar alguna otra actividad de tiempo libre 8 257 0,3a/
1 777 0,3a/
a/ Coeficiente de variación mayor al 20 %, lo cual indica que la estimación es poco confiable y, por tanto, se debe utilizar
con precaución.
Fuente: INEC-Costa Rica. Encuesta Nacional sobre Discapacidad, 2018.
Herramientas de office
Botón “Comprobar
accesibilidad” Pestaña “Revisar”

Menú de
“Accesibilidad”

Mensaje final
de revisión
 “No podemos resolver problemas
usando el mismo tipo de pensamiento
que usamos cuando los creamos“
Albert Einstein
Gracias por su atención

karaya@conapdis.go.cr