Tutorial sobre HTML5

En el sitio web del W3Schools, uno de los mejores sitios con información para el desarrollo web porque es precisa y está actualizada, podemos encontrar un tutorial y una guía de referencia sobre HTML5, la nueva versión del lenguaje de marcado HTML que se espera que se publique como recomendación por el W3C en el 2011.

Barreras para el acceso al contenido de las webs de universidades españolas

Acabo de encontrar el artículo Barreras para el acceso al contenido de las webs de universidades españolas. Aunque el artículo analiza diversas áreas de la interacción entre personas y sitios webs de universidades, presta especial interés a aquellos aspectos relacionados con la accesibilidad.

El estudio se basa en el análisis de 26 indicadores agrupados en los siguientes cuatro apartados:

1. Criterio político en el diseño. Se trata de reflejar factores y decisiones de los responsables de una universidad que, sin tener que ver directamente con el diseño, terminan por convertirse en problemas al acceso a la información de las páginas.
2. Legibilidad. Aspectos que influyen en la facilidad de lectura de los textos.
3. Diseño. Cuestiones relacionadas con el diseño propiamente dicho. Modo en el que se muestra la interfaz y los problemas que ello puede ocasionar para la transmisión de información.
4. Ayuda al acceso a la información. Las webs universitarias suelen ser sitios muy grandes, con lo que resulta vital la utilización de herramientas de ayuda al acceso a la información.

Uno de los indicadores es muy interesante:

21. Falsa Accesibilidad (Ayudas al tipo de letra y contraste). Es interesante que un usuario pueda modificar el tipo de letra, variar el contraste de los elementos de la página y controlar ciertos aspectos relacionados con la accesibilidad de la página. Sin embargo, el lugar apropiado para controlar dicha acción es el navegador web. El que la mayoría de navegadores web no implementen de manera fácil esas funciones no es razón suficiente para que los diseñadores hayan de incluir esas funcionalidades características del navegador en la propia página web (Heilmann, 2006). No obstante, normalmente es un problema menor, pues no se ocupa demasiado espacio en la página y se hace con intención de mejorar la experiencia de usuario. En otros casos no está tan clara la presencia de estos elementos, especialmente cuando no se ha realizado un trabajo de mejora de la Accesibilidad de la página pero pese a ello se incorporan, más por estar de moda o de aparentar una accesibilidad que realmente no tienen que a un verdadero interés en ayudar al usuario. Hemos penalizado a aquellas páginas que incorporan estas supuestas ayudas.

El artículo completo está disponible en la revista online Scire.

Ejemplos de uso del atributo longdesc

El atributo longdesc se emplea para ofrecer una descripción más larga del elemento que la proporcionada por el atributo alt. Las etiquetas de XHTML que admiten este atributo en la versión 1.0 son: img, iframe y frame. Su valor tiene que ser una Uniform Resource Identifier (URI), la dirección de un recurso en Internet.

Mientras que el atributo alt contiene el texto alternativo de la imagen, el atributo longdesc contiene una dirección de Internet a otra página web o a la misma página web donde se encuentra la descripción larga de la imagen.

En Serie "Guía breve": Figuras y diagramas se puede encontrar una explicación detalla de su empleo.

En Research: Longdesc se puede encontrar una compilación de sitios web donde se emplea el atributo longdesc.

Tabla periódica de HTML 5

Periodic Table of the Elements es una curiosa página donde se muestra, como si fuera la tabla periódica de los elementos químicos, el nuevo lenguaje HTML 5, que por ahora la última versión es un borrador del 24 de junio.

Los 104 elementos que posee por ahora HTML 5, más dos elementos adicionales que han sido propuestos pero todavía no incorporados en la especificación se agrupan en las siguientes categorías:

• Elemento raíz (html)
• Semántica a nivel de texto (span, a, b, i, q, ...)
• Formularios (form, select, meter, datalist, ...)
• Datos tabulados (table, caption, tr, th, td, ...)
• Metadados y scripting (head, title, meta, ...)
• Contenido agrupado (p, blockquote, hr, div, ol,  ...)
• Secciones de documento (section, header, h1, h2, ...)
• Elementos interactivos (menu, command, summary, details)
• Contenido incrustado (img, area, map, object, canvas, ...)

AViewer

AViewer es un software desarrollado por The Paciello Group que permite inspeccionar el contenido de una página web y ver el código HTML, los atributos ARIA y la información proporcionada por el navegador a los APIs de accesibilidad: MSAA, ARIA, HTML e IA2.

Uso del texto alternativo con HTML 5

El texto alternativo es la principal forma de lograr que la información visual sea accesible. Hace tiempo, escribí varias entradas donde explicaba el uso del texto alternativo:

• ¿Qué hace el atributo alt? (17/3/2006)
• El atributo longdesc (10/4/2006)
• Serie "Guía breve": Imágenes y animaciones (31/10/2007)
• Serie "Guía breve": Mapas de imagen (2/11/2007)

HTML 5, que se espera que sea una recomendación en 2011, traerá numerosas novedades y características que mejorarán la accesibilidad de las páginas web. En el borrador de HTML 5 podemos encontrar el apartado 4.8.1.1 Requirements for providing text to act as an alternative for images donde se explica cómo escribir un texto alternativo correcto. Además, el W3C también ha publicado el borrador del documento HTML5: Techniques for providing useful text alternatives donde se desarrolla (o se desarrollará, porque el documento está incompleto).

Los mecanismos disponibles en HTML 5 para proporcionar un texto alternativo son:

• El atributo alt del elemento img
• El atributo title del elemento img
• El atributo longdesc del elemento img
• Los nuevos atributos aria-labelledby y aria-describedby
• Los nuevos elementos figure y figcaption

Un ejemplo de uso del nuevo atributo aria-describedby es:

<p><img src="flowchart.gif" alt="Un diagrama de flujo que representa la reparación de una lámpara que no funciona." aria-describedby="d1"></p>

<p id="d1">Si la lámpara no funciona, comprobar que está conectada a la corriente.

Si no, conectarla. Si está conectada y todavía no funciona, comprobar que hay una bombilla.

Si no, colocar una bombilla. Si hay una bombilla, comprobar que no está quemada.

Si lo está, cambiar la bombilla. Si todavía no funciona, comprar una lámpara nueva.</p>

En el ejemplo anterior,el atributo aria-describedby contiene el identificador (atributo id) de un párrafo de texto que contiene la descripción detallada de la imagen.

Un ejemplo del uso de los nuevos elementos (etiquetas) figure y figcaption es:

<figure>

<img src="adan-eva.jpg" alt="Fotografía de la pareja de pinturas, donde Adán se sitúa a la izquierda y Eva a la derecha con la famosa manzana en su mano izquierda">

<figcaption>Adán y Eva, Alberto Durero (1507)</figcaption>

</figure>

En el ejemplo anterior se puede observar que se ha empleado el atributo alt para proporcionar una descripción de la imagen, mientras que la etiqueta figcaption proporciona el título, autor y fecha de creación del cuadro que representa la imagen.

Nuevos cursos sobre accesibilidad web

La empresa DRED (Diseño e Impartición de Recursos Educativos) ha firmado un acuerdo de colaboración con
ONCE – CIDAT y la Consejería de Empleo de la Junta de Andalucía para impulsar el desarrollo de recursos accesibles. En concreto, el objetivo es es el diseño de un plan de formación para potenciar la capacidad de los profesionales de realizar recursos accesibles. En este plan se explicará cómo crear recursos accesibles en HTML, Flash, Java y para las plataformas Windows y Linux.


Por ahora los cursos no se están impartiendo, pero es posible apuntarse para recibir más información.

El plan del Gobierno Australiano para adoptar WCAG 2.0

Web Content Accessibility Guidelines (WCAG) 2.0 alcanzó el nivel de recomendación en diciembre de 2008. Sin embargo, en estos dos últimos años poco se ha oído sobre su posible adopción por parte de los gobiernos.

