El atributo alt en la Wikipedia

Curioso, el atributo alt tiene su propio artículo en la Wikipedia en inglés: alt attribute. El artículo dice:

The alt attribute is used in HTML and XHTML documents to specify alternative text (alt text) that is to be rendered when the element to which it is applied cannot be rendered. It is also used by "screen reader" software so that a person who is listening to the content of a webpage (for instance, a person who is blind) can interact with this element. The attribute was introduced in HTML 2 and in HTML 4.01 was required for the img and area tags. It is optional for the input tag and the deprecated applet tag.

Consejos para desarrollar páginas web más accesibles para las personas con discapacidad cognitiva

Los problemas de accesibilidad web asociados a la discapacidad cognitiva o intelectual se han estudiado muy poco. Por ello, las soluciones planteadas son muy escasas.

En Layout, Navigation and Support for Text on Websites – A Few Ideas se presentan algunos consejos:

Layout

Algunos consejos son:

• All necessary text on the screen
• San Serif font
• Font to be at least 14 point
• Headings used
• Alignment of text to left,
• Writing in black on white
• There should not be too much information on the screen – avoid clutter

Navigation

Algunos consejos son:

• Having a maximum of eight navigation buttons.
• Placing the constant buttons (to move between pages, to return to home) in a top navigation bar and with topic related buttons on the left side.

Supporting text

Algunos consejos son:

• Short sentences of speech linked to icons, the same sentence can be repeated as often as the person needs to clarify a point or refresh their memory.
• Short videos no longer than about 30-45 secs may work.
• A feature on videos to re-wind and play back – this already happens on sites such as You tube and BBC iplayer.

Guía de Recomendaciones en Accesibilidad Cognitiva

FEAPS Madrid, la Federación de Organizaciones en Favor de Personas con Discapacidad Intelectual de Madrid, tiene publicada en su sitio web la Guía de Recomendaciones en Accesibilidad Cognitiva. Esta guía ha alcanzado más de mil descargas.

La guía posee un apartado dedicado a la búsqueda de información en Internet. Algunos de los consejos son:

• Si la página me va marcando el camino que he seguido con una «miga de pan» o «hilo de Ariadna» será más fácil que pueda volver a una página que he visitado con anterioridad y en la que deseo seleccionar una opción diferente, y situarme en el contexto de la página que estoy visitando. Se tiene que reducir o eliminar los elementos emergentes, la publicidad y los cambios de apariencia constantes, y especialmente los no deseados, en la página web.
• Cuando la página me permite escribir datos o comentarios, como por ejemplo en los formularios, las cajas de texto deberían permitir que se vea la totalidad del texto que se escribe en ellas.
• Los menús es preferible que no sean desplegables, de esos que sólo los ves si tienes el ratón encima. Hay personas con problemas de motricidad fina que no aciertan al seleccionar las opciones. Cada subnivel de menú, debe activarse y fijarse con un click.

Eso del "hilo de Ariadna" es la primera vez que lo escucho. Pero en el artículo de la Wikipedia sobre la miga de pan aparece.

Thunder Screenreader

A través del siguiente vídeo he descubierto un nuevo lector de pantallas para Windows que es gratuito:


Este lector de pantallas se llama Thunder Screenreader. Parece que está disponible en español, algún día lo probaré...

Vídeo sobre accesibilidad web de la BBC

Este vídeo es un poco antiguo (debe ser de 2005 o 2006), pero es curioso verlo BBC Click Accessibility:

Simulador de ceguera al color

Spectrum es un complemento para Google Chrome que permite simular diferentes tipos de ceguera al color.

Página normal:

Protanopia:

Tritanopia:

Cinco consejos para hacer un sitio web más accesible

Es un vídeo antiguo, del año 2010, pero todavía tiene vigencia: Tips to make your website accessible.


Los consejos son:

1. Check that your website works correctly without images.
2. Simplify navigation and consider keyboard only users.
3. Include captions for video content.
4. Audio should not be played automatically on entry to a page.
5. Use suitable language and content for your audience.

Máster Universitario Online en UX: Usabilidad, Diseño de Interacción y Experiencia de Usuario

