HTML 5 y accesibilidad

Última actualización: 13 de marzo de 2012

La especificación de HTML 5 pretende ser una especificación pensada para incluir dinamismo y a la vez accesibilidad desde su concepción. Por tanto, la ventaja principal que tendrá es que los desarrolladores que la utilicen podrán generar efectos de presentación muy atractivos sin limitar la interacción por parte de usuarios de ayudas técnicas. Pero en estos momentos es todavía un borrador, su implementación en los diversos navegadores no es completa aún y por tanto, aunque desde muchos sectores se alienta su uso, yo no lo haría tan alegremente.

Existe un sitio dedicado a informar sobre la implementación de HTML en los navegadores y sus consecuencias para la accesibilidad, así como posibles soluciones: http://html5accessibility.com/ Recomiendo vivamente estar al tanto de las actualizaciones y, sobre todo de las advertencias contenidas en ese sitio.

Entrevista a Emmanuelle Gutiérrez y Restrepo

Un recurso imprescindible, como recomienda Emmanuelle, es la web "HTML 5 Accesibility" donde se propociona información actualizada sobre el soporte en los diferentes navegadores (la última versión es de este mes, donde se sitúan a la cabeza Chrome y Firefox y a la cola Opera y Safari):

This site is a resource to provide information about which new HTML5 user interface features are accessibility supported in browsers, making them usable by people who rely upon assistive technology (AT) to use the web [...]

It is not intended to dissuade developers from using new HTML5 features. Sometimes there are better choices, sometimes developers have to add a little extra to make the feature useful or usable, and other times features have simply not been implemented by any browser or only by browsers that do not yet support assistive technologies. As a consequence it may not yet be practical to use a particular HTML5 feature.

Actualmente el grupo de trabajo WCAG WG está trabajando en las Técnicas HTML5 para las WCAG 2.0, tal y como existen ahora para HTML, PDF, Flash, etc. (Techniques for WCAG 2.0). Es una gran noticia, aunque de momento están en un estado muy inicial.

Otro documento de interés del W3C es HTML5: Techniques for providing useful text alternatives, sobre el correcto uso de las alternativas textuales para que estas sean efectivamente accesibles en cualquier contexto de uso.

Elemento video y accesibilidad

Uno de los objetivos más habituales para el uso actual de HTML 5 es la inclusión de contenido multimedia, especialmente la inclusión de vídeos con el elemento video. Un recurso muy interesante es: "Accesibilidad a los contenidos audiovisuales en la Web a través de HTML5" (PDF, 2MB), trabajo fin de carrera de Alberto Sánchez-Heredero Pérez y tutorizado por Lourdes Moreno López (autora de "Accesibilidad a los contenidos audiovisuales en la web").

Otros artículos interesantes sobre la accesibilidad y el uso del elemento video de HTML5 son:

• "An In Depth Analysis of HTML5 Multimedia and Accessibility" de Ian Devlin
• "The State of HTML5 Video" de Jeroen Wijering

Combinar los nuevos marcadores semánticos con ARIA Roles

Sobre el soporte de HTML 5 por los lectores de pantalla son muy interesantes los artículos que tratan sobre cómo combinar los nuevos marcadores semánticos de HTML 5 (header, nav, section) con ARIA Roles (que usan actualmente páginas como Google o Yahoo. Más información en "AJAX accesible: WAI-ARIA", ) para que sean más accesibles para los lectores de pantalla.

"How screen readers speak a page with HTML5 and ARIA" de Lucica Ibanescu, incluye dos vídeos en los que se muestra como lee una página HTML 5 NVDA, JAWS y Windows Eyes con y sin roles.

Por otra parte, el artículo "HTML5 Accessibility Chops: ARIA landmark support", de Paciello Group Blog (que suele publicar buenos artículos sobre HTML 5 y accesibilidad) trata también este tema, incluyendo un listado detallado del soporte de ARIA Roles con diferentes lectores de pantalla (JAWS, NVDA, VoiceOver, Chrome, Windows Eyes).