El Gobierno de Australia, a través de la Australian Government Information Management Office (AGIMO) ha publicado el documento Web Accessibility National Transition Strategy en el que se propone un plan para asegurar que el contenido web del Gobierno es accesible según WCAG 2.0, ya que como podemos leer en este mismo documento, para finales del 2012, todos los sitios web gubernamentales (federales, estatales y locales) deben cumplir al menos el nivel A de WCAG 2.0, mientras que todos los sitios web federales deben cumplir el nivel doble AA para finales del 2014:

Australian governments at all levels have endorsed WCAG 2.0, and require all government websites (federal, state and territory) to meet the new guidelines at the minimum compliance level (Single A) by the end of 2012. In addition, the Australian Government requires all federal websites to meet the medium conformance level (Double A) by the end of 2014.

En el siguiente diagrama de flujo, se establece cómo decidir si un contenido web debe o no debe ser actualizado a WCAG 2.0:

Si el contenido se crea después de julio 2010, tiene que ser accesible según WCAG 2.0.
Si el contenido se creó antes de julio de 2010, si aún es actual, se tiene que actualizar a WCAG 2.0. Si no, si el contenido no es popular se tiene que archivar y retirar, pero si es popular, se tiene que actualizar a WCAG 2.0 sólo si no cumple WCAG 1.0.

El iPhone 4 mejora su accesibilidad

El otro día escribí la entrada Las personas zurdas tendrán que dejar de ser zurdas si quieren usar el nuevo iPhone. El título era un poco exagerado, pero reflejaba los comentarios y soluciones que se habían dado frente a un problema de recepción que tiene el nuevo iPhone 4.

Sin embargo, no todo son noticias malas sobre este nuevo teléfono, ya que según leo en Apple iPhone 4 Shows New Accessibility Features y he podido comprobar en la web oficial de Apple dedicada a la accesibilidad del iPhone 4, ofrece una serie de características que son envidiables y que no creo que ofrezca ningún otro teléfono actual. La información también está disponible en la web de Apple en español.

Las principales características que ofrece son:

• Lectura de pantalla con VoiceOver: En lugar de memorizar comandos de teclado o presionar teclas de cursor pequeñas, el iPhone 4 permite que se toque la pantalla para escuchar una descripción del elemento que está tocando el dedo.VoiceOver habla 21 idiomas y funciona con todas las aplicaciones incorporadas en el iPhone 4.
• Soporte para displays de Braille inalámbricos y para múltiples tablas de Braille: El nuevo iPhone 4 es compatible con más de 30 dispositivos braille inalámbricos bluetooth sin necesidad de software adicional. Además, el iPhone 4 incluye tablas braille para más de 25 idiomas.
• Mejoras de escritura: Touch Typing es un nuevo método opcional, tanto para las personas ciegas como para las personas con deficiencias visuales de escribir con el teclado en pantalla. Con Touch Typing se puede mover el dedo por encima del teclado y escuchar con VoiceOver cada letra en voz alta: al llegar a la letra que se desea, hay que levantar el dedo para seleccionarla.
• Zoom y ampliación: La opción Zoom en el iPhone permite ampliar toda la pantalla de cualquier aplicación hasta cinco veces su tamaño normal.
• Blanco sobre negro para mayor contraste: El iPhone 4 permite cambiar la pantalla a blanco sobre negro para obtener un mayor contraste, una excelente opción para los usuarios con un resto visual.
• Soporte para subtítulos: iPhone soporta la reproducción con distintos formatos de subtítulos. Los títulos aparecen en la pantalla al igual que los subtítulos se ven en la televisión.

Otra empresa que se apunta al control mental

Acabo de leer en el periódico El País la noticia Que la fuerza acompañe a los videojuegos. La noticia dice:

En Gamelab, la feria del Videojuego y el Ocio Interactivo que se celebra desde ayer y hasta mañana en el palacio de Congresos de Gijón, el protagonista es Neurosky, una empresa californiana que bien podría transformar al usuario en un guerrero Jedi. Su software único y casi telepático pretende revolucionar el mercado. "Se basa en sensores que captan y convierten los impulsos eléctricos cerebrales del jugador en acción en la pantalla del ordenador", cuenta David Westendorf, vicepresidente de Neurosky. "Mide los impulsos eléctricos cerebrales, pero también, cómo se mueven tus ojos o cómo reaccionan tus músculos".

Si se consulta la web de la empresa fabricante, parece que por ahora su dispositivo sólo permite medir el nivel de atención y concentración del usuario, aunque parece que en la última versión también permite detectar si el usuario parpadea los ojos.

No es la primera vez que aparecen noticias sobre el control mental del ordenador y ya he escrito varias entradas sobre ello, como Otra noticia más sobre el control mental del ordenador (1/2/2010) y Control mental: ya lo podemos comprar (30/12/2009).

Además de la empresa de esta noticia, Neurosky, la empresa emotiv también vende un casco para controlar un juego de ordenador. Todos estos dispositivos se podrían emplear como ayudas técnicas (tecnologías de apoyo) para que algunas personas con discapacidad puedan controlar fácilmente y con un costo reducido el ordenador. Sin embargo, todavía no he leído que haya gente investigando en el uso de estos dispositivos para ello.

¿Se convertirán estos dispositivos en el interfaz estándar para controlar el ordenador para todo el mundo? A corto plazo lo veo difícil. Por ahora, estos dispositivos requieren que el usuario se concentre, lo cuál impide que el usuario haga varias tareas a la vez. ¿Quién no ha estado hablando por teléfono, mientras escribía en el ordenador con una mano y con la otra se rascaba la cabeza?

Las personas zurdas tendrán que dejar de ser zurdas si quieren utilizar el nuevo iPhone

Leo con sorpresa en el periódico El País la noticia Las personas zurdas, principales perjudicadas por los problemas del iPhone 4. La noticia dice:

Los problemas de recepción de la señal telefónica del iPhone 4 debido a la ubicación de la antena en la armadura metálica que rodea al móvil han despertado las críticas de muchos clientes. Un colectivo particularmente afectado es el de las personas zurdas ya que la antena se halla en la parte inferior izquierda del aparato y la mejor solución que, por ahora, ofrece Apple es coger el teléfono de otra forma.
[..]
Lauren Milsom, del Left-Handed Club, que agrupa a 90.000 miembros, ha manifestado su enfado porque Apple haya sugerido que el 10% de la población, porcentaje de personas zurdas, deba adoptar una posición menos natural para emplear la última tecnología de la empresa. "Sugiero que Steve Jobs contrate a zurdos en el diseño y prueba de sus futuros aparatos". Para la portavoz de la entidad, resulta decepcionante que una empresa líder en el diseño y la innovación como Apple no haya pensado en los zurdos. "El teléfono debe ser rediseñado para solventar este problema".

¿Y qué ocurre con las personas con discapacidad? Muy acertado el comentario número 14 de Javier:

Todos hablan de los zurdos, pero ¿qué pasa con los que tenemos algún tipo de minusvalía que nos impide usar la mano derecha? Menuda solución de mal gusto y peor educación dio el Sr. Jobs contestando que sujetara el movil con la otra mano. No diría lo mismo si a el le faltara la suya. No me gusta la prepotencia de Apple, me gusta mucho el iPhone 4 pero creo que voy a elegir soluciones mejores y más económicas, la verdad es que ahora hay 4 o 5 modelos de otras marcas muy superiores.

Ejemplo de superación

En los encuentros digitales del periódico El Mundo ha habido uno muy interesante con Javier García Pajares, una de las 6.000 personas sordociegas que hay en España.

¿Cómo lee? ¿Cómo se comunica?

