Un blog sobre accesibilidad, usabilidad, diseño para todos y nuevas tecnologías
Hoy, 18 de mayo, es el Día Mundial para Promover la Concienciación sobre la Accesibilidad Web.
A lo largo del día se realizarán multitud de eventos onLine como en el que participo de la Expo+Accesible.
En la web oficial del Global Accessibility Awareness Day se recoge más información sobre estos eventos.
En la web en castellano del Global Accessibility Awareness Day se recoge información en español.
Los desarrolladores web y las herramientas de desarrollo van incorporando poco a poco elementos que van reduciendo la complejidad y la severidad de las barreras de accesibilidad presentes en las páginas de nueva creación. Pero estos esfuerzos se centran principalmente en las alternativas a imágenes, contrastes de color y, a veces, la estructura semántica de las páginas. En muchos casos siguen apareciendo barreras de accesibilidad relacionadas con la comprensión del sitio que se está navegando o de los mecanismos de navegación y orientación en un sitio web. En la mayoría de ocasiones este problema se debe al desconocimiento de las necesidades de estos mecanismos de orientación y navegación.
El título de una página web es un mecanismo de orientación al que no se le presta actualmente mucha importancia. Incluso en muchos casos el desarrollador desconoce cómo cambiar el valor del título de la página sobre todo si desarrolla webs del tipo Single Page Application en la que toda la experiencia de navegación aparentemente se desarrolla sin saltar a otras páginas web.
El título de una página web es un mecanismo de navegación muy útil para personas con discapacidad que no pueden comprender una página de un vistazo.
Esta necesidad de accesibilidad se recoge en el criterio de éxito 2.4.2 de WCAG 2.0. Puedes leer la documentación oficial de la WAI para el criterio de éxito 2.4.2 understanding page titled.
Este criterio de éxito es de nivel A por lo que es de obligado cumplimiento en todas las legislaciones nacionales de Europa y Estados Unidos así como en las legislaciones de otros países ya que en todos ellos el nivel de mínimo cumplimiento legal es el de AA.
Se considera como válido y accesible un título de página que identifique claramente el propósito y el contenido de la página que se está consultando.
En muchos casos el título de las páginas consiste en el uso del nombre de la empresa o producto que se está consultando.
Imaginemos por ejemplo la experiencia de navegación por un sitio web especializado en la venta de productos de jardinería. Lo habitual es encontrar que el título de todas las páginas es algo como El jardinero en casa. Y utiliza este valor para titular todas las páginas del sitio web. Esto hace que el título de la página no ayude como mecanismo de orientación.
Sigamos imaginando y en nuestro sitio de jardinería encontramos que hay secciones de quienes somos, contactar, tienda, noticias y galería de fotos. Con esta complejidad en la estructura de secciones y contenidos es cada vez más necesario un título de página que refleje la sección que estamos consultando sin olvidar el nombre del sitio web. Un título de página más apropiado para estos contenidos podría ser: El jardinero en casa – quienes somos.
Pero si seguimos profundizando en la experiencia de navegación y nos movemos dentro de la tienda consultando productos el título de página que muestra el nombre del sitio y la sección no es suficiente. Además debemos añadir al título de página el nombre del contenido concreto que estamos consultando en esa página. Un título de página más apropiado sería: El jardinero en casa – Tienda – Tijeras de podar modelo Acme.
Con esta información una persona puede comprender dónde está y qué contenido principal se va a encontrar en la página.
La declaración del título de página se realiza dentro del fichero HTML en la cabecera de la página (elemento <head></head>) y se utiliza el tag <title>.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8" />
<title>El título de la página</title>
</head>
<body></body>
</html>
Esta declaración dentro del código HTML es apropiada cuando utilizamos tecnologías en las que tenemos total control del código HTML que se envía a los navegadores web de los usuarios.
En el caso de utilizar tecnologías como las utilizadas en las Single Page Applications como React o Angular debemos hacer uso de Javascript para actualizar el valor del título de la página.
La propiedad title del objeto document nos proporciona esta posibilidad de actualizar el título de nuestra página. Por ejemplo la siguiente línea en javascript actualizará el título de la página:
function setTitlePageWithProduct(productName) {
document.title = "El jardinero en casa - Tienda - " + productName
}
Esta función se podría utilizar cada vez que se vaya a renderizar el componente que muestra la información del producto de la tienda.
Con toda esta información ya no hay excusas para que los desarrolladores no proporcionen buenos y accesibles títulos en sus páginas web.
Ya publicado el tercer y último capítulo sobre accesibilidad en el podcast Unicode U+00D1.
En este tercer episodio hablo sobre frameworks, problemas, plataformas y cómo afrontar la accesibilidad desde el punto de vista del rol de desarrollador. Los analistas y diseñadores tuvieron su parte, ahora le toca al código.
Puedes escuchar el episodio desde la página oficial de Unicode U+00D1 o en cualquier otra plataforma de podcasting.
El próximo jueves 16 de febrero a las 18:30 de España tendrá lugar el evento Creando experiencias de usuario accesibles.
En este evento organizado por Hi experience hablaré sobre el proceso de crear y hacer productos y servicios accesibles así como los problemas y soluciones encontrados durante mi trayectoria en Cabify.
Podrás seguir el evento desde Youtube o desde la propia página del evento en LinkedIn.
El mundo del podcasting en español va creciendo poco a poco con nuevos podcasts que enriquecen el conocimiento disponible para todo el mundo.
Pero todavía hay pocos podcasts sobre accesibilidad.
Uno de los disponibles es Accesibilidad universal.
María García Garmendia realiza este podcast en el que se habla de accesibilidad y tecnología.
Puedes escuchar Accesibilidad universal en Apple podcast y en otras plataformas.
Dentro de las novedades en accesibilidad de MacOS Ventura hay una nueva opción dentro del apartado de Audición llamada sonidos de fondo.
Esta opción de accesibilidad consiste en la reproducción de un sonido monótono que permita a la persona aislarse del entorno acústico a su alrededor permitiendo aumentar su nivel de concentración.
Actualmente los sonidos disponibles son ruido rosa, ruido marrón, ruido blanco, océano, lluvia y arroyo.
Los sonidos de ruido blanco, marrón y rosa son útiles mientras se viaja en tren o avión ya que hacen las veces de un sistema de reducción de ruido.
Los sonidos de lluvia, arroyo y océano permiten relajarse o concentrarse un poco más.
Para activar este servicio primero debemos ir a los ajustes de accesibilidad de nuestro Mac. Para ello debemos abrir los Ajustes del sistema y buscar la categoría de accesibilidad.
También podemos ir a esta sección abriendo el panel de funciones rápidas de accesibilidad pulsando las teclas Opcion+Comando+F5 y pulsando el botón de Ajustes.
Una vez abierto el panel de configuración de accesibilidad debemos pulsar el botón de Audio dentro del apartado Audición.
En esta configuración encontraremos el apartado de Sonidos de fondo donde podremos activar o desactivar este servicio, seleccionar qué sonido se utilizará y el volumen con el que se reproducirá el sonido de fondo.