4. Beneficios de la accesibilidad web

Accesibilidad web. Una experiencia práctica
Josep Rojas, Hèctor Batalla
{jrojas, hbatalla}@caixaterrassa.es
Departamento de Banca Electrónica, Caixa Terrassa
RESUMEN: Caixa Terrassa, en conjunto
con su Obra Social ha realizado un proyecto para
la adaptación de sus portales siguiendo los
criterios de accesibilidad.
La accesibilidad facilita la utilización del
web al mayor número de usuarios posibles. Para
ello se han tenido que adaptar los aplicativos y
las metodologías internas de la generación de
contenidos para cumplir las pautas de
accesibilidad (WCAG 1.01) recomendadas por el
W3C2 (World Wide Web Consortium).
La puesta en marcha de las distintas webs
implicadas en el proyecto ha supuesto nuevas
oportunidades para Caixa Terrassa y sus
Fundaciones.
1. Introducción
Sólo 12 de las 35 empresas del IBEX-35
consiguen que sus páginas web sean accesibles y
estén optimizadas.
De éstas sólo 6 consiguen superar más del
50% de los criterios AA3.
Caixa Terrassa y su Obra Social han desarrollado
un proyecto de accesibilidad con la finalidad de
hacer sus páginas webs accesibles a todos. El
nivel de accesibilidad obtenido es AA, ampliado
con algunos puntos y recomendaciones
pertenecientes al nivel AAA para mejorar la
accesibilidad final.
2. Accesilidad web. ¿Qué es?
La accesibilidad web es facilitar la
utilización de la web al mayor número de
usuarios posibles, independientemente de las
limitaciones que estos tengan (tipo de hardware,
software, capacidades de los usuarios o de su
entorno).
Se obtiene como resultado de la aplicación
de un conjunto de tecnologías y normas de
implementación y diseño específicas.
Con esta finalidad nace la Iniciativa de
Accesibilidad Web (WAI – Web Accessibility
Initiative), la cual se trata de un grupo de trabajo
liderado por el W3C.
Del trabajo de este grupo se crearon las
Pautas de Accesibilidad para el Contenido Web
1
http://www.w3.org/TR/WCAG10/
http://www.w3c.es
3
Fuente: Adesis Netlife Octubre 2006
2
1.0 (WCAG 1.0), unas normas para la aplicación
de la accesibilidad web.
Estas normas tratan de 14 pautas divididas
en varios puntos de verificación cada una. Estos
puntos de verificación se pueden agrupar en
prioridad 1 (las de mayor importancia),
prioridad 2 (que permiten eliminar barreras de
acceso) y prioridad 3 (que confieren el nivel
más alto de accesibilidad).
Dependiendo del cumplimiento de los
distintos puntos de verificación, podemos
clasificar el grado de adecuación de una web en:
 Nivel A: Si se cumplen todos los
puntos de verificación de prioridad 1.
 Nivel AA: Si se cumplen los puntos
de verificación de nivel 1 y 2.
 Nivel AAA: Si se cumplen todos los
puntos de verificación.
Estas 14 pautas se han convertido en
normas de facto aceptadas universalmente.
3. Accesibilidad web. ¿Por qué?
Que una web sea accesible es un
requerimiento legal para la Administración pero
que las cajas de ahorros, por su vertiente social,
están haciendo suyo.
Tanto la normativa europea como la
legislación española requieren la adaptación de
los portales de la Administración en un nivel
AA.
4. Beneficios de la accesibilidad web
Una web accesible es, en general, más
rápida, más clara y está mejor estructurada.
La accesibilidad está muy unida a criterios
de usabilidad con lo que una web que sea
accesible también será más sencilla de utilizar
por distintos tipos de usuarios.
Otros beneficios de la accesibilidad son:
 Mejora el rendimiento de los
navegadores. Al reducir el tamaño de
las páginas se descargan con más
velocidad.
 El uso de estándares web proporciona
una mayor compatibilidad entre
distintas versiones, plataformas y con
navegadores antiguos.
 Mejora el posicionamiento en
buscadores.
 Mejora
