PDF de programación - Accesibilidad en la Web: de WCAG 1.0 a WCAG 2.0

Accesibilidad en la Web: de

WCAG 1.0 a WCAG 2.0

Universidad de Colima

México

Departamento de Lenguajes y
Sistemas Informáticos

Accesibilidad en la Web
Accesibilidad en la Web

Departamento de Lenguajes y Sistemas Informáticos

Sergio Luján Mora

Universidad de Alicante

DLSI – Universidad de Alicante

1

Contenido
• Accesibilidad en la Web
• Declaración de accesibilidad
• Consejos
• La accesibilidad en la Web ayuda a

todo el mundo
• La iniciativa NI4
La iniciativa NI4
• Negocio
• ¿Auditoria, test, test automático?

¿Qué es la accesibilidad en la Web?

DLSI – Universidad de Alicante

2

Accesibilidad en la Web

“El poder de la Web está en su

universalidad. Que todo el mundo
pueda acceder, sin importar si se tiene
o no una discapacidad, es un aspecto
esencial”

Tim Berners-Lee
Tim Berners Lee

Accesibilidad en la Web

“El poder de la Web está en su

universalidad. Que todo el mundo
pueda acceder, sin importar si se tiene
o no una discapacidad, es un aspecto
esencial”

Tim Berners-Lee
Tim Berners Lee
Creador de la Web (HTML, HTTP, URL)
Director del W3C

DLSI – Universidad de Alicante

3

Accesibilidad en la Web
• Diseño que permita a gente con

discapacidad:
1. Percibir, entender, navegar e interactuar

de forma efectiva en la Web
Contenido web y navegadores y
reproductores multimedia

2. Crear y aportar contenido

Herramientas de autor

Accesibilidad en la Web

• Para lograr este objetivo…
• …es fundamental que las diversas partes que participan en el

d
desarrollo y uso de la Web trabajen juntos

d l W b t b j

ll

t

j

• Estos componentes incluyen:

– Contenido: la información disponible en una página o aplicación web,

incluyendo:

• La información mostrada: texto, imágenes y sonidos
• El código que define la estructura, presentación, etc.

co oc

– Navegadores y otros “agentes de usuario”
– Tecnología de apoyo: lectores de pantalla, teclados alternativos
– El conocimiento y experiencia del usuario
e to y e pe e c a de usua o
– Desarrolladores: diseñadores, programadores, etc.
– Herramientas de autor: las herramientas que crean sitios web
– Herramientas de evaluación: herramientas de evaluación de la

accesibilidad, validadores de HTML y CSS, etc.

DLSI – Universidad de Alicante

4

¿Todos los discapacitados pueden

navegar por Internet?

¿Un ciego, un tetrapléjico?

DLSI – Universidad de Alicante

5

Accesibilidad en la Web

d

t

El Mundo (06/05/2006):
J
Jorge León Escudero, un pentapléjico de 53 años que

d 53 ñ

L ó E

léji

llevaba meses pidiendo en Internet una 'mano
amiga' que le ayudara a 'morir dignamente', fue
encontrado muerto el pasado jueves en su domicilio
de Valladolid, desconectado del respirador que le
mantenía con vida.

Accesibilidad en la Web

g

En agosto de 2005 abrió en Internet un 'blog', en el

que se identificaba como Lucas S. Conseguía
q
manejar el ordenador gracias a un adaptador
labial -explica el diario 'Abc'- y desde hacía dos
meses pedía una 'mano amiga' que le ayudara a
'morir dignamente'. En él aseguró que lo tenía "todo
preparado para que quien me ayude quede
incógnito".

[…]
Los agentes investigan también el contenido del 'blog'
Los agentes investigan también el contenido del 'blog'
que el fallecido actualizaba casi semanalmente
para exponer su caso y su postura favorable a la
eutanasia y para solicitar sin tapujos "ayuda exterior
para poner fin a esta horrible tortura".

DLSI – Universidad de Alicante

6

¿Cuáles son los principales
problemas en las páginas web?

DLSI – Universidad de Alicante

7

Accesibilidad en la Web

• Las barreras más habituales que se suelen

encontrar en la Web son:
encontrar en la Web son:
– Imágenes sin texto alternativo
– Ausencia de texto alternativo para las zonas

sensibles de los mapas de imagen

– Uso incorrecto de los elementos estructurales en

las páginas

– Sonidos no subtitulados e imágenes no descritas
A
– Ausencia de información alternativa para los que
no pueden acceder a los marcos (frames) y a los
scripts u otros objetos programados

i d i f

– Tablas difíciles de interpretar cuando se alinean
– Contraste de colores pobre

ió

ti

lt

l

Accesibilidad en la Web

• No es accesibilidad correcta proporcionar

una “versión alternativa accesible”
ibl ”

ió

ti

lt

“

• La web tiene que ser única, pero accesible
para todo el mundo No existen dos tipos
de ascensores o de entradas en los edificios

• En cualquier caso, la opción “versión

lt
d
alternativa accesible” es mejor que nada

ibl ”

ti

j

DLSI – Universidad de Alicante

8

DLSI – Universidad de Alicante

9

DLSI – Universidad de Alicante

10

DLSI – Universidad de Alicante

11

DLSI – Universidad de Alicante

12

DLSI – Universidad de Alicante

13

DLSI – Universidad de Alicante

14

Accesibilidad en la Web

• Artículo:

