Buscador

domingo, 3 de abril de 2011

Ejercicios online tipo test sobre accesibilidad web

He preparado dos ejercicios online tipo test sobre accesibilidad web:
En el futuro añadire más ejercicios de este tipo.

IMPORTANTE:  no abrir los dos ejercicios a la vez, sólo uno cada vez (en los comentarios se explica la razón).

viernes, 1 de abril de 2011

Análisis de la accesibilidad de la página web del Ayuntamiento de San Vicente del Raspeig

He publicado el análisis de la accesibilidad de la página web del Ayuntamiento de San Vicente del Raspeig que ha realizado un alumno como trabajo de una asignatura. Por tanto, no es un análisis ni exhaustivo ni profesional.

El informe se puede descargar en formato PDF.

En el estudio, además de la accesibilidad también se han analizado algunos aspectos de la usabilidad de la página. La metodología empleada ha sido revisar los puntos de verificación especificados en el documento Técnicas para las Pautas de Accesibilidad al Contenido en la Web 1.0.

jueves, 31 de marzo de 2011

Análisis de la accesibilidad de la página web del Ayuntamiento de La Joyosa

He publicado el análisis de la accesibilidad de la página web del Ayuntamiento de La Joyosa que ha realizado un alumno como trabajo de una asignatura. Por tanto, no es un análisis ni exhaustivo ni profesional.

En este sitio web se puede encontrar algo que no había visto nunca: en la página educación  han colocado una página de texto escaneada como una imagen. Podrían haber hecho "copiar y pegar" del documento original, o podrían haber enlazado un fichero PDF, pero en vez de ello han colocado una imagen. ¡Increíble!

El informe se puede descargar en formato PDF.

martes, 29 de marzo de 2011

Un interfaz neuronal sigue funcionando después de 1000 días

A muchas personas el tema del control mental del ordenador o la unión hombre-máquina les puede parecer de ciencia ficción, sacado de las películas Robocop o Terminator, pero es un tema que se está investigando y desarrollando en la actualidad.

Estos avances técnicos pueden ayudar a muchas personas con discapacidad física a paliar sus problemas. Sobre el control del ordenador con la mente ya he escrito en numerosas ocasiones (Una noticia sobre investigación en control mental del ordenador en Tailandia).

Ahora acabo de leer la noticia BrainGate neural interface system reaches 1,000-day performance milestone. En la Brown University (Rhode Island, Estados Unidos), implantaron a una mujer con tetraplejia un sistema llamado BrainGate. 1000 días después, la mujer todavía puede controlar un cursor en el ordenador con el pensamiento (pensaba en mover el cursor con la mano), con un porcentaje de éxito superior al 90%.

Por ahora, las tareas que se pueden realizar son muy limitadas y no funciona a la perfección, pero la investigación sigue avanzando y es posible que en pocos años existan sistemas comerciales.

domingo, 27 de marzo de 2011

¿Por qué la gente no subtitula los vídeos?

En el periódico El País iniciaron hace dos semanas una iniciativa muy interesante: El desafío de la semana. El desafío consiste en resolver un problema matemático. El desafío se plantea mediante un vídeo en el que una persona plantea el problema.



En el vídeo de esta semana he podido leer lo siguiente:
NOTA IMPORTANTE: Por si queda alguna duda de la formulación del problema y a petición también de los lectores sordos, incluimos aquí el enunciado por escrito.
Y entonces me he preguntado: ¿por qué son tan chapuceros? ¿Por qué no subtitulan el vídeo? El vídeo dura poco más de 3 minutos, en menos de una hora puede estar subtitulado. Lo que han hecho está bien, proporcionar la transcripción del vídeo, pero les ha faltado subtitularlo.

viernes, 25 de marzo de 2011

Entrega de los premios de la primera edición de los Premios Discapnet

El pasado 10 de marzo de 2011 se entregaron los premios de la primera edición de los Premios Discapnet 2011. La noticia dice:
S.A.R. la Princesa de Asturias y el presidente de la ONCE y su Fundación, Miguel Carballeda, hicieron entrega, el 10 de marzo de 2011, de la primera edición de los Premios Discapnet a varias iniciativas en las que las nuevas tecnologías mejoran la vida cotidiana de personas con discapacidad, como la inclusión escolar de una niña con discapacidad severa con sólo ocho años en su colegio de Meaño (Pontevedra) o la iniciativa de Fundación Vodafone para que las personas con discapacidad accedan a la información de los medicamentos. También han recibido galardón “la Caixa”, Renfe Operadora-Adif y Repsol YPF-Fundación Repsol.