Vídeos ilustraticos del soporte de ARIA Roles con diferentes lectores de pantalla son (todos en YouTube):

• NVDA 2011 Firefox 6 with ARIA ROLES Navigation
• JAWS 13 in IE9 with HTML5 and ARIA Landmark Roles
• VoiceOver in Safari 5.1 with HTML5 and ARIA Landmark Roles
• Window-Eyes 7.5.0 in IE9 with HTML5 and ARIA Landmark Roles

Puedes consultar todos los vídeos recomendados en mi lista de reproducción de Youtube "HTML 5 y accesibilidad".

Otro artículo muy interesante sobre el tema es: ARIA and Progressive Enhancement

Accesibilidad HTML 5 y RIA (Rich Internet Applications)

La siguiente PPT es todo un tesoro: "Accesibility of HTML5 y Rich Internet Applications" de Hans Hillen y Steve Faulker, presentada en CSUN 2012. En ella se explican los problemas habituales de accesibilidad en aplicaciones RIA y sus soluciones.

La primera parte y los ejemplos se pueden encontrar en "Accessibility of HTML5 and Rich Internet Applications - CSUN 2012 Workshop Material"

Otros artículos de interés sobre HTML 5 y accesibilidad

• WebAIM elaboró en 2010 una serie de artículos denominados "Future Web Accesibility" donde comenta nuevas características que incorpora HTML 5 y que mejorarán la accesibilidad de los sitios web. Se puede consultar el enlace a estos artículos y una breve descripción de los mismos en el artículo de Sergio Luján "El futuro de la accesibilidad web con HTML5"
• "Accessibility and HTML5 Block Links", de Derek Featherstone analiza los problemas de accesibilidad de utilizar bloques de contenido dentro de un enlace, algo aceptable en HTML 5.
• "Accessible HTML5 Forms – Required Inputs", de Johnny Otis and Etta James, analiza los problemas de accesibilidad para el uso del nuevo atributo required de HTML 5 y lo compara con el uso de aria-required="true" de WAI-ARIA (más información sobre WAI-ARIA en "AJAX accesible: WAI-ARIA")
• WAI ARIA support on iOS, septiembre de 2012, con el soporte para iPhone 4 e iPad 1

Iré actualizando este artículo con otros recursos de interés que vaya encontrando.

Artículos relacionados:

• HTML 5
• Cheat Sheet HTML 4.01, HTML 5, XHTML Elements

Actitudes y aptitudes de un arquitecto de información

A raíz del artículo Arquitectura de información. Fundamentos me preguntaron cuáles eran los conocimientos o estudios que cualificaban a un arquitecto de información.

Sin embargo creo que lo que cualifica a un arquitecto de información no se limita a unos conocimientos teóricos y metodológicos, aunque evidentemente son importantes, sino que tiene mucho ver con una serie de actitudes y aptitudes.

En este artículo hago una reflexión personal sobre cuáles son esas actitudes y aptitudes que aprecio en las personas con las que he ido trabajando a lo largo de los años, y que son extensibles en realidad a cualquier profesional.

Experiencia

Es innegable que el número y complejidad de los proyectos en los que haya participado anteriormente le permitirán acometer con más garantías de éxito la arquitectura de información de un nuevo sitio.

Capacidad de autocrítica

Sin embargo, la experiencia, si no va acompañada de capacidad de autocrítica, tampoco asegura la calidad del resultado, pues posiblemente se cometerá en el siguiente portal los mismos errores que en los anteriores.

Ser conscientes de que no se sabe todo, ciertas dosis de humildad, aceptar y analizar las críticas que se reciben, aprender de los errores y de los demás, son actitudes importantes. Se agradece trabajar con personas con capacidad de autocrítica, que saben decir "esto no lo sé" o "estaba equivocado".

