H

e tenido la ocasión de asistir a las jornadas sobre accesibilidad web que Rosalia Murciano a impartido esta semana en el CIBERNARIUM de Barcelona.

Han sido unas jornadas muy interesantes y recomendables para todo aquel que se dedique al desarrollo web, pero también para bloggers que gestionen su propio blog.

En este blog me centraré a hablar de las bondades de la accesibilidad web y su repercusión en los usuarios internautas. También hablaré de :

Validadores de Accesibilidad Web

Herramientas de mejora de la accesibilidad

Temas y plugins de WORDPRESS que contribuyen a una mejor accesibilidad .

 

¿Por qué un cubo Rubik para hablar de accesibilidad?

Bien, he pensado que era un muy buen ejemplo que encarna la problematica de las barreras de acceso. Un juego al que todos hemos jugado alguna vez, o al menos todos conocemos, en el que la identificación de los colores y su agrupamiento por caras es el objetivo final.

Pero, ¿cómo lo resolverías si tuvieras un problema que te impidiese diferenciar algunos colores? Tu cubo Rubik podría convertirse en esto:

Visualización Cubo Rubik con insensibilidad al color color azul
Visualización Cubo Rubik por un usuario con insensibilidad al color azul
Visualización Cubo Rubik con insensibilidad al color rojo
Visualización Cubo Rubik con insensibilidad al color rojo

Ayy amigo! y ahora qué? por dónde empezamos?

Pero esto no es todo, y si padeciéramos ceguera total o tuviéramos cualquier otro tipo de disminución visual, motriz o cognitiva? Puede que desistieramos hasta de intentarlo.

Pues bien, por suerte para todos (ya que cualquier día podemos vernos con alguna de nuestras capacidades reducidas) hay quien piensa en estos problemas y desarrollan soluciones que permiten acceder a usuarios con necesidades especificas a utilidades de todo tipo, permitiendo normalizar la vida diaria de las personas afectadas.
Volviendo a nuestro sencillo ejemplo, el cubo Rubik se ha numerado o se ha adaptado al lenguaje Braille para hacer accesible a usuarios con problemas de vista de mayor o menor grado:

Se han sustituido los colores por números
Cubo Rubik adaptado a usuarios con problemas de percepción de colores
Se han sustituido los colores por código braille
Cubo Rubik adaptado a usuarios con problemas de ceguera

¿Qué podemos hacer para ayudar a mejorar la experiencia de los usuarios internautas?

Quién no ha tenido inmovilizado temporalmente el brazo hábil y se ha encontrado con la dificultad de manejar un ratón con la mano no habitual. Todos, en uno u otro momento, podemos encontrarnos entre el colectivo con dificultades de acceso a las nuevas tecnologías.

Tenemos muy asumido que las barreras arquitectónicas son una gran dificultad para las personas con movilidad reducida o limitaciones visuales. De estas dificultades, que algunas personas tienen a diario, todos somos testigos. Vemos los problemas que tiene, por ejemplo, un transeúnte ciego o una persona mayor para cruzar una calle, y les prestamos ayuda. Intentamos echarles una manita, porque vemos y sabemos de sus dificultades.
Ahora bien, el cómo una persona ciega navega por internet o disfruta de la televisión no es algo que tengamos tan presente porque simplemente lo hacen desde la intimidad de sus hogares. Y digo una persona invidente como podría hablar de alguien con dismunución de las capacidades motrices o cognitivas. A priori, las dificultades parecen obvias.
La buena noticia es que cuando creamos nuestras webs, sean del tipo que sean, podemos y debemos facilitar la navegación por internet a cualquier persona , desde cualquier dispositivo (movil, tablet, portátil…). Aquí entra en juego la importancia de los diseños responsive, que aseguran que una web se adapte a cualquier interface y sea funcional en todas ellas.

La accesibilidad y el posicionamiento (otro buen motivo)

Buscadores como GOOGLE toman muy en cuenta en sus algoritmos de búsqueda la accesibilidad de los sitos web y en igualdad de condiciones posicionaría primero a una web adaptativa y accesible que a una que no lo es. Es, por tanto fundamental para conseguir un buen posicionamiento SEO tener muy presente la accesibilidad al diseñar una web.
Pero la accesibilidad, va mucho más lejos que el hacer una web adaptativa. Existen algunas pautas de desarrollo web de muy fácil aplicación para contribuir a la mejora de la experiencia de internet de usuarios con necesidades específicas (p.ej: la adecuada utilización del atributo Alt describiendo la funcionalidad de una imagen que enlaza con cierta sección, hará que los usuarios invidentes accedan hasta el contenido de dicha sección sin dificultad).

Normativa básica de accesibilidad web: Normas WAI

Al margen de la legislación al respecto (Ley 51/2003 LIONDAU y Ley 34/2002 LSSICE), existen las normas WAI que marcan unos mínimos requisitos que se deberían tener en cuenta a la hora de elaborar el código de las páginas web. Estas normas establecen unos requerimientos y en función de su cumplimiento asignan a las webs un nivel de accesibilidad que puede ser A, AA, o AAA.

¿Cómo saber cuál es el nivel de accesibilidad de una web?

Existen algunas herramientas on-line que validan el código de las webs a partir de una URL, o bien a partir de introducir el código mismo. Les asignan un nivel de accesibilidad únicamente a partir de su código fuente, y te informan sobre los errores a solventar y las mejoras a realizar.

Herramientas que puedes utilizar:
TAW, te permite conocer cuantas ‘As’ verifica una web determinada y te relaciona los aspectos a corregir y/o mejorar.
eXaminator, puntua de uno a 10 la accesibilidad web e informa de los aspectos a corregir y/o mejorar.
HERA, informa de los aspectos a corregir y/o mejorar.