de
la
navegación
independiente del dispositivo.
 Mejora la estructura de la página y su
organización.
 Ofrece compatibilidad con lectores de
pantalla (usados por usuarios con
problemas visuales). Los contenidos
son leídos de forma coherente.
 La simplificación de los textos facilita
la comprensión a personas con
dificultades cognitivas.
 Permite la navegación sin imágenes lo
que favorece a las conexiones lentas o
a los navegadores antiguos o de modo
texto.
 Permite variar el tamaño de la letra.
5. ¿A quién beneficia la accesibilidad web?
Entre las personas beneficiadas por la
accesibilidad web, tenemos:
Personas con discapacidad. Los usuarios
con disminuciones físicas, síquicas o sensoriales.
Por ejemplo, personas con dificultades con el uso
del ratón, personas sordas o ciegas las cuales
pueden necesitar de ayudas técnicas para el uso
de las nuevas tecnologías (lectores de pantalla,
trackballs, etc.)
Usuarios con dificultades cognitivas y del
lenguaje que puedan tener dificultades para
entender símbolos o textos complejos.
Personas mayores con desconocimiento
tecnológico, vista cansada, movilidad reducida,
etc.
Usuarios con dificultades derivadas del
entorno. Por ejemplo en situaciones de mala
iluminación, pantallas con poco contraste,
ambientes ruidosos, etc.
Usuarios afectados por circunstancias
técnicas. Estos usuarios se ven afectados por
velocidades de conexión lentas o equipos
anticuados.
6. Rompamos una idea preconcebida. La
accesibilidad web no es sólo para
discapacitados.
Como hemos visto, la accesibilidad
beneficia a un amplio abanico de tipos de
usuarios, independientemente de si se tiene una
discapacidad o no.
Una web accesible está mejor estructurada,
es más clara y rápida. También facilita la
multidispositividad.
7. Claves de éxito para el proyecto
El proyecto de accesibilidad del web de
Caixa Terrassa no hubiese podido realizarse con
éxito sin tener unas buenas bases sobre las que
trabajar.
Un punto a destacar es la implementación
un año antes de un gestor de contenidos propio.
Este hecho provocó una profunda reorganización
en la manera de añadir y modificar contenidos en
el web. Se pasó de editar los contenidos
manualmente y de forma centralizada en el
departamento de Banca
Electrónica a
descentralizarse para que cada departamento
pudiese editar y validar sus propios contenidos.
Esta diversificación en el tipo de usuario que
editaba/validaba contenidos web conllevó un
período de formación y adaptación previo. En el
momento de iniciarse el proyecto de
accesibilidad, nuestros editores ya eran usuarios
expertos en la utilización de las herramientas que
les proporcionaba el gestor para la modificación
de contenidos.
El hecho que el gestor fuese una aplicación
a medida para nuestra entidad facilitó
posteriormente la reprogramación y la
adaptación de los distintos elementos para que
generase contenidos accesibles. Se tenía el
código fuente y los conocimientos sobre su
estructura interna.
Nuestros conocimientos sobre accesibilidad
eran limitados tanto a nivel técnico como teórico.
Para poder afrontar con éxito el proyecto
contamos con los servicios de la Fundación
CTIC4, la cuál formó a las personas involucradas
en el proyecto (programadores propios y
externos, coordinadores, etc.) y nos asesoró tanto
en los cambios a realizar en nuestros aplicativos
cómo en la realización de las plantillas para que
cumpliesen el nivel de accesibilidad escogido.
8. La accesibilidad y su implantación
La implantación del proyecto se ha
realizado a lo largo de 5 meses en los que se han
convertido en accesibles 3 portales (Caixa
Terrassa5, Fupar6 y Llar7) sumando un total de
5500 paginas de contenido.
En el caso de Caixa Terrassa y Llar, se ha
aprovechado el proyecto para rediseñar las webs
haciéndolas mas usables, con un diseño mas
moderno y mejorando los sistemas de
navegación. Cabe destacar que un cambio de
diseño es el mejor momento para la realización
de un proyecto de accesibilidad ya que nos
permite diseñar teniendo en cuenta todos los
parámetros necesarios sin tener que adaptar
4
http://www.fundacionctic.org/
http://www.caixaterrassa.es
6
http://www.fupar.es
7
http://www.llarct.es
5
diseños que ya de por si pueden ser poco
accesibles.
Diseño anterior
Nuevo diseño accesible
Para cumplir la fecha de finalización del
proyecto, se ha trabajado en paralelo en las
siguientes tareas:
 Generación de plantillas
 Adaptación del gestor de contenidos
 Revisión y creación de contenidos