miércoles, 23 de marzo de 2011

Más sobre la ceguera al color

En numerosas ocasiones he escrito sobre los problemas de visión y en especial sobre la ceguera al color (daltonismo):

Acabo de encontrar dos páginas muy interesantes sobre este tema. En Colorblind Home Page, se explican los diferentes tipos de ceguera al color que existen y se muestran numerosas fotografías a modo de ejemplo.

En Structure & Strangeness: Reverse-Colorblind Test se muestra un test de daltonismo inverso: mientras que en un test normal, la persona con daltonismo no es capaz de vez una letra o número con el resto de personas sin daltonismo, en este test la persona con daltonismo es capaz de ver algo que el resto de personas no ven. Lo que una persona daltónica puede ver se muestra en otra página.

martes, 22 de marzo de 2011

Curso sobre accesibilidad web en la Universidad Nacional de La Plata

En la Facultad de Informática de la Universidad Nacional de La Plata organizan el Curso a distancia sobre Accesibilidad Web. El temario del curso es:


  • La Problemática del discapacitado en la Web
  • Herramientas de adaptación de hardware y software
  • La Accesibilidad Web. Leyes, normas y validadores
  • Pasos para hacer accesible un sitio
Más información sobre el curso en formato PDF.

domingo, 20 de marzo de 2011

Herramienta para ver una página web en escala de grises

GrayBit es una herramienta online que permite visualizar cualquier página web publicada en Internet en escala de grises. Para ello sólo hay que introducir la URL de la página web y a los pocos segundos aparece visualizada en escala de grises.

¿Y esto para qué? La idea es que al convertir los colores a su equivalente en escala de grises es más fácil detectar los problemas de contraste, ya que los colores pueden engañar.

sábado, 19 de marzo de 2011

Herramienta para verificar el contraste de todos los colores de una página web

El WAI nos indica en WCAG 1.0 que hay que tener cuidado con las combinaciones de colores, hay que emplear combinaciones con un contraste adecuado. En este blog he escrito varias veces hablando de herramientas que nos ayudan a elegir colores con el suficiente contraste.

Un alumno me ha pasado la herramienta Check My Colours. ¿Qué tiene de especial esta herramienta? Mientras que la mayoría de las herramientas comprueban únicamente una combinación de dos colores (tenemos que indicar el color de primer plano y el color de fondo), esta herramienta comprueba el contraste y la diferencia de color de todos los elementos DOM de una página web: simplemente, se introduce la URL de la página web que queremos comprobar y esta herramienta comprueba todas las combinaciones de color que tenga la página.

Importante: sólo comprueba las combinaciones definidas en el DOM. Una combinación de color producida por un texto mostrado sobre una imagen no es capaz de comprobarlo.

viernes, 18 de marzo de 2011

Análisis de la accesibilidad de la página web del Ayuntamiento de l'Alfàs del Pi

He publicado el análisis de la accesibilidad de la página web del Ayuntamiento de l'Alfàs del Pi que ha realizado un alumno como trabajo de una asignatura. Por tanto, no es un análisis ni exhaustivo ni profesional.

El informe se puede descargar en formato PDF.

La metodología empleada ha sido revisar los puntos de verificación especificados en el documento Técnicas para las Pautas de Accesibilidad al Contenido en la Web 1.0.

Los principales problemas detectados son:
  • No proporciona juego de caracteres.
  • Utiliza código HTML no estándar.
  • Ausencia de idioma, o proporcionado de forma externa.
  • Mucha información en texto proporcionada con imágenes sin atributo alt.
  • Maquetación de la página con tablas en vez de CSS.
  • Carencia de estructura alternativa.
  • No proporciona un sistema de navegación robusto (falta mecanismo tipo migas de pan) ni mapa web.
  • Se abren nuevas ventanas sin informar al usuario.

jueves, 17 de marzo de 2011

Seminario "Accessibility Engineering for the Web 2.0"

El próximo viernes 1 de abril de 2011 en la Universidad de Barcelona, dentro del Máster oficial en Gestión de Contenidos Digitales, se va a realizar el seminario Accessibility Engineering for the Web 2.0 impartido por Giorgio Brajnik, profesor de la Università degli studi di Udine.

El programa previsto es el siguiente:

  • Towards accessibility engineering
  • Outline of a global picture
  • Crowd sourcing for accessibility?
  • Pitfalls to avoid
    • In sampling
    • In detecting problems
    • In using automated tools
    • In measuring accessibility
    • In monitoring and maintaining accessibility levels
  • Today's challenges
  • Web 2.0/user generated content
  • Web 2.0/interactivity
  • ARIA guidelines
  • Some challenging results about validity and reliability of guidelines
  • Reliability and validity of a method
  • How to measure them
  • Some results about WCAG 2.0