Leer lo hago en braille, que normalmente suele ser en el ordenador. Gracias a la línea braille que me sirve como monitor, me interpreta todo lo que aparece en pantalla con una serie de puntos en relieve. En cuanto a lo de comunicarme, lo hago en dactilológico, que es un sistema muy sencillo, ya que consta de un signo para cada letra y luego lo que se hace es signar en la palma de mi mano, letra por letra, y yo lo leo y contesto normal.

Curso de verano sobre accesibilidad web

La UNED junto con la Fundación Vodafone España organiza el curso de verano Accesibilidad Web y Aprendizaje para Todas las Personas. Los temas del curso son:

• Vida independiente de las personas con diversidad funcional en la Universidad
• Las necesidades de los usuarios y su participación activa en la actividad universitaria
• Accesibilidad al web, a las plataformas de elearning y a los materiales de aprendizaje: Introducción al formato DAISY y a la accesibilidad de los materiales multimedia
• El proyecto EU4ALL: Servicios TIC de apoyo a la diversidad
• Experiencia práctica en aula de informática

Sexta edición del curso "Experto en accesibilidad y usabilidad de contenidos web"

La Fundación Instituto Ciencias del Hombre junto con la Universidad de Alcalá de Henares organizan la sexta edición del curso Experto en accesibilidad y usabilidad de contenidos web. Los contenidos del curso son:

Acceso a la información
    * Tema 1. Distintos tipos de discapacidades: visual, auditiva, cognoscitiva y motora.
    * Tema 2. Barreras que presenta la Web a las distintas discapacidades. Simulaciones de discapacidad.
    * Tema 3. Herramientas y técnicas especiales de acceso.

Accesibilidad de contenidos Web
    * Tema 4. Herramientas de desarrollo.
    * Tema 5. Introducción a la Accesibilidad.
    * Tema 6. Directrices de Accesibilidad de la Iniciativa para una Web Accesible (WAI)
    * Tema 7. Aplicando las Directrices de Accesibilidad.
    * Tema 8. Análisis del grado de Accesibilidad.

Usabilidad y experiencia de usuario
    * Tema 9. Introducción a la Usabilidad.
    * Tema 10. Técnicas y métodos de evaluación de usabilidad y experiencia de usuario.
    * Tema 11. Metodologías de Diseño Centrado en el Usuario.

Legislación y Normativa Aplicable
    * Tema 12. Legislación y Normativa.
    * Tema 13. Beneficios adicionales de implantar soluciones accesibles.

Censura cuando se critica la accesibilidad

En la página 300puntos me censura por la forma de criticar la accesibilidad de una web se explica un caso de censura pública cuando un usuario critica la accesibilidad de un sitio web de una institución pública que debería ser accesible:

Una comunidad de diseñadores de Granada (300puntos.info) ha censurado mis críticas sobre la accesibilidad de una web de una institución pública por dirigirme al responsable de la misma. A algunos miembros de la comunidad no les ha gustado que informe del estado de la web al "cliente".
El día 12-05-2010 en el blog de 300puntos.info, una comunidad de diseñadores de Granada, se publico un comunicado de Globalpropaganda.com anunciando su último proyecto. La web hecha para el proyecto Biotree pertenece al Centro Andaluz de Medio Ambiente de la Universidad de Granada y la Junta de Andalucía. Con lo cual nos encontramos con una web de la que son propietarias dos instituciones públicas, entre ellas una universidad.
Al visitar Biotree, nada más entrar, me encuentro con una web que no cumple los mínimos principios de accesibilidad. Sin entrar en muchos detalles basta con decir que la página de inicio está hecha en flash y no ofrece ninguna alternativa textual.
Muy molesto e indignado publique un comentario en blog de 300puntos, criticando que se haga una web como esta para una institución pública. También envié un correo a los responsables de la web con una copia del texto de mi comentario. Después de varios comentarios más de otros usuarios e incluso de una respuesta de Globalpropaganda.com, defendiendo la accesibilidad de la web y acusándome de ofrecer mis servicios a su cliente, mis comentarios, han sido eliminados y se ha cerrado la publicación de más comentarios.

Un mono controla el brazo de un robot con su mente