8.1. Generación de plantillas
Una vez aprobado el diseño definitivo y el
look and feel de todo el web (colores, tipos de
letra, formato de los distintos niveles de títulos,
botones, enlaces,..), se programan las plantillas
teniendo en cuenta la separación entre diseño
(hojas de estilo) y contenido (html) y por tanto
no se usan tablas para maquetar.
Las plantillas diseñadas corresponden a los
distintos tipos de páginas que se tiene en el web:
 Página principal
 Pagina intermedia
 Pagina de contenido final
 Formulario
 Mapa web
Una vez maquetadas se validan por el
proveedor de accesibilidad y se retocan para
llegar al nivel exigido.
Estas plantillas son las que posteriormente
genera el gestor de forma automática.
8.2. Adaptación del gestor de contenidos
Después de analizar nuestro gestor de
contenidos, se encontraron un conjunto de
limitaciones que se debían solucionar para la
consecución del proyecto.
Los principales problemas se manifestaban
en el editor para la introducción de los
contenidos. Los estilos estaban embebidos, y no
existía separación entre contenido y diseño, se
usaban algunas etiquetas de forma incorrecta,
etc.
Se ha cambiado por completo el editor
pasándose a usar FCKeditor8 el cual se ha
modificado para hacerlo compatible con las
especificaciones necesarias.
Además del cambio de editor también se
han añadido un conjunto de módulos para
facilitar algunas tareas como la creación y
edición de tablas accesibles y la gestión de texto
alternativo para las imágenes. Este último
módulo obliga a añadir texto alternativo y
descripción a todas las imágenes que se añaden
al sistema, cuando una nueva imagen se asigna a
un contenido permite modificar el texto
alternativo por defecto para adecuarla al contexto
particular.
8.3. Revisión de contenidos
En los contenidos generados también se
encontraban otros problemas importantes y que
se debieron corregir.
Entre las tareas realizadas, para todas las
páginas, de revisión y corrección se encuentran:
 Asignación del idioma del contenido y
los cambios de idioma (por ejemplo,
conceptos técnicos en inglés)
 Marcaje de los acrónimos y
abreviaturas en la primera ocurrencia
dentro de un contenido.
8
http://www.fckeditor.net
 Supresión automática de estilos
embebidos y asignación de nuevos
estilos basados en hojas de estilo.
 Revisión de todos los enlaces no
descriptivos (los típicos pulse aquí)
 Substitución
del
atributo
target=”_blank” para abrir nuevas
ventanas por código javascript que
degrada correctamente.
 Conversión de los archivos pdf en
accesibles.
 Revisión de todas las imágenes para
eliminar los contenidos textuales y
asignar texto alternativo adecuado al
contexto.
 Reordenación lógica de contenidos
para mejorar la navegación.
 Creación de nuevos contenidos
(paginas intermedias)
 Adaptación de los formularios a los
criterios de accesibilidad. Se ha dado
uniformidad a los mensajes de error y
se han hecho más descriptivos.
 Validación de todos los contenidos