Para más atender al seminario, hay que ponerse en contacto con el Sr. Miquel Térmens (termens [arroba] ub.edu).

miércoles, 16 de marzo de 2011

Investigan la accesibilidad de las aplicaciones de Google

En Estados Unidos, la Federación Nacional de Ciegos (National Federation of the Blind) ha solicitado al Departamento de Justicia que investigue la accesibilidad de las aplcaciones de Google: Google apps inaccessible to blind students, group says.

El problema ha surgido porque numerosas universidades están migrando parte de sus aplicaciones (por ejemplo, el correo electrónico) a Google Apps for Education (por ejemplo, Gmail), un conjunto de herramientas que Google ofrece de forma gratuita a los centros educativos.

Según la noticia, algunos productos como Gmail o Google Docs no son accesibles para las personas ciegas, una persona ciega no los puede utilizar de forma independiente, sin la ayuda de otra persona. La noticia dice:
The National Federation of the Blind has requested a Justice Department investigation into the schools' use of Gmail and other Google programs, saying that requiring students to use them violates the Americans with Disabilities Act. The Baltimore-based group is also asking other colleges not to adopt the software until it's accessible to all students and faculty.

"Given the many accessible options available, there is no good reason that these universities should choose a suite of applications, including critical e-mail services, that is inaccessible to blind students," said Marc Maurer, president of the National Federation of the Blind.
Pero también podemos leer que se han reunido con Google y están estudiando el problema.

Más sobre la accesibilidad de las aplicaciones de Google

A raíz de la investigación que se ha iniciado para estudiar la accesibilidad de las aplicaciones de Google (Investigan la accesibilidad de las aplicaciones de Google), he encontrado el artículo Does Google Apps for Education discriminate against the blind? en el que se reflexiona y analiza si Google estaría obligado a asegurar que sus aplicaciones son accesibles.

miércoles, 9 de marzo de 2011

Accesibilidad en HP

El sitio web HP Accessibility contiene algunos recursos interesantes sobre accesibilidad.

lunes, 7 de marzo de 2011

El fin de Internet Explorer 6

Ya era hora, hemos tenido que esperar mucho, pero por fin ha llegado la noticia: Microsoft empuja la desaparición de Internet Explorer 6 (El País) y Cómo seguir 'en vivo' la muerte de Internet Explorer 6 (El Mundo). Impresionante también que dos periódicos generalistas se hagan eco de esta noticia.

En la noticia de El País podemos leer:
"Muy pocas veces os pedimos encarecidamente que dejéis de usar uno de nuestros productos, pero con Internet Explorer 6 haremos una excepción", publica Microsoft en su cuenta oficial en Twitter.El mensaje incluye un enlace a una página titulada: "La cuenta atrás de Internet Explorer 6. Haciendo un mundo sin él".

En esta web se destaca que quieren que menos del 1% de los internautas usen su programa. "Ahorremos horas de trabajo a los desarrolladores", argumentan.
Es un agran alivio saber que Microsoft reconoce que Internet Explorer 6, quizás el peor navegador de la historia, ha obligado a miles de desarrolladores a invertir miles de horas para lograr que un sitio web fuese compatible con su navegador

Microsoft ha preparado la página web The Internet Explorer 6 Countdown para que podamos seguir en directo cómo va desapariendo Internet Explorer 6 de la faz de la Tierra. Según esta página, el índice de uso de Internet Explorer 6 en España es un 3,3%, mientras que en Noruega es un 0,7%, en Estados Unidos es un 2,9% y en China un 34,5%.  En total, la página web de Microsoft afirma que un 12% del mundo usa Internet Explorer 6.

Por cierto, la página que ha preparado Microsoft tiene graves problemas de accesibilidad.

viernes, 4 de marzo de 2011

Sobre el atributo alt y title, ¿cumplen la misma función?

Me escribe una alumna de la asignatura Experiencia de usuario del Curso de especialista en diseño web:
Estoy mirando varias páginas para la actividad voluntaria de accesibilidad web, pero me están surgiendo algunas dudas con las etiquetas. Por ejemplo, después de leer los apuntes me ha quedado claro que cuando se pone una imagen, se debe incluir la etiqueta (alt=" "),  sin embargo, estoy viendo una web en la que aparece de la siguiente forma:

<div id="Clogo">
<img alt="Escudo Institucional" src="images/logo.jpg" title="Escudo Institucional" />