Por algo dicen que un experto es el que ha cometido todos los errores que podía cometer y ha sabido ver en cada fracaso aquello que debía aprender. Quizás es un poco exagerado, pero la verdad es que la teoría es una cosa y la práctica otra, y hay cosas que sólo se aprenden después de haberte equivocado.

Capacidad de autoaprendizaje

Si se agradece trabajar con gente que reconoce no saber algo, se agradece más todavía trabajar con gente que a los dos días ya se ha convertido en un experto de aquello que desconocía.

Todos hemos sido en gran medida autodidactas. Por eso me parece importante que seamos generosos con nuestros conocimientos y los compartamos, porque todos hemos aprendido de los demás.

A lo largo de los años he comprobado que los mejores profesionales no eran obligatoriamente los que mejor formación y más títulos tenían, sino los que más ansias de aprender demostraban, los que si les preguntabas algo que no sabían a la semana siguiente parecían un gurú del tema.

Y esa disposición creo que es directamente proporcional al entusiasmo que te despierta tu trabajo y que suele ser contagiosa. Para mí friki nunca ha sido un término peyorativo, soy bastante friki y me encanta trabajar con otros.

Actitud positiva y constructiva

Nuestro trabajo no es criticar. Comentarios del estilo “¿pero cómo os han hecho esto?”, “fíjate en eso, qué desastre” están fuera de lugar. Desconfío mucho de los que toman este tipo de actitudes.

Nuestro trabajo es detectar las fortalezas y debilidades de un portal para afrontar su mejora, de forma positiva y constructiva. Detectamos un problema, explicamos por qué es un problema y cómo lo vamos a solucionar, pero no nos cebamos con él.

Por otro lado, defendemos nuestro trabajo, explicamos y argumentamos el porqué de nuestras decisiones, pero no nos atrincheramos en ellas. Desconfío también de las actitudes intransigentes. Para ello hay que ser tolerante a la frustración. Si el cliente se empeña en algo, le explicamos los contras; si aún así lo sigue queriendo, le enseñamos alternativas; si sigue empeñado, buscamos la mejor manera de abordarlo, pues dentro de nuestras funciones está equilibrar lo que el cliente quiere y lo que los usuarios necesitan.

… y si no se despotrica de todo ello en Twitter mejor, no me parece muy profesional, supongo que a nuestros clientes aún menos.

Saber preguntar pero sobre todo saber escuchar

Durante la fase de análisis debemos recabar mucha información y es importante saber hacer las preguntas adecuadas para lograrlo, pero es mucho más importante saber escuchar y dejar de lado las ideas preconcebidas.

Toda la información que puedes lograr sobre el sector, la empresa, su funcionamiento o sus expectativas y frustraciones respecto a la web las conseguirás conversando y estableciendo un clima distendido y de confianza, y, como ya he dicho, siendo cercano, positivo y constructivo.

Para ello es importante saber escuchar, hacer una escucha activa, lo que te están diciendo, cómo te lo están diciendo y qué es lo que están intentando transmitir. Posiblemente tú sabes mucho de arquitectura de información, pero tu interlocutor sabe más que tú de su sector, de su empresa y de lo que quieren, algo en lo que necesitas hacerte un experto en un tiempo record: escucha.

Capacidad de trabajo en equipo

Si la arquitectura de información la realiza el arquitecto de información con el cliente, sin contar con nadie más, malo. Y más malo aún si no documenta su trabajo.

Es muy importante comunicarlo a todos los implicados (diseñadores gráficos, desarrolladores, autores de contenido, etc.), venderlo internamente, a tu equipo y al cliente, porque necesitamos que todos colaboren y confíen en el trabajo que vas a hacer y los beneficios que este reportará al proyecto.

No puedes trabajar al margen del resto del equipo. He visto proyectos en los que el arquitecto de información ha sido innacesible y su trabajo completamente opaco para el resto del equipo, dificultando y lastrando sobremanera la labor de los que intentábamos comprender, interpretar y desarrollar sus decisiones que además no estaban correctamente documentadas.