La noticia Monkey Controls Advanced Robot Using Its Mind nos cuenta que investigadores de la Universidad de Pittsburg en Estados Unidos han enseñado a un mono a controlar el brazo de un robot con el pensamiento.

Además, he encontrado el siguiente vídeo:

 

Orca

Orca es un lector de pantalla (screen reader) y magnificar de pantallas (magnifier) para el software de escritorio GNOME.

Más información en la página de documentación.

La web 2.0 y la accesibilidad web

El artículo Los efectos de la orgía 2.0: falta de accesibilidad de Daniel Torres Burriel presenta una interesante reflexión sobre las famosas "redes sociales", que de sociales tienen poco ya que la mayoría dejan de lado a las personas con discapacidad, ya que son sitios web con graves problemas de accesibilidad:

Lo siento. Este no va a ser un post políticamente correcto. El cuerpo me pide dar caña. Y lo voy a hacer.
La orgía de la web 2.0 en la que estamos completamente sumergidos, y que está plagada de eyaculadores precoces multiplataforma (muy social, eso sí), nos trae de regalo una indecente y vergonzosa falta de accesibilidad. ¿Qué significa eso? Pues que detrás de todo el rollo de las plataformas sociales, de los espacios de participación, de la conjugación enfermiza el verbo compartir, se esconde una total y absoluta falta de sensibilidad humana. Así lo creo y así lo pienso.
¿Cuántos sitios sociales, de esos tan modernos, tienen un buen soporte para que todas las personas puedan disfrutar de sus características? ¿Están realmente preparados los sitios llamados “2.0″ para ser consumidos por personas con necesidades especiales?
Y voy más allá, ya que el cabreo me inunda. ¿Habéis probado alguna vez a navegar como lo hace una persona con baja o nula visión? ¿Alguien sabe lo que es un lector de pantalla?
No se si es el cabreo que tengo o que hoy lo percibo todo en negativo.

Cinco pasos simples hacia la accesibilidad web

Mucha gente se siente agobiada cuando intenta lograr que un sitio web (que ya existe o se plantea desarrollar) sea accesible. Las pautas del W3C, ya sea WCAG 1.0 o WCAG 2.0, son muy extensas, complejas y no proporcionan una pista de "por dónde empezar". Lo más simple que ofrece es la Guía breve para crear sitios web accesibles, pero no explica mucho:

• Imágenes y animaciones: Use el atributo alt para describir la función de cada elemento visual.
• Mapas de imagen: Use el elemento map y texto para las zonas activas.
• Multimedia: Proporcione subtítulos y transcripción del sonido, y descripción del vídeo.
• Enlaces de hipertexto: Use texto que tenga sentido leído fuera de contexto. Por ejemplo, evite "pincha aquí".
• Organización de las páginas: Use encabezados, listas y estructura consistente. Use CSS  para la maquetación donde sea posible.
• Figuras y diagramas: Describalos brevemente en la pagina o use el atributo longdesc.
• Scripts, applets y plug-ins: Ofrezca contenido alternativo si las funciones nuevas no son accesibles.
• Marcos: Use el elemento noframes y títulos con sentido.
• Tablas: Facilite la lectura línea a línea. Resuma.
• Revise su trabajo: Verifique. Use las herramientas, puntos de comprobación y pautas de http://www.w3.org/TR/WCAG.

El artículo 5 Basic Steps Towards Website Accessibility ofrece cinco consejos sencillos:

• Add alt attributes
• Add skip links
• Provide focus for keyboard navigation of links and forms
• Use meaningful text for your links
• Think about color
  

Fire Vox

Fire Vox es una extensión para el navegador Mozilla Firefox que proporciona la capacidad de lector de pantallas. Además de las características típicas de un lector de pantallas, como son identificar los encabezados, los enlaces, las imágenes, etc., Fire Vox proporciona soporte para MathML y para las características de voz de CSS (CSS Aural).

Fire Vox funciona en Windows, Macintosh, and Linux.