En este caso concreto, ¿la etiqueta (title= " ") cumple la misma función?
La alumna no me ha dicho en su mensaje dónde ha encontrado este ejemplo,  pero uno que es "perro viejo" lo ha encontrado fácilmente: se trata de la web oficial de la Junta de Extremadura.

La respuesta es NO, no cumple la misma función. Si leemos la recomendación del W3C sobre HTML podemos sacar las siguientes conclusiones:

  • El atributo alt se emplea como representación alternativa, es decir, como sustituto de la imagen. Por ejemplo, cuando se decide no cargar las imágenes de una página (por ejemplo, porque la conexión a Internet es lenta o nos cobran mucho dinero por ello, como puede ser desde un teléfono) o cuando alguien no puede ver las imágenes (por ejemplo, un ciego). Este atributo es obligatorio.
  • El atributo title se emplea para proporcionar información adicional, no para proporcionar información que sustituya al elemento al que se aplica (en este caso a una imagen). Por ejemplo, se puede emplear para indicar el autor de una fotografía, la fecha de realización de una fotografía o el origen de una imagen, pero siempre como información complementaria. Este atributo es opcional.
Por tanto, en este caso concreto, está mal utilizado el atributo title. Se emplea para proporcionar exactamente la misma información que con el atributo alt, lo cual, más que ayudar, es una barrera (a nadie le gusta leer o escuchar dos veces lo mismo). Si vemos el código de la página de la Junta de Extremadura, comprobaremos que esta forma de actuar se repite en más sitios.

Esta página es el típico caso de accesibilidad web mal entendida: el desarrollador de la página lee alguna guía, lee algún artículo, consulta algún ejemplo, pero en realidad no entiende lo que está haciendo, simplemente lo repite como un loro.

La guinda de esta página web la podemos encontrar en su pie. Por un lado, podemos encontrar el mensaje "Resolución Óptima 1024x768 px.", que ya comenté un caso parecido hace unos días en Tonterías, las justas. Por otro lado, podemos encontrar las medallas de "XHTML 1.0" válido (pero no es así, a mí me han salido 3 errores de validación) y "WAI-AA" (hay algunas cosas básicas que se deberían corregir, como esta del atributo title).


[Actualización 04/03/2011]
En realidad, en este ejemplo, la imagen en cuestión sólo realiza una función decorativa, por lo que lo mejor, lo más accesible es emplear un texto alternativo nulo (simplemente alt=""), y por supuesto, no utilizar el atributo title.

jueves, 3 de marzo de 2011

La etiqueta <nav> de HTML5

A los alumnos de la asignatura Experiencia de usuario del Curso de especialista en diseño web que estoy impartiendo les propuse hace casi dos semanas un ejercicio complementario: ¿Cómo mejorará la accesibilidad web HTML 5? Para guiar un poco más el ejercicio, les comentaba que en este blog he escrito varias entradas sobre ello, y además les incluía tres preguntas para centrar aún más el tema:
  • ¿Cómo mejorará la accesibilidad web HTML 5?
  • ¿A quién crees que beneficiará más?
  • ¿Alguna de las características beneficiará a la mayoría de la gente y no sólo a grupos reducidos?

Como el ejercicio es complementario, es decir, no se evalúa ni se va a hacer un examen sobre ello, ha ocurrido lo que esperaba: no ha contestado nadie, absolutamente nadie.

Hoy les he escrito el siguiente mensaje, para ver si alguien se anima de una vez:

Un nuevo elemento que ayuda a mejorar la accesibilidad es el nuevo elemento (etiqueta) <nav>. Esta etiqueta permite definir un elemento navegacional de la página web, como puede ser el menú principal o el menú secundario.

Se debe utilizar para marcar los elementos principales de navegación, no se deben marcar todos los elementos, como podemos leer en el apartado 4.4.3 The nav element de la especificación HTML5:

Not all groups of links on a page need to be in a nav element — only sections that consist of major navigation blocks are appropriate for the nav element. In particular, it is common for footers to have a short list of links to various pages of a site, such as the terms of service, the home page, and a copyright page. The footer element alone is sufficient for such cases, without a nav element.

El artículo Semantic navigation with the nav element explica muy bien el uso de esta etiqueta y las diferentes situaciones donde se recomienda su uso.

Un ejemplo de uso de esta etiqueta es:

<nav>
<ul>
<li><a href="/accesibilidad/">Accesibilidad</a></li>
<li><a href="/html/">HTML</a></li>
<li><a href="/javascript/">JavaScript</a></li>
<li><a href="/css/">CSS</a></li>
</ul>
</nav>