Pero el validador de accesibilidad por excelencia reconocido es el de la propia W3C. Tenemos el validador para :
código HTML 
código CSS

Pero, como debéis estar pensando ya, el código no lo es todo…

Simular una realidad diferente

¿Cómo crees que podría interpretar una persona con  percepción reducida de colores la siguiente pestaña informativa de unos de los plugins más utilizados de WordPress?

Ejemplo de mala accesibilidad web

Como vemos en el ejemplo anterior, debemos tener cuidado con las convenciones de color que utilizamos en nuestra web, ya que pueden dificultar la correcta interpretación de contenidos.

Existen herramientas on-line que nos permiten simular cómo se visualizaría una web o una imagen con diferentes deficiencias visuales y ayudarnos a optimizar la accesibilidad de nuestro sitio:

Color-blindness-simulator , simula la visualización de imágenes por usuarios con diferentes tipos de problemas visuales
Colorblind Web Page Filter , simula la visualización de una página web por usuarios con diferentes tipos de problemas visuales

También tenemos extensiones para el navegador que realizan la misma función. Particularmente me gusta:

Colorblinding para Chrome

Existen muchos más obstaculos a la accesibilidad web que deberiamos tener presentes y que podemos minimizar con ingenio y con ayuda también de las Normas WAI.

Pero los problemas derivados de barreras de este tipo no los alcanzaría a detectar un validador de código.Es por esto que la experiencia del usuario es tan importante y se realizan pruebas de usuario para verificar la correcta accesibilidad a todo el sitio web.

Es evidente la repercusión que un buen diseño puede tener para ciertos usuarios. Poco a poco se les va teniendo en cuenta, cada vez hay más páginas accesibles, pero todavia se trata de una pequeña parte.

Afortunadamente parece que una nueva conciencia y responsabilidad social digital se está gestando en las redes…

 

Pero, ¿Es WORDPRESS accesible?

Digamos que aunque la plataforma de gestión de contenidos es bastante accesible, no lo son en general los temas con los que trabajamos, ni tampoco los plugins que habitualmente utilizamos (me remito al ejemplo anterior de SEO by Yoast).

WordPress, por su parte, se está poniendo las pilas en este aspecto y tiene ya certificada la accesibilidad de algunos temas. Ha creado hace ya algunos meses un equipo especializado en auditar la accesibilidad de los temas, etiquetando aquellos que superan las pruebas como: accessibility-ready. Así que ya sabes cómo encontrar temas accesibles de WordPress.

Por otro lado, viendo la importancia que el tema de la accesibilidad tiene para los usuarios también los desarrolladores de plugins se han puesto manos a la obra intentando contribuir a mejorar la accesibilidad web de nuestros sitios.

Algunos plugins que pueden interesarte son:

WP Accesibility: Contribuye positivamente al cumplimiento de las Normas WAI.
BotDetect Captcha: Control de usuarios accesible para usuarios con deficiencias visuales, problemas motrices y/o cognitivos.
Accessibility widget :Widget para aumentar el tamaño de los contenidos de la web
Zoom widget : Widget para hacer zoom
Accessibility Access Keys  :Termite asignar a las teclas funciones de acceso directo a contenidos.
Dropdown Menus : Te permite navegar por los menus de una pagina simplemente con el teclado
Accessible tag cloud: versión accesible del widget ‘ nube de etiquetas’ (sin actualizar)
-Accessible_blank y Accessible external links: Plugins similares que abren los enlaces en otra pestaña cumpliendo los estándares de accesibilidad.
GSpeech plugin : Este plugin convierte a audio cualquier texto seleccionado en tu web.

ACTUALIZACIÓN (26/03/2015)

 

Gracias a un amigo twittero he decidido completar este post con un listado de  plugins accesibles para WordPress con diferentes funcionalidades (seguir enlace).

Y ya termino…

Después de todo lo dicho confieso que debo ponerme las pilas con este tema y, aunque la puntuación que me da el validador eXaminator no está mal del todo, me gustaría poco a poco ir mejorando la accesibilidad de mi web. De momento he aumentado el tamaño de la letra y el interlineado y he eliminado el font-weight: lighter (que quedaba muy bonito pero poco visible) para mejorar la lectura. Por algo se empieza, no?

Bueno, si has llegado hasta aquí puede que estos cambios hayan contribuido a ello, pero espero que sobretodo haya contribuido el contenido del post. Si crees que realmente es importante tener la accesibilidad web presente en la creación de nuestras webs o blogs puedes contribuir a que así sea compartiendo este contenido.

Gracias por leerme y acompañarme en el camino!! Hasta pronto amig@!

Post recomendados
Showing 3 comments
  • Luis
    Responder

    Buenos consejos y mejores reflexiones. Enhorabuena Elena por pensar e incluir. Un saludo desde el Marketing que piensa en todos. (El que escribe navega con un lector de pantalla y doy fe de que este post es totalmente accesible para mí 😉 )

  • Elena Lasierra
    Responder

    Hola Luis, disculpa la tardanza en contestar…
    Me alegra conocer tu experiencia al leer el artículo, es de gran valor para mí. Es cierto que muchas veces no tenemos presente las circunstancias particulares de algunos lectores y debemos esforzarnos para que eso no suceda.
    Un saludo

  • Jesus
    Responder

    Buenos días, estamos en la búsqueda de algún plugin que permita mostrar a modo de una ventana de video los contenidos de la página en la que esté el usuario, y en este video se muestre a una persona utilizando el lenguaje de señas. (como el que se usa en la tv.)

Deja un comentario