– Versión accesible: utilizar sólo en caso de

emergencia. 7 buenas razones para
olvidarnos de las "versiones accesibles".

Fuente: jlvelazquez.net

DLSI – Universidad de Alicante

15

Accesibilidad en la Web

• El punto de verificación 11.4 (prioridad 2) dice así:

Si,
tras todos los esfuerzos aplicados, no puede
tras todos los esfuerzos aplicados, no puede
Si,
crear una página accesible, proporcione un enlace a
una página Web alternativa que use tecnologías
W3C,
(o
funcionalidad) equivalente y se actualice a la par que
la página original no accesible.

información

accesible,

tenga

sea

• El problema es que la mayoría de las versiones
accesibles no surgen tras haber hecho todo lo
posible por evitarla sino que simplemente aparecen
posible por evitarla, sino que simplemente aparecen
por desconocimiento del desarrollador a la hora de
proveer contenidos alternativos a elementos
multimedia, a cumplir los estándares del W3C o
simplemente por capricho del jefe de proyecto,
departamento de marketing o del mismo
desarrollador.

Accesibilidad en la Web
• A continuación podéis ver una lista de 7 razones por las

1. Es una forma de discriminación, una especie de entrada "por
1 E

t d "

i d

ió

i

i

debemos evitarlas:
d di
la puerta de atrás".

f

2. Rompen con la universalidad de la web.
3. Es una forma de duplicar el trabajo, tanto a la hora de

desarrollar el sitio como a la hora de mantenerlo.

4. Suelen ser páginas nada atractivas visualmente (no todos los

discapacitados son ciegos).

5. Suponen un gasto extra de espacio en disco del servidor.
6. Tener una versión accesible separada implica tener una
6 T

versión no accesible. Y eso no es bueno; de la accesibilidad
nos beneficiamos todos.

7. La proliferación de "versiones accesibles" hacen crecer el mito

d i

ibl

ió

li

t

de que la accesibilidad sólo beneficia a usuarios
discapacitados.

DLSI – Universidad de Alicante

16

Accesibilidad en la Web

• A pesar de todo esto...
• Todo sobre las versiones accesibles

injustificadas no podía ser malo. Existe
una cosa aún peor (mucho peor):
una web totalmente inaccesible.

Fuente: jlvelazquez.net

Accesibilidad en la Web
• Otra alternativa es ofrecer distintos

estilos visuales:
– Alto contraste
– Tamaño de letra
– Combinaciones de colores

• Solución adecuada para usuarios con
• Solución adecuada para usuarios con
algunos problemas de visión (visión
reducida, daltónicos, etc.)

DLSI – Universidad de Alicante

17

DLSI – Universidad de Alicante

18

DLSI – Universidad de Alicante

19

DLSI – Universidad de Alicante

20

DLSI – Universidad de Alicante

21

DLSI – Universidad de Alicante

22

Declaración de accesibilidad

• Página web que describe todas las

t

í ti

h

d

ibilid d

características de accesibilidad que se han
implementado:
– Atajos de teclado
– Cumplimiento de los estándares (XHTML, CSS)
– Nivel de accesibilidad logrado
– Decisiones de diseño
Decisiones de diseño
– Ayudas a la navegación
– Cómo contactar
– Enlaces sobre accesibilidad (páginas,

herramientas, libros)

DLSI – Universidad de Alicante

23

DLSI – Universidad de Alicante

24

DLSI – Universidad de Alicante

25

Consejos

• Consejos generales que favorecen a
todo el mundo y algunos específicos
para la gente con discapacidades

DLSI – Universidad de Alicante

26

¿Qué consejos debo tener en cuenta

para hacer páginas accesibles?

Consejos

• Hace falta una planificación y un diseño

previo
previo

• En función:

– Del propósito del sitio web
– Del contenido
– Del público o audiencia destinatarios
– De aquello que se espera obtener del sitio web
– De aquello que los visitantes esperan obtener

• A veces existen auténticos guiones detrás de

muchas estructuras de navegación

DLSI – Universidad de Alicante

27

Estructura lógica (y 3)

DLSI – Universidad de Alicante

28

¿Qué mecanismos existen para que
un usuario no se pierda en un sitio

web?

Mecanismos de navegación
• Para evitar que el usuario o visitante no se

t

l

ió

i d d
pierda durante la navegación, se puede usar:
– “Rastro de las migas de pan”: muestra una lista
con los enlaces que el usuario ha visitado o el
nivel actual de la jerarquía de navegación desde
la página principal

d

– Numeración de los pasos: se indica una lista con

todos los pasos necesarios para completar un
proceso así como el paso en el que se encuentra
el usuario

DLSI – Universidad de Alicante

29

DLSI – Universidad de Alicante

30

DLSI – Universidad de Alicante

31

DLSI – Universidad de Alicante

32

Consejos
• Regla de los “tres clicks”

– Para acceder a la información útil

• Evitar “callejones sin salida”
• Todas las páginas:

– Un enlace a la página principal
– A la página anterior

¿Por qué poner un enlace a la

página anterior?

DLSI – Universidad de Alicante

33

DLSI – Universidad de Alicante

34

Consejos

• Barra de navegación (menú con las opciones

principales del sitio web)
principales del sitio web)

• Opción de búsqueda
• Mapa del sitio
•

Indicar formas de contacto con alguna persona
(correo, teléfono): webmaster, comercial, etc.

• Aplicar una imagen corporativa para pro