La Universitar Pompeu Fabra organiza el Máster Universitario Online en UX: Usabilidad, Diseño de Interacción y Experiencia de Usuario. Las clases comienzan el 15 de octubre de 2015.

Los contenidos académicos son:

1. Apertura del aula digital e introducción al funcionamiento del curso
2. Asignaturas comunes a todas las especialidades del Máster Universitario en Información Digital:
1. Fundamentos en tecnologías web
2. Posicionamiento en buscadores - SEO
3. Web Social - Community Manager
3. Asignaturas de la especialidad en Usabilidad, Diseño de Interacción y Experiencia de usuario:*
1. Diseño de interfaces usables
2. Frontend para UX
3. Evaluación de usabilidad y experiencia de usuario
4. Gestión de proyectos de UX en la empresa
4. Trabajo de fin de máster

El vídeo del webinar Inclusión y Autonomía de las personas con Discapacidad apoyados en la tecnología

El 6 de agosto participé en un webinar organizado por el Observatorio TIC dependiente del Ministerio de Telecomunicaciones y de la Sociedad de la Información del Ecuador.

El webinar tuvo en algún momento picos de casi 250 personas conectadas:

Ahora mismo, el vídeo tiene más de 1000 visitas acumuladas:

Guía de accesibilidad para el sitio web de las Naciones Unidas

Accessibility Guidelines for United Nations Websites es un sitio web en el que se encuentran las guías que se deben emplear en el desarrollo de los sitios web de las Naciones Unidas para garantizar su accesibilidad.

Pero cuidado, en lo primer que he ido a mirar, Acronyms and Abbreviations, he encontrado un error tremendo, porque sugiere el uso de la etiqueta acronym, pero esa etiqueta está desaconsejada desde hace años:

• http://www.w3schools.com/tags/tag_acronym.asp
• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/acronym
• http://html5doctor.com/the-abbr-element/

Guía para aprender accesibilidad web

The Accessibility Tree: A Training Guide es una interesante guía para aprender accesibilidad web. El índice de esta guía es:

1. Accessibility API
2. ARIA, Important Details
3. ARIA Categories
4. Accessibility Tree versus DOM
5. Keyboard, Touch, and ATs

Vídeo de WebAIM

Es un poco antiguo y el audio no es muy bueno, pero es un vídeo interesante, Keeping Web Accessibility In Mind:

Make Technology Work for Everyone

Muy bueno el vídeo Make Technology Work for Everyone: introducing digital accessibility, que ofrece 15 consejos para lograr una mayor accesibilidad digital. Y por supuesto, el vídeo tiene subtítulos (eso sí, en inglés):

Herramientas de accesibilidad recomendadas por Stanford

Stanford University tiene la página web Online Accessibility Program en la que explica muchas cosas sobre accesibilidad web.

Es muy interesante el apartado Tools que tiene una lista de complementos para Google Chrome, Mozilla Firefox y Microsoft Internet Explorer.

¿Por qué me interesa una web accesible?

En los medios de comunicación no aparecen muchas noticias sobre la accesibilidad web, así que es grato encontrarse alguna de vez en cuando. Hace unos pocos días, en La Vanguardia se publicó ¿Por qué me interesa una web accesible?. El artículo dice:

Se dice que algo es accesible cuando se puede obtener de forma sencilla y sin obstáculos, algo que es fácilmente comprensible, inteligible. La accesibilidad web busca que la web pueda ser usada por todas las personas, independientemente de sus capacidades sensoriales, físicas o técnicas. La información en la web es accesible cuando todo el mundo puede encontrarla y utilizarla.
[...]
Una web accesible mejora la calidad de vida y la autonomía de las personas con dificultades visuales, auditivas, motoras y/o cognitivas, pero no es un reducto para personas con diversidad funcional. Usted puede sufrir una lesión temporal en la mano que le impida utilizar el ratón, encontrarse en un ambiente ruidoso que le impida escuchar un archivo multimedia, o consultando su móvil a pleno sol sin poder distinguir los elementos con poco contraste. También debe tener en cuenta que su cuerpo envejece y, con la edad, muchas de sus capacidades se irán reduciendo. La accesibilidad web siempre nos beneficia a todos.