No sólo debemos investigar, analizar, diseñar, evaluar y preparar entregables, debemos estar en comunicación constante con el equipo e implicarlo en nuestro trabajo.

Para ello hay que ser cercano, saber transmitir y presentar tu trabajo y cómo se integra en el proyecto, así como documentarlo para los demás.

Detallista, pero no perfeccionista

En nuestro trabajo los detalles importan, e importan mucho. Sin embargo, no hay que confundir ser cuidadoso y detallista para lograr un trabajo bien hecho, con el perfeccionismo. Cuando te empeñas en buscar lo perfecto sueles perder la perspectiva de lo que es lo bueno y lo necesario.

Capacidad de análisis, síntesis, ordenación y estructuración

Especialmente crítica en proyectos de gran envergadura, como por ejemplo diseñar la arquitectura de información de un portal de miles de páginas y decenas de subportales como puede ser el de una universidad. Supone analizar, asimilar, comprender, sintetizar, organizar y estructurar cantidades ingentes de información.

Creo por tanto que son aptitudes, junto con la capacidad de concentración y autodisciplina, imprescindibles.

Para un proyecto de ese tipo me gustaría contar con alguien que pueda leer un libro en dos días y sintetizarlo y esquematizarlo en medio.

Habilidades lingüísticas

La habilidad para la expresión escrita no sólo es importante a la hora de redactar la presentación y documentación de nuestro trabajo.

Parte de nuestra labor consiste en organizar contenidos, agruparlos por tipo, categorizarlos, etiquetarlos, buscar literales adecuados, establecer relaciones semánticas, lidiar con la sinonimia, la polisemia y la ambigüedad en general del lenguaje, difícil de acometer sin competencias lingüísticas.

Igual a vosotros se os ocurren más cosas que añadir a esta carta a los Reyes Magos.

Herramienta de ayuda para validar de acuerdo a las WCAG 2.0

En el artículo anterior "Herramienta de ayuda para realizar una consultoría de accesibilidad web" compartía y explicaba una herramienta de ayuda para realizar una consultoría de accesibilidad web respecto a las WCAG 1.0 y la Norma UNE 139803.

Ahora comparto la versión de esa herramienta para realizar una consultoría de accesibilidad en base a las WCAG 2.0

El funcionamiento es el mismo, por tanto se puede consultar la descripción detallada en el artículo anterior.

La única novedad es que en cada criterio de éxito incluyo una descripción amigable de lo que hay que revisar en cada uno de ellos. Esta descripción está basada en la traducción de WebAIM`s WCAG 2.0 Checklist por parte de Jose Ramón Quevedo.

Otra herramienta complementaria que os recomiendo es la WCAG 2.0 Checklist de Roger Hudson, en la cual incluye por cada criterio de éxito las técnicas a aplicar (está en formato Word y no genera datos automáticos como la que yo comparto)

La descarga es gratuita.

Descarga de la herramienta de ayuda para realizar una consultoría de accesibilidad web de acuerdo a las WCAG 1.0/Norma UNE 139803. Archivo excel .XLSX de 85.6 KB

Descarga de la herramienta de ayuda para realizar una consultoría de accesibilidad web de acuerdo a las WCAG 2.0. Archivo excel .XLSX de 84 KB

Esta prohibido su uso comercial y su distribución sin permiso del autor.

Servicio relacionado: Consultoría de accesibilidad web

Artículos relacionados:

• Diferencias de prioridad entre los requisitos de la Norma UNE 139803:2004 y los puntos de control de las WCAG 1.0
• Correspondencia entre Norma UNE 139803/WCAG 1.0/WCAG 2.0
• Metodología para la evaluación de la accesibilidad Web: "Evaluating Web Sites for Accessibility" de la WAI
• Descarga de herramienta para evaluar con Sirius. Nuevo sistema para la evaluación de la usabilidad web