¿Por qué mejora la accesibilidad esta etiqueta? Porque permite identificar de una forma clara los elementos de navegación que tiene una página web, por lo que las tecnologías de apoyo como los lectores de pantalla lo pueden detectar y ofrecer al usuario cuando lo necesite.

Un compañero ha leído este mensaje y me ha preguntado: ¿hay alguna ventaja más? Por supuesto:
  • Proporciona un método explícito de especificar cuales son los elementos de navegación de un sitio web y de una página web.
  • Se puede (podrá) configurar el agente de usuario (navegador) para que inicialmente salte el menú de un sitio web, por lo que ya no es necesario escribir "saltar enlaces" o "saltar al contenido principal".
  • Un lector de pantalla puede tener un comando (atajo de teclado) para acceder directamente a los elementos de navegación de una página, igual que tiene un comando para mostrar la lista de enlaces o la lista de encabezados de una página.
  • Un agente de usuario en un dispositivo con una pantalla pequeña (por ejemplo, un teléfono), puede mostrar los elementos de navegación de forma independiente o cuando el usuario pulse una tecla del dispositivo.
  • El elemento <nav> puede funcionar como un <div> a todos los efectos. Ya no es necesario escribir <div id="menu"> o <div id="navigation">. <nav> tiene 3 letras como <div>, así que no se puede decir que haya que escribir más.

Y seguro que hay muchas más ventajas que yo desconozco. ¿Se te ocurre alguna ventaja más?

Evidentemente, todas estas ventajas dependerán de que los agentes de usuario y las tecnologías de apoyo soporten los nuevos elementos (etiquetas) de HTML5. Que no lo soporte ahora, no es razón para no usarlo ya: si ya lo usamos, nuestras páginas estarán preparadas para el futuro.

martes, 1 de marzo de 2011

Cómo hacer que un gráfico sea accesible

Si hubiese que elegir una regla o principio que resumiese toda las pautas, guías y consejos para hacer una página web accesible yo me quedaría con ofrece alternativas. No te limites a proporcionar la información en un solo formato, ya que estarás excluyendo a muchos usuarios.

Como suele ocurrir, la teoría es más sencilla que la práctica, y muchas veces es difícil encontrar buenos ejemplos que reflejen la teoría.

Pero acabo de encontrar un buen ejemplo. Un buen ejemplo de cómo hacer que un gráfico sea accesible. Tampoco es que haya descubierto algo sorprendente (lo que vamos a ver se lleva haciendo muchos años con el enlace D de información detallada), pero vale la pena recordarlo.

La página web WebKit SunPider ofrece los resultados de un test para medir el tiempo de ejecución de JavaScript en diferentes navegadores. Es decir, es un test para evaluar el rendimiento de los motores de JavaScript que llevan incorporados los navegadores. Sorprendentemente, el navegador más rápido de todos los probados es la versión candidata de Internet Explorer 9. Y también sorprende que no les importe reconocer que Internet Explorer 8 es el navegador más lento con diferencia (más de 10 veces más lento).

Volviendo al tema de la accesibilidad, como podemos ver en la siguiente imagen, los resultados se ofrecen mediante un gráfico de barras.


La forma correcta de ofrecer información adicional o alternativa sería mediante el atributo longdesc, pero desgraciadamente poca gente lo conoce y mucha menos gente lo usa.

Pero también se ofrece una versión textual en forma de tabla mediante el texto "A textual version of the results can be found here".



Para una persona que no pueda ver, la versión en forma de tabla, que está correctamente etiquetada porque emplea la etiqueta <th> para crear los encabezados de columna, le ofrece la misma información que el gráfico de barras. Pero es que además, la versión en forma de tabla beneficia a todo el mundo: ¿y si quiero hacer un trabajo con esos datos? No hay problema, los puedo copiar y pegar fácilmente a partir de la tabla, no tengo que escribir la tabla desde cero a partir del gráfico.

lunes, 28 de febrero de 2011

¿Qué le falta a la especificación de HTML5?

El artículo What's still missing in the HTML5 spec explica lo que falta por definir en la especificación de HTML5. Recordemos que según el nuevo calendario para HTML5 del W3C, la recomendación final se espera que se publique en el segundo cuatrimestre de 2014.

Según el artículo, lo más importante que falta por definir son las capacidades multimedia de HTML5 y el soporte de WebSocket, una tecnología que permitirá la comunicación en ambos sentidos (¿un AJAX mejorado?).

Otro tema crítico, la estandarización de los codecs de vídeo, parece que no se resuelve y por ahora no existe un consenso.