Cinco riesgos ocultos que puedes sufrir si tu sitio web es no accesible

En 5 Hidden Risks of Your Inaccessible Website se explican cinco riesgos que puedes sufrir si tu sitio web es no accesible:

• Daño a tu marca de empresa.
• Pérdida de oportunidades de mercado.
• Caída en barrena.
• Organizaciones más débiles.
• Menos empleados cualificados.

Qué hacer si usas una tabla para maquetar

Las tablas no se tienen que emplear para la maquetación, para el layout. En su lugar se debe emplear CSS.

Esta es la teoría, pero en la práctica a veces se siguen usando las tablas para la maquetación por diversas razones. Pero en este caso hay una solución para lograr que no interfiera con la accesibilidad de la página web: Layout Tables Tip.

El truco es muy sencillo, simplemente hay que añadir role="presentation" a la tabla.

Nuevo logo para representar que un producto o servicio es accesible

Las Naciones Unidas ha creado un logo para representar que "algo" es accesible: A New Symbol of Accessibility.

Lanzado Claws

En la Universidad de Alicante hemos desarrollado un complemento para Mozilla Firefox que emula (o simula) el comportamiento de un lector de pantallas como JAWS o NVDA.

Este complemento está inspirado en Fangs: Fangs Screen Reader Emulator

Fangs está muy bien, pero no ha sido actualizado desde hace años. El complemento que hemos desarrollado, Claws, tiene en cuenta las nuevas etiquetas de HTML5: Claws

Además, hemos incorporado algunas opciones que no posee Fangs.

Os animo a que lo probéis y nos indiquéis los errores y mejoras que podemos incorporar. Cualquier comentario me lo podéis enviar a sergio.lujan arroba ua.es

ColorADD, código de color para daltónicos

Hace unos días se publicó en el periódico El País la noticia El código ‘braille’ para daltónicos se inventa en el siglo XXI. La noticia dice:

Unos 350 millones de personas en el mundo (alrededor del 10 % de la población masculina y 0,5% de la población femenina) sufren de algún grado de daltonismo teniendo dificultad para interpretar los colores. Estando un 90% de toda la comunicación actual basada en el color, es sorprendente que hasta ahora nadie se haya planteado atajar este problema.
Es difícil imaginarse pintar un dibujo en el colegio si no distingues el color de los lápices que usas, vestirse cada mañana sin que alguien comente tu indumentaria después, identificar las líneas del metro, ir a comprar ropa, distinguir pastillas, interpretar señales o planos, y un sinfín de cosas más.
No ser capaz de distinguir los colores supone una gran pérdida de independencia y autoconfianza para la persona que lo sufre. Un 90% de estas personas necesitan asistencia a la hora de comprar, un 88% necesitan que le ayuden a seleccionar lo que ponerse, un 73% se han sentido excluidos socialmente, un 64% reconoce que la confusión de colores es su mayor problema, un 50% se sienten avergonzados por el color elegido y un 42% tiene dificultades de integración en el trabajo. Esto supone muchos millones de personas…
Uno de los principales lugares de exclusión de este colectivo es en la escuela. ¿Quién no ha visto la cinta roja cosida en la manga izquierda del babi del cole y la verde en la derecha para aprender derecha e izquierda? ¿Cómo será el dibujo de una persona que ve los lápices de colores como en la foto?
Pero incluso puede llegar a suponer un problema de ámbito público o seguridad vial al no poder reconocer por ejemplo el color de un semáforo. Como me cuenta un daltónico, “si el semáforo es normal sabemos si está en rojo o verde por la posición de la luz, pero si tiene un semáforo lateral adicional para ir a la derecha o a la izquierda es muy complicado interpretarlo, ¿Cómo saber cuándo está en rojo o verde?”.
Hasta ahora el problema del daltonismo se había quedado en un mero escrutinio del colectivo en las escuelas, y una necesidad constante de ayuda por parte de los daltónicos.

La solución a esto es ColorADD, un código gráfico que ayuda a entender los colores. Personalmente, para mí es más fácil entender un código RGB que los pictogramas de este código.