para la generación de html y css que
cumpla los estándares web.
Durante este proceso se aprovechó para
revisar los textos, simplificar el lenguaje y
limitar el contenido por página.
9. ¿Cómo mantener la accesibilidad?
Una vez la web está publicada, los
contenidos se empiezan a actualizar con
normalidad por parte del equipo de editores. Esto
puede provocar que no se sigan los criterios de
accesibilidad en la creación o modificación de
contenidos lo que puede significar una
degradación crítica de la accesibilidad total del
web con el paso del tiempo.
Para evitar este hecho se han tomado un
conjunto de medidas.
Se ha formado a los editores en temas de
accesibilidad y se les ha proporcionado una
herramienta de edición en el gestor limitada en
opciones. Al acceder al gestor con perfil de
editor no se les permite la edición directa del
código html y sólo se les permite la aplicación de
estilos css que cumplan con el libro de estilo y el
diseño general del web.
Las tablas son creadas a partir de un
asistente para la creación de tablas.
Estas medidas ayudan a que las páginas
lleguen a la fase de publicación con un ratio muy
alto de corrección, aún así, para evitar la
publicación de contenidos no válidos se realiza,
de forma centralizada un checklist de
comprobación de parámetros de accesibilidad.
En este checklist se comprueban distintos
puntos como la validez del código (a través del
validador del W3C9), si las imágenes tienen un
texto alternativo coherente con el contexto, la
correcta inclusión de los acrónimos, si los
enlaces son suficientemente descriptivos, la
correcta aplicación de los estilos, entre otros.
Para terminar, se valida el contenido con el
Test de Accesibilidad Web (TAW)10 el cual
realiza una serie de comprobaciones automáticas
para verificar el nivel de accesibilidad alcanzado.
Se debe destacar que la sola superación del test
no significa que nuestro contenido sea accesible
y es por ello que se deben realizar
comprobaciones manuales sobre los distintos
aspectos antes mencionados.
Si todos los puntos de comprobación son
correctos la página se publica.
10. Oportunidades de surgieron a partir del
proyecto.
El proyecto se inició con un carácter
básicamente comercial provocado por la
necesidad de un cambio de diseño para
actualizarlo y mejorar su usabilidad.
El
proyecto
ha
generado
nuevas
oportunidades para la entidad entre las que
destaca el reconocimiento al ganar la segunda
edición de los premios TAW11 al mejor web
empresarial en categoría gran empresa.
El premio, junto a la presentación pública
del proyecto ha dado visibilidad a la entidad en
muchos medios al tratarse de un proyecto global
de su web corporativa y las webs de su Obra
Social.
En otro orden de cosas, tener la web
accesible ha permitido aumentar de forma
significativa el número de páginas indexadas en
Google y la mejora general del posicionamiento
de nuestro web en las búsquedas relacionadas
con términos financieros. Se ha pasado de tener
menos de 500 páginas indexadas a casi 4000.
Esta mejora también es aplicable a otros
buscadores como Yahoo (3030 páginas
indexadas) o Msn con 4217.
El tiempo de carga de las páginas (una vez
las css han sido cacheadas por el navegador) ha
mejorado considerablemente haciendo la
navegación por módem mucho mas rápida.
La aplicación de los criterios de
accesibilidad también nos ha permitido disponer
9
http://validator.w3.org/
http://www.tawdis.net/
10
11
http://www.tawdis.net/taw3/cms/es/noticias/20061212.html
de una versión para dispositivos móviles. Sólo
proporcionando una hoja de estilo para este tipo
de dispositivos, el contenido se adapta
correctamente a pantallas más pequeñas.
Haciendo uso de otra hoja de estilo para
impresión, se ha mejorado la versión para papel
eliminando elementos (por ejemplo los menús de
navegación o ciertas imágenes decorativas) o
añadiendo
otros
(un
pie
de
página
personalizado).
El proyecto nos ha permitido ser un
referente en accesibilidad web en el mundo
financiero, mejorando de forma considerable la
usabilidad, velocidad, la estructura de nuestra
web y haciéndola accesible para todos los
usuarios.
RESEÑA CURRICULAR:
Hèctor Batalla es Ingeniero técnico en
informática de gestión por la Universidad de
Lleida.
Actualmente es webmaster de Caixa
Terrassa y coordinador del proyecto de
accesibilidad web.
Josep Rojas es licenciado en Ciencias
Económicas y Derecho y MBA por ESADE.
En la actualidad es jefe del departamento de
Banca Electrónica de Caixa Terrassa.