UROLALDE S.L.
Usabilidad y accesibilidad de los sitios web
Confección y publicación de páginas web
Alazne Ugarteburu
Convocatoria 2014-2015
1
ContenidoCONCEPTOS BÁSICOS SOBRE USABILIDAD Y ACCESIBILIDAD WEB.........................................................4
Comprendiendo la Accesibilidad, sus problemas y los retos pendientes...........................................4
Personas con Discapacidad................................................................................................................5
Discapacidades Visuales.................................................................................................................5
Discapacidades Auditivas...............................................................................................................6
Discapacidades Motoras................................................................................................................7
Discapacidades Cognitivas y Neurológicas.....................................................................................8
Dificultades relacionadas con la edad avanzada............................................................................8
Concepto de Usabilidad frente a Accesibilidad..................................................................................9
TIPOLOGÍA DE ACCESO A LA WEB PARA LAS PERSONAS CON DISCAPACIDAD. CONCEPTO DE DISEÑO CENTRADO EN EL USUARIO Y DISEÑO PARA TODOS. DISEÑO DEL INTERFAZ Y DE LOS CONTENIDOS. 11
Diseño centrado en el usuario.........................................................................................................11
Diseño para todos............................................................................................................................12
Diseño en función del tipo de discapacidad.....................................................................................14
Diseño del interfaz y de los contenidos............................................................................................15
INICIATIVA WAI Y PAUTAS W3C...........................................................................................................16
El consortium W3C...........................................................................................................................16
Iniciativa WAI...................................................................................................................................17
Pautas de Accesibilidad al Contenido en la Web (WCAG)................................................................17
Pautas de usabilidad web.................................................................................................................19
Navegación...................................................................................................................................21
Estilo del texto.............................................................................................................................22
Cuerpo de texto...........................................................................................................................23
Imágenes para textos...................................................................................................................23
2
Formularios..................................................................................................................................24
TEMA 4. HERRAMIENTAS AVANZADAS DE VALIDACIÓN DE LA ACCESIBILIDAD WEB...........................24
TAW.............................................................................................................................................24
INTAV – Inteco Accessibility Validator..........................................................................................25
Cynthia Says.................................................................................................................................26
HERA............................................................................................................................................26
The Wave.....................................................................................................................................27
Herramientas online de validación de gramática.............................................................................27
3
CONCEPTOS BÁSICOS SOBRE USABILIDAD Y ACCESIBILIDAD WEB.
Comprendiendo la Accesibilidad, sus problemas y los retos pendientes
El objetivo de la Accesibilidad Web es sensibilizar, sugerir y recordar a los creadores
de páginas web, las técnicas y herramientas que hay que utilizar para conseguir que
cualquier persona las pueda visitar, independientemente de su (dis)capacidad.
Una página web se considera accesible cuando cualquier persona, con total
independencia de sus capacidades personales o del equipo con el que se conecten,
puede acceder a Internet y utilizar y comprender todos sus contenidos. Según el
American Heritage Dictionary: “Algo es accesible cuando puede ser obtenido
fácilmente”.
Un sitio web puede intercambiar información, presentar información descriptiva del
mismo, interaccionar con el usuario para que este aprenda conceptos o habilidades,
mostrar enlaces hacia otras páginas de interés, o incluso simplemente entretener al
visitante con juegos y pasatiempos. La accesibilidad web asegura que todas estas
posibilidades están disponibles a cualquier tipo de persona.
Otras razones para construir sitios Web accesibles pueden ser, por ejemplo, que se
quiera ganar mayor audiencia o potenciar el número de clientes (en el mejor sentido
comercial) o que se pretenda alcanzar una posición de liderazgo en un determinado
nicho de mercado.
Pero la realidad es que la normativa obliga ya hoy en día, en gran parte de países, a
que los sitios web sean accesibles, comenzando por las administraciones públicas y
servicios públicos, en general. La accesibilidad web es un derecho fundamental de
las personas con discapacidad para poder acceder a los servicios que ofrece la red,
y por ello, las normas y estándares están jugando un papel fundamental en el
desarrollo de Internet.
4
Personas con Discapacidad
En el área de la salud, una discapacidad es toda restricción o ausencia (debida a
una deficiencia) de la capacidad de realizar una actividad en la forma o dentro del
margen que se considera normal para un ser humano.
Una posible clasificación es la siguiente:
1. Discapacidades Visuale s
2. Discapacidades Auditiva s
3. Discapacidades Motora s
4. Discapacidades Cognitiva s
5. Dificultades por la edad avanzada
Discapacidades Visuales
Las personas con discapacidad visual tienen problemas graves de visión que, para
desarrollar su vida correctamente, pueden necesitar un programa de rehabilitación
visual y/o ayudas ópticas o electrónicas. Se incluyen desde personas con visión
parcial hasta la ceguera total, siendo la primera la de más amplio rango y la última la
menos común.
Algunas de las dificultades que se pueden encontrar las personas con discapacidad
visual a la hora de acceder a una Página Web son las siguientes:
Las personas con visión parcial pueden tener dificultad para apreciar las
pequeñas diferencias de color, pueden no apreciar la letra pequeña y pueden
perder la orientación dentro de una Página Web.
Las personas con visión cromática parcial (como el Daltonismo) pueden no
llegar a distinguir los contenidos de las Páginas al no distinguir los colores
rojo / verde y sus compuestos o páginas con bajo contraste.
5
Las personas con ceguera total no tienen ningún acceso a los contenidos
visuales ni a los documentos escritos en papel, a no ser que éstos estén en
Braille y, aún así, no son muchos los que pueden acceder a este tipo de
documentos, ya sea por no haberlo aprendido o por falta de recursos.
Los mecanismos de acceso a la información en Internet para personas con
discapacidad visual pueden basarse en la amplificación de la imagen, la síntesis de
voz y la salida Braille.
Las opciones basadas en la ampliación de la imagen (uso de “lupas”
software) son válidas únicamente para quienes poseen algún grado de visión.
Las basadas en síntesis de voz (o en grabaciones auditivas) son válidas para
quienes tienen visión parcial o total y oyen adecuadamente.
Para las personas sordo-ciegas la única posibilidad de las tres mencionadas
es la de la salida Braille, que también es válida para el resto de la gente,
siempre y cuando conozcan este lenguaje.
Discapacidades Auditivas
Las discapacidades auditivas incluyen la sordera total y parcial, ya sea por falta de
audición de los volúmenes bajos o de frecuencias determinadas. Los afectados
suelen dividirse en dos grandes grupos según sean personas con pérdida auditiva
congénita debida a factores hereditarios o problemas o alteraciones producidas
durante la gestación o bien pérdida auditiva tardía producida por factores
ambientales, como alto índice de contaminación sonora en el trabajo, o por
enfermedad. Estas últimas personas se dividen también en dos subgrupos según
hayan experimentado la pérdida auditiva antes (prelocutivas) o después
(postlocutivas) de aprender el lenguaje.
Las dificultades que se pueden encontrar las personas con discapacidad auditiva a
la hora de acceder a una página web pueden ser las siguientes:
6
Las personas con discapacidad leve auditiva pueden tener dificultad para
apreciar correctamente los contenidos auditivos, como músicas, mensajes en
voz y mensajes en video.
Las personas con sordera total no tienen ningún acceso a los contenidos
auditivos.
Las personas sordo-ciegas no pueden acceder a los contenidos auditivos ni a
los equivalentes visuales.
Las personas sordo-mudas, además de no oír, tienen problemas de
comprensión derivados de sus deficiencias de comunicación.
En síntesis.- El acceso a la información en Internet para personas con discapacidad
auditiva se basa en los equivalentes visuales, en la claridad de contenidos,
especialmente para las personas sordo-mudas, y, para las personas sordo-ciegas,
en la salida Braille.
Discapacidades Motoras
En el grupo de las discapacidades motoras grupo se incluyen todas aquellas
discapacidades que afecten al movimiento del cuerpo, desde las dificultades al
caminar por vejez hasta la inmovilidad por paraplejia. Estas discapacidades pueden
provenir de lesiones medulares, con predominio de afectación de miembros
inferiores o paraplejía sobre las cuatro extremidades (tetraplejía), traumatismos
craneo-encefálicos, parálisis cerebral, esclerosis múltiple, hemiplejía, poliomelitis,
distrofia muscular y alteraciones osteoarticulares.
Estas son algunas de las dificultades que se pueden encontrar las personas con
discapacidad motora a la hora de acceder a una Página Web:
Las personas con problemas de coordinación pueden no atinar bien en los
enlaces o en las zonas pequeñas de los mapas de imagen con los
dispositivos apuntadores (como ratón, lápices, etc.).
7
Las personas con movilidad reducida pueden tener dificultades a la hora de
recorrer visualmente la pantalla o leer un documento muy extenso.
Las personas con dificultades para mover las manos pueden no ser capaces
de utilizar un ratón para desplazarse por la pantalla.
En síntesis.- El acceso a la información en Internet para personas con discapacidad
motora se basa en la claridad de contenidos, el acceso por teclado y dispositivos
táctiles y la información auditiva (para quienes no poseen discapacidad auditiva).
Discapacidades Cognitivas y Neurológicas
Las discapacidades cognitivas y neurológicas son las que generan dificultades de
comprensión, ya sean por deficiencias mentales o incluso por un bajo nivel cultural.
Aquí se incluyen, por ejemplo, enfermedades congénitas como el Síndrome de
Down y también las discapacidades provenientes de lesiones neurológicas sufridas
por enfermedades como esclerosis múltiple, Alzheimer, Parkinson y ciertas
enfermedades musculares.
Las dificultades que se pueden encontrar las personas con discapacidades
cognitivas a la hora de acceder a una Página Web pueden ser las siguientes:
Si los contenidos no están expresados con un lenguaje claro pueden no ser
entendidos.
Si las páginas son muy grandes pueden perderse y no encontrar la
información que se está buscando.
Si el documento no contiene ejemplos, explicaciones o diagramas aclarativos
sencillos pueden no ser entendidos.
En síntesis.- Los mecanismos de acceso a la información en Internet para personas
con discapacidad cognitiva se basan, principalmente, en la claridad de contenidos y
8
en la funcionalidad y navegabilidad (mecanismos claros de navegación, agrupación
de contenidos relacionados, páginas cortas y visuales, etc.)
Dificultades relacionadas con la edad avanzada
Los cambios en las capacidades de una persona debidos a la edad avanzada
pueden incluir cambios en su capacidad de visión, audición, destreza y memoria.
Las barreras que estas personas encuentran para utilizar la Web pueden incluir
cualquiera de las mencionadas anteriormente.
En síntesis.-El diseño para todos no es un requisito únicamente para personas con
discapacidades sino para un amplio grupo de personas que por distintas
circunstancias se benefician de un diseño web que cumpla los estándares de
accesibilidad y usabilidad.
Concepto de Usabilidad frente a Accesibilidad
La usabilidad se define como: “El nivel con el que un producto se adapta a las
necesidades del usuario y puede ser utilizado por los mismos para lograr unas
metas específicas con efectividad, eficiencia y satisfacción en un contexto específico
de uso”.
Por tanto, la usabilidad es una medida que indica la idoneidad de un producto para
que determinados usuarios puedan alcanzar con ellos satisfactoriamente, ciertos
objetivos, de forma efectiva y eficiente. Así, la usabilidad mide la rapidez y la
facilidad con la que ciertas personas desarrollan ciertas actividades utilizando un
determinado producto. Por tanto, son los usuarios de un producto, y no sus
diseñadores o desarrolladores, los que determinan cuando un producto es sencillo
de utilizar.
La usabilidad presupone, por tanto:
Diseño del producto centrado en el usuario.
Conocimiento amplio del contexto en el que se usa el producto.
9
El producto debe satisfacer las necesidades del usuario.
La usabilidad asume cada vez una parte mucho más importante de la economía de
Internet que en el pasado. En el desarrollo tradicional de cualquier producto, el
usuario no puede experimentar su usabilidad hasta que no lo ha adquirido, y quizás
en ese momento se dé cuenta del error que acaba de cometer comprándolo.
La industria del software tiene muchos motivos para mejorar la usabilidad de sus
productos. Los usuarios, generalmente, tienen la posibilidad de contactar con un
centro de atención al cliente o un servicio técnico on-line, al que pueden llamar para
resolver sus dudas. Pero estos servicios post-venta suelen resultar caros de
mantener y recortan las cifras de beneficios.
El objetivo principal de la mayoría de los proyectos web consiste en facilitar a los
clientes la realización de ciertas actividades útiles, si bien también hay un gran
número de páginas web que simplemente muestran arte o facilitan entretenimiento.
Y aún más, el desarrollo de software para la Web invierte además la imagen
tradicional ya que los usuarios de un sitio web experimentan su usabilidad antes de
que se hayan comprometido a usarlo y sin pagar nada por ello.
Por todo lo anterior, la usabilidad es importante y debe tenerse en cuenta siempre,
puesto que:
Reduce los costes de producción.
Reduce los costes de mantenimiento y soporte al cliente.
Reduce el coste del uso, al aumentar la sencillez de manejo.
Mejora, de forma global, la calidad del producto.
La accesibilidad, es, frente al concepto general de la usabilidad, un término
restringido a usuarios que presentan una discapacidad. Esta discapacidad puede ser
visual, auditiva o cognitiva, o simplemente puede ocurrir que existan barreras
arquitectónicas o de diseño para acceder a la información.10
Así, muchas personas, no pueden ver, oír, o moverse con facilidad, algunas tienen
serias dificultades para entender cierto tipo o volumen de información. Otros pueden
tener dificultades en la lectura o comprensión de textos escritos,algunos pueden no
ser capaces de mover un dispositivo apuntador, como un ratón, y otros no pueden
manejar un teclado.
Pero también hay usuarios plenamente “capacitados” que sólo disponen de una
pantalla muy pequeña o con poca resolución, otros poseen una conexión a Internet
desesperadamente lenta, y otros disponen de navegadores o sistemas operativos
con versiones anticuadas. A veces ocurre también que se visitan páginas web
escritas en otros idiomas que no se comprenden con facilidad, o que uno puede
acceder a Internet en una situación laboral con exceso de ruido ambiente o con las
manos ocupadas (por ejemplo manejando un volante) con lo que la percepción
cognitiva disminuye.
Un sitio web accesible debe estar disponible independientemente del equipo o
navegador de los que disponga el usuario. Por tanto, en el diseño de las páginas
web es fundamental considerar las diferencias existentes entre los navegadores, al
menos teniendo en cuenta los más populares y del mayor número de versiones. Así,
los desarrolladores deben considerar el mayor número posible de estas situaciones,
ya que un sitio más accesible dispondrá de mayor número de usuarios potenciales.
TIPOLOGÍA DE ACCESO A LA WEB PARA LAS PERSONAS CON DISCAPACIDAD. CONCEPTO DE DISEÑO CENTRADO EN EL USUARIO Y DISEÑO PARA TODOS. DISEÑO DEL INTERFAZ Y DE LOS CONTENIDOS
Diseño centrado en el usuario
En general, el diseño web requiere un enfoque muy sistemático, con una secuencia
de métodos que cualquiera puede usar para descubrir las necesidades de los
usuarios y las dificultades que éstos pueden experimentar al usar las páginas web.
Por tanto, los proyectos web deben tratarse como un proyecto general de desarrollo
de software facilitando así el cumplimiento de los programas y la garantía de la
calidad del sitio. En concreto, la aplicación continuada de la metodología de las
11
técnicas de usabilidad conducirá a la mejora del sitio, tanto en el diseño inicial como
en los refinamientos sucesivos.
El diseño de los sitios web es fundamental en términos de usabilidad, ya que los
usuarios encuentran serias dificultades para acceder a las páginas adecuadas si los
sitios no están estructurados en función de sus necesidades o si carecen de mapas
de navegación que les puedan orientar hacia lo que están buscando.
¿Qué significa diseño centrado en el usuario? Se refiere a cualquier diseño que
considera principalmente la opinión del usuario. El usuario debe controlar la
situación manejando el producto, y por tanto, la consistencia es parte indispensable
del diseño, como lo es también la simplicidad. Al considerar todo tipo de usuarios,
dos principios básicos también son la usabilidad y la accesibilidad. Lógicamente será
muy difícil crear un producto completamente accesible, pero deberá serlo lo más
posible.
Los siete mandamientos del diseño centrado en el usuario son:
Uso provechoso
Fácil e intuitivo
Flexibilidad en el uso
Información percibida
Tolerancia al error
Mínimo esfuerzo físico
Tamaño y espacio físico adecuado para su uso
En resumen, el producto o servicio deberá ser accesible, comprensible y utilizable.
Diseño para todos
El campo de las Tecnologías de la Rehabilitación constituye un sector tecnológico
multidisciplinar orientado a la búsqueda de soluciones en el campo de la
accesibilidad integral. Es un sector que busca soluciones técnicas para el conjunto
de la población y especialmente para aquellas personas que por una o varias
limitaciones funcionales ven reducidas sus posibilidades de participación en la vida
social y económica. Este sector propone dos estrategias diferentes de intervención 12
que a su vez son complementarias:
El desarrollo de ayudas técnicas, dispositivos y sistemas diseñados
específicamente para personas con discapacidad o personas mayores.
La mejora de la accesibilidad en el diseño del entorno de uso general y de los
productos y servicios de consumo general.
Dentro de la segunda estrategia, el término Diseño Para Todos (Design for All -
Universal Design) hace alusión a una filosofía que promueve que los productos y los
servicios deben estar diseñados para todos los usuarios. Esto supone ir más allá del
diseño tradicional, en el que el producto se basaba en la media del sector de
población al que iba destinado, y prever ahora las necesidades concretas que pueda
tener cada persona. Un ejemplo claro de lo anterior son los ancianos. Gracias al
aumento de la esperanza de vida en Europa hay cada vez más gente mayor que
necesita servicios adaptados en el transporte público (con piso bajo); teléfonos y
televisiones inteligentes (con teclas de acceso rápido y de fácil entendimiento); y por
extensión para acceder a un ordenador y a una página web.
El Centro para el Diseño Universal / Centre for Universal Design) ha desarrollado
unos principios que pueden servir de directrices generales:
Principio 1.- Uso equitativo. El diseño resulta útil y susceptible de ser vendido a
cualquier grupo de usuarios. Para evitar la segregación de usuarios se trata de
proporcionar las mismas pautas de uso para el mayor número de usuarios. El
producto garantizará la privacidad, la seguridad y la estabilidad para todos sus
usuarios.
Principio 2.- Uso flexible. El diseño se adapta a un amplio rango de capacidades y
preferencias individuales. Proporciona alternativas en los métodos de uso. Permite
que se pueda acceder y usar con ambas manos. Facilita la exactitud y precisión del
usuario.
Principio 3.- Uso intuitivo y sencillo. El diseño es fácil de comprender,
13
independientemente de la experiencia, el conocimiento, la habilidad verbal o el nivel
de concentración del usuario. Es necesario eliminar la complejidad innecesaria,
adaptarse a las expectativas y a la intuición del usuario, adaptarse a un amplio
rango de niveles de alfabetización y de uso del lenguaje, estructurar la información
según su importancia, proporcionar orientación eficaz para lasmacciones
secuenciales y proporcionar realimentación tanto durante la realización de una
Actividad como tras su finalización.
Principio 4.- Información perceptible. El diseño transmite de forma eficaz la
información necesaria al usuario, independientemente de las condiciones
ambientales y de su capacidad sensorial. Por ello se deben usar distintas
modalidades para presentar de forma duplicada la información esencial: gráfica,
verbal, táctil, etc.
Ya es conocido que el papel del desarrollo tecnológico es fundamental en la
integración social del discapacitado. Si existen barreras frente al acceso a la
información, el entorno es discapacitante. En la vida de las personas con
discapacidad, el ordenador no sólo tiene una gran repercusión sobre su calidad de
vida, sino que les abre además las puertas de multitud de trabajos que antes les
eran negados. Así, se facilita tanto su integración laboral como formativa. Otra
aportación más novedosa proviene de la red Internet que ha provocado el
florecimiento de la comunicación a distancia y el libre acceso a un caudal inagotable
de información.
Diseño en función del tipo de discapacidad
El concepto de discapacidad es un concepto muy amplio cuando se trata de manejar
ordenadores o navegar por Internet; así aunque una persona discapacitada necesite
moverse en silla de ruedas, sin embargo no precisa ninguna ayuda técnica especial
para navegar por la red.
En Europa existen unos 43 millones de personas con discapacidad, distribuidas
según sus dificultades según el diagrama que se muestra a continuación. Cada
14
discapacidad, lógicamente, tiene sus propios problemas de accesibilidad en el uso
de las telecomunicaciones y acceso a servicios relacionados.
Por ejemplo, los ciegos no ven la pantalla y necesitan utilizar lectores de pantalla,
aplicaciones software que “leen” la información desplegada en la pantalla y
comunican los eventos producidos por el usuario: abrir o cerrar programas,
activación de opciones de menú, despliegue de ventanas de aviso o de información,
etc. Pero existen otras personas con visión parcial que únicamente utilizan lupas
para aumentar el contenido de la pantalla. Antiguamente estas lupas se
desplazaban por medio de dos carriles paralelos a lo largo de la pantalla en sentido
vertical; hoy en día las “lupas” son aplicaciones software que permiten modificar el
grado de aumento simplemente con un clic de ratón o variando un número.
En cuanto a las personas sordas, se utilizan elementos visuales o iconos que
aparezcan en la pantalla con la activación de sonidos. También, se puede realizar
una redundancia de canal para las personas que posean mala audición.
En cuanto a las personas con dificultades físicas, uno de los mayores problemas
estriba en la falta de precisión en el uso del ratón y del teclado. En casos extremos,
el uso de ayudas técnicas precisas, como licornios sujetos a la cabeza, pueden
15
servir de periféricos apuntadores.
Diseño del interfaz y de los contenidos
De forma general, algunos de los problemas derivados de un mal diseño del interfaz
hombre-máquina son:
Mala distinción de colores o bajo contraste.
Sólo se admiten movimientos de ratón para seleccionar cosas.
No se proporcionan combinaciones de teclas alternativas a la selección de
opciones de menú, por ejemplo.
Errores graves en la colocación de etiquetas en los formularios.
No se permite la navegación por teclado de formularios, por ejemplo
mediante la tecla <Tab>.
Falta de opción terminar en muchos formularios.
El diseño del interfaz debe dar respuesta a las siguientes preguntas (Joaquín
Márquez Correa de icon medialab):
¿Tiene el sitio web una interfaz amigable, con colores que concuerden con
los objetivos y propósitos del sitio?
¿Hay espacios blancos (libres) entre el contenido, para descansar la vista?,
¿o existe una sobresaturación de elementos en la página que desconcierta al
usuario?
¿Se ve el sitio exactamente igual tanto en Mac como en PC? ¿Y en Internet
Explorer como en Firefox?
Mientras que algunos problemas de acceso a los contenidos son los siguientes:
Una página web que sólo contiene gráficos no puede ser leída por los
lectores de pantalla.
De igual forma, si sólo contiene elementos de audio, no vale para sordos. Si
hay un elemento de vídeo sin subtítulos, tampoco es válido para sordos.
Si el contenido está mal estructurado, los usuarios tendrán problemas de
aprendizaje.16
Si existe demasiado texto, las personas sordas se aburren y pierden la
atención.
Si el idioma es extraño o está redactado de forma poco clara, también se
producen dificultades en el aprendizaje.
El diseño de los contenidos debe dar respuesta a las siguientes preguntas (Joaquín
Márquez Correa de icon medialab):
¿Es coherente el contenido con el contexto de la página o site?
¿La redacción es corta y precisa, evitando los textos demasiado extensos?.
¿Existen referencias cruzadas entre textos que están relacionados?
¿Se evita usar líneas horizontales para hacer separaciones en los textos,
pueden ser interpretadas como el fin de la información?.
INICIATIVA WAI Y PAUTAS W3C
El consortium W3C
El Consorcio W3C fue creado para desarrollar plenamente el potencial de la Web.
Es el organismo que define los protocolos comunes que promueven su evolución y
aseguran su interoperabilidad.
Se trata de un consorcio industrial internacional dirigido conjuntamente por el
Laboratorio de Informática del Instituto Tecnológico de Massachusetts (MIT) en
EE.UU., el Instituto Nacional de Investigación en Informática y Control (INRIA) en
Francia y la Universidad de Keio en Japón. En la actualidad el Consorcio está
formado por más de 300 organizaciones miembros.
El consorcio W3C (World Wide Web Consortium) comenzó en 1997 la normalización
del procedimiento de diseño de las páginas web a través de un grupo de trabajo
conocido como iniciativa WAI (Web Accesibility Initiative), para asegurar el acceso a
la información en Internet de todas las personas, tengan o no discapacidad.
Iniciativa WAI
17
El grupo de trabajo WAI del W3C, en asociación con organizaciones de todo el
mundo, está promoviendo la accesibilidad en la Web a través de cinco actividades
complementarias:
Asegurar que las tecnologías esenciales de la Web soporten la accesibilidad.
Desarrollar pautas o recomendaciones para la autoría de páginas,
aplicaciones de usuario y herramientas de autor.
Desarrollar herramientas de evaluación y reforma para la accesibilidad.
Dirigir la formación y asistencia técnica.
Seguir la pista a la investigación y desarrollo que pueda afectar a la
accesibilidad futura de la Web.
La Unión Europea ha asumido el compromiso de adoptar la pautas de la WAI para el
diseño de las páginas Web de las Administraciones Públicas.
Pautas de Accesibilidad al Contenido en la Web (WCAG)
La evaluación técnica se basa en los puntos de verificación de las Pautas de
Accesibilidad al Contenido en la Web (WCAG) emitidas por el grupo W3C/WAI.
Las pautas WCAG 1.0 se publicaron en mayo de 1999 como Recomendación del
W3C pretendiendo servir de guía para explicar cómo hacer accesibles los
contenidos de la Web a personas con discapacidad. La recomendación se publicó
junto con otro documento titulado "Técnicas para las Pautas de Accesibilidad al
Contenido en la Web 1.0" que explicaba al programador cómo aplicar los puntos de
verificación definidos en las pautas.
Así, la evaluación técnica se basaba en los siguientes 12 puntos de verificación
como síntesis indicativa de las Pautas correspondientes a los niveles A y AA. Estos
criterios incluyen en su mayor parte aspectos de prioridad 1 y en algunos casos de
prioridad 2, siendo todos de obligado cumplimiento:
Formularios (prioridades 1 y 2 en WCAG 1.0).
18
o El atributo placeholder tiene que estar en todos los input.
o Todos los elementos tendrán un atributo value y un atributo id.
o Instrucciones de formulario
o El formulario tiene que hacer submit cuando el usuario quiera.
Alternativas textuales a elementos multimedia (prioridad 1 en WCAG 1.0).
o ALT en todas las <img>
o ALT en mapas de imágenes
o ALT descriptivo (no 000pic ni espacio en blanco)
o Todo audio-video subtitulado y con texto alternativo.
o Uso del track para las descripciones de video
o Si un audio empieza automático, tiene que apagarse en menos de 3sg.
o Panel de control del audio siempre visible
o Poner audio cuando el usuario solicita
Encabezados (prioridad 2 en WCAG 1.0).
o Cada bloque de contenido tiene que llevar un h1…h6
Unidades relativas en la Hoja de Estilo (prioridades 1 y 2 en WCAG 1.0).
Enlaces comprensible (prioridad 2 en WCAG 1.0).
o Los link se diferencian con un color diferente (azul)
o Uso de anclas para ir al contenido.
o Texto hipervínculos correcto
Contraste (prioridad 2 para las imágenes en WCAG 1.0).
Uso semántico de los colores (prioridad 1 en WCAG 1.0).
Alineación del contenido de las tablas (prioridad 2 en WCAG 1.0).
Tablas de datos (prioridad 1 en WCAG 1.0).
Scripts (prioridad 1 en WCAG 1.0).
19
o Script que te avise que el límite de sesión está a punto de expirar
o Si se detecta un error se le tiene que describir al usuario
Navegación y código:
o Instrucciones de navegación
o <title></title> en todas las paginas
o Todas las etiquetas con principio y fin
o Sin atributos duplicados
o Etiquetas anidadas correctamente
o ID's unicos
o Más de un camino para llegar a un sitio
o Navegación coherente
Pautas de usabilidad webEstos son los principios básicos de usabilidad:
Anticipación: el sitio web debe anticiparse a las necesidades del usuario.
Autonomía: los usuarios deben tener el control sobre el sitio web.
Todos los enlaces deben de FUNCIONAR.
Escribir los contenidos resumidos un 25% de lo que sería en un papel (leer en
pantalla cuesta mucho).
Los colores han de utilizarse con precaución para no dificultar el acceso a los
usuarios con problemas de distinción de colores.
Eficiencia del usuario, los sitios web se deben centrar en la productividad del
usuario, no en la del propio sitio web.
Por ejemplo, en ocasiones tareas con mayor número de pasos son más
rápidas de realizar para una persona que otras tareas con menos pasos, pero
más complejas.
Reversibilidad, un sitio web ha de permitir deshacer las acciones
realizadas. 20
Ley de Fitts indica que el tiempo para alcanzar un objetivo con el ratón
esta en función de la distancia y el tamaño del objetivo. A menor distancia
y mayor tamaño más facilidad para usar un mecanismo de interacción.
Calidad es igual a rapidez. (más de 20 segundos el 80% de los visitantes
se irá sin ver la página)
Reducción del tiempo de latencia. Hace posible optimizar el tiempo de
espera del usuario, permitiendo la realización de otras tareas mientras se
completa la previa e informando al usuario del tiempo pendiente para la
finalización de la tarea.
Sitio sencillo. Aprendizaje, los sitios web deben requerir un mínimo
proceso de aprendizaje y deben poder ser utilizados desde el primer
momento.
El uso adecuado de metáforas facilita el aprendizaje de un sitio web, pero
un uso inadecuado de estas puede dificultar enormemente el aprendizaje.
La protección del trabajo de los usuarios es prioritario, se debe asegurar
que los usuarios nunca pierden su trabajo como consecuencia de un error.
Legibilidad, el color de los textos debe contrastar con el del fondo, y el
tamaño de fuente debe ser suficientemente grande.
Se deben evitar ciertas acciones:
Abrir nuevas ventanas de navegación. La excepción: documentos PDFy
similares.
Elementos de diseño que parecen publicidad.
Contenido etéreo y promoción vana
Contenido denso y texto extenso
Tiempo lento de descarga.
Flash
21
Multimedia y videos largos.
Diseños congelados (anchura fija).
Navegación Garantizar la persistencia en el diseño, garantiza seguridad al usuario:
o Ver siempre el nombre del sitio Web, su logotipo, colores identidad.
o El área de navegación sencilla y global de la parte superior aparezca visible y consistente en todo el sitio.
Diferenciar enlaces de navegación del resto de contenidos.
El usuario tiene que saber en todo momento:
o De dónde viene, dónde está, dónde puede ir.
Barra horizontal superior es perfecta para la navegación ppal. o global.
Barra vertical para la secundaria o local.
La navegación global es más sólida (menos cambios) que la local.
22
Estilo del textoLa selección de "colores básicos" de nuestro site se debe mantener dentro del rango
de 256 colores. Ampliar el rango en elementos no fundamentales (fotos,
ilustraciones, etc.) pero debemos asegurarnos que el 100% podrá acceder a nuestro
sitio sin problemas.
Para el menú: Lo mejor es tener dos colores, para identificar el elemento
activo de la barra de navegación y para identificar los elementos apagados.
Colores para enlaces:Es recomendable conservar los colores estándar (azul
subrayado). Si decides cambiarlo, recuerda lo siguiente:
Los links tienen 2 estados (sin pulsar y pulsado) por lo que tendrás que elegir
un color saturado para el estado sin pulsar y otro menos saturado para el
estado pulsado.
Color del fondo: El texto corrido se lee mejor con fondo claro y texto oscuro.
Lo mas recomendable es el fondo blanco o el amarillo claro. Otros colores
claros son menos cómodos para leer, pero si tu site no exige lecturas
prolongadas, puedes usarlos para llamar la atención y conseguir una lectura
mas compulsiva.
Percepción: El texto es demasiado pequeño o confuso. Utilice fuentes de
tamaño 10 o superiores. Utilizar texto negro sobre fondos blancos para un
23
contraste adecuado. No usar texto falso “lorem ipsum” muy habitual en
diseñadores.
Cuerpo de texto
Tipo de público (puntos)
Público general 10-12.
Tercera edad y personas con problemas de visión 12-14.
Niños y otros lectores principiantes 12-14.
Adolescentes y jóvenes 10-12.
Contra las mayúsculas
Reduce la velocidad de lectura en un 10%.
Aspecto de infantil, o agresivo y poco profesional.
Sólo usar en encabezados cortos y títulos (y para gritar).
Imágenes para textos
Los gráficos hacen que los archivos sean más pesados.
El texto basado en gráficos no es apto para la búsqueda.
El texto basado en gráficos no es seleccionable.
24
El texto gráfico no es escalable.
Los lectores de pantalla no pueden leer texto gráfico fácilmente.
Formularios Reduce al máximo el numero de campos en los formularios.
o Correo electronico = nombre de usuario.
o DNI = password.
Evita formalidades
o Tratamiento (Don, Sr., Sra.,)
o Tipo de Via (Calle, Camino, ...)
TEMA 4. HERRAMIENTAS AVANZADAS DE VALIDACIÓN DE LA ACCESIBILIDAD WEB.
TAW
TAW ha sido desarrollado por la Fundación CTIC (Centro Tecnológico de la
Información y la Comunicación) para el CEAPAT. Es una herramienta en español y
en inglés, multiplataforma, que permite el análisis y ofrece información sobre el
grado de accesibilidad de un sitio web. Además, proporciona una propuesta de
solución de los problemas de accesibilidad que presenta dicho sitio web.
A lo largo de su existencia, se han desarrollado varias versiones, cuyas
características más destacables se muestran a continuación:
TAW v.1 (2000): sólo vía web, introduciendo url de la página a evaluar en un
editor de búsqueda.
TAW v.2 (2002): evaluaba ya un portal completo, con jerarquía desde el
index.html.
25
TAW v.3 (2005): es residente en el PC y además se actualiza de forma
automática para usuarios registrados vía web con Java Web Start y firma
electrónica.
Esta última versión del TAW incorpora además otras interesantes funcionalidades:
Actualización completa del motor de análisis lo que supone la ampliación del
número de comprobaciones.
Actualización del entorno gráfico lo que permite la comprobación visual para
facilitar la validación manual.
Análisis de sitios web bajo protocolo seguro (soporte HTTPS).
Validación de zonas protegidas mediante HTTP auth.
Acceso a través de proxy y proxy con contraseña.
Añadir comprobaciones personalizadas.
Configuración de validación a nivel de punto de verificación.
Límite del nº de páginas del análisis.
Ampliación del número de comprobaciones.
Informe EARL.
Versión en inglés.
URL: http://www.tawdis.net
También disponible como extensión de Firefox en: https://addons.mozilla.org/es-
ES/firefox/addon/1158
INTAV – Inteco Accessibility Validator
El Centro de Referencia en Accesibilidad y Estándares Web de INTECO, como
medio de promoción de acceso regular y normalizado a la Sociedad de la
Información por parte de personas con discapacidad (RD 1494/2007), debe velar por 26
el cumplimiento de la legislación vigente en materia de Accesibilidad. Por esta razón,
ha desarrollado este servicio automático de detección de barreras de acceso a la
información: INTAV.
Se trata de un servicio que analiza, de forma automática, el cumplimiento de los
requisitos de accesibilidad Web en base a la normativa vigente y estándares (UNE
139803:2004 y WCAG).
De este modo, el servicio de INTAV revisa una página Web e informa sobre los
problemas de accesibilidad detectados automáticamente, así como de las
advertencias y observaciones que deberán ser comprobadas de forma manual.
El objetivo de INTAV es poder facilitar la revisión de algunos aspectos de
accesibilidad de las páginas Web. Al automatizar el análisis se consigue optimizar
las acciones y los esfuerzos dedicados en el análisis de accesibilidad de una página
web.
INTAV está integrado en un Ciclo de Mejora Continua, avanzando en las
comprobaciones e incrementando su eficiencia.
URL: http://www.inteco.es/checkAccessibility/Accesibilidad/accesibilidad_servicios/
intav_home/
Cynthia Say s
El portal Web de Cynthia Says es un proyecto educacional promovido por varias
organizaciones y empresas creado para divulgar entre los desarrolladores la
accesibilidad Web. Cynthia es una herramienta de validación automática de
accesibilidad según las WCAG 1.0 y la Sección 508 que se basa en la Tabla de
Puntos de Verificación del W3C para mostrar el resultado del análisis.
URL: http://www.w3.org/TR/WAI-WEBCONTENT/full-checklist.html
HERA
HERA (Hojas de Estilos para Revisión de la Accesibilidad) es una herramienta online
gratuita diseñada para facilitar a los desarrolladores la tarea de la revisión manual de
27
accesibilidad de las páginas Web según las pautas del W3C. HERA aplica sobre la
página original diferentes hojas de estilos para identificar visualmente los elementos
de la página que presentan problemas de accesibilidad y que necesitan ser
revisados. Está desarrollado por la Fundación SIDAR (Seminario Iberoamericano
sobre Discapacidad y Accesibilidad a la Red).
HERA-XP es una versión simplificada de HERA, y está pensada para hacer
revisiones puntuales, por ejemplo durante el proceso de creación de un sitio. Las
dos ofrecen prácticas instrucciones sobre lo que el revisor debe tener en cuenta a la
hora de evaluar la aplicación de cada uno de los puntos de control, y le ofrecen
información sobre por qué es necesario cada punto y a qué tipo de usuarios afecta.
Además, las dos utilidades están siendo traducidas a varios idiomas, comenzando
por el inglés y el portugués.URL: http://www.sidar.org/ex_hera/hera-xp
The Wave
Servicio online de evaluación de accesibilidad promovido por WebAIM. Se basa
tanto en las WCAG 1.0 como en la Sección 508. Pretende ayudar a los
desarrolladores a realizar aquellas tareas que exigen una toma de decisiones de tipo
personal, mostrando información sobre los elementos de la página (textos
alternativos, información estructural, orden de lectura, etc.).
URL: http://www.webaim.org/
Herramientas online de validación de gramática
Validador HTML del W3C
El validador HTML del W3C es un servicio online gratuito de validación de código
HTML basado en un parseador SGML. Comprueba la conformidad de los
documentos HTML respecto a las gramáticas del W3C y otros estándares HTML
(XHTML, XML, MathML).
URL: http://validator.w3.org/
28
Validador HTML de WDG
El validador de WDG (Web Design Group) usa el mismo motor que el validador
HTML del W3C pero produce unos mensajes más sencillos y fáciles de entender y
soporta un mayor abanico de codificaciones de caracteres.
URL: http://www.htmlhelp.com/tools/validator/
Validador CSS del W3 C
Herramienta gratuita para validar las hojas de estilo CSS solas o presentes en
documentos (X)HTML para comprobar si cumplen las especificaciones del W3C.
Existe una versión online y la versión descargable esta programada en Java y por
tanto es multiplataforma.
URL: http://jigsaw.w3.org/css-validator/
Tidy
El Tidy (disponible también en Sourceforge) es un validador, corrector y limpiador
de código HTML que puede convertir los documentos HTML en XHTML. La versión
ejecutable funciona en línea de comandos, pero si se desea se puede usar con el
interfaz gráfico TidyGui o una versión online gratuita.
URL: http://tidy.sourceforge.net/
29