Presentación del curso en vídeo

0:00 Te damos la bienvenida

Te damos la bienvenida a Imágenes y texto alternativo, el segundo curso del nivel 2 de la certificación de accesibilidad digital de ADDAW. Aprenderás a dar a cada imagen la alternativa que necesita. Ni más, ni menos. Es un curso para diseño, redacción, desarrollo y gestión de contenidos.

0:17 Cada imagen tiene una función

Lo primero es preguntarse qué hace la imagen en la página. No qué se ve, sino para qué está. Puede ser decorativa, informativa, funcional, compleja… o texto en imagen. Y el contexto decide: la misma foto del ayuntamiento es decoración en la cabecera, e información en una noticia. Lo exige el criterio 1.1.1, Contenido no textual, de nivel A.

0:45 Escribir un buen alt

Un buen texto alternativo responde a una pregunta: ¿qué perdería quien no ve la imagen? Piensa en la función antes que en la apariencia. Escribe una frase, sin empezar por «imagen de». Y nada de palabras clave ni nombres de fichero. Si no, esto es lo que se oye: «IMG_0347.jpg, imagen.» En una tienda, mucho mejor así: «Zapatilla azul marino con suela blanca, imagen.»

1:16 Describir con criterio

Algunas imágenes piden más criterio, porque aquí no hay recetas cerradas. Pon siempre lo esencial primero, porque el texto alternativo se oye en orden. En las fotos de personas, menciona rasgos como la edad o el origen solo si importan al mensaje. Y en un producto, cuenta el color, el material y el texto impreso.

1:36 Enlaces, botones y galerías

Cuando una imagen y su titular comparten enlace, la imagen lleva el alt vacío para no repetir. Si la imagen está sola en un enlace o en un botón, su texto dice el destino o la acción. Y cinco estrellas de valoración necesitan un solo texto: «4 de 5 estrellas.» Y no cinco veces «estrella».

1:59 Texto en imágenes y fondos CSS

El texto dentro de una imagen se pixela con el zoom, no se traduce y no se puede buscar. Y el alt no arregla ni el zoom ni la traducción: es un parche, no una solución. Así que, si publicas el cartel de las fiestas, publica también el programa en texto real. Y usa las imágenes de fondo con CSS solo para decorar.

2:21 Imágenes complejas

Un gráfico, una infografía o un mapa no caben en una frase. Su alternativa tiene dos partes: un alt breve que identifica la imagen, y una descripción larga, visible en la página. Por ejemplo, para un gráfico sobre la evolución del paro, lo mejor es acompañarlo de una tabla con los datos. Así, quien no ve el gráfico tiene exactamente la misma información.

2:47 Iconos, emojis, SVG y CAPTCHA

Los iconos, los emojis y los gráficos SVG siguen la misma lógica. Si un icono decora, se oculta. Si es lo único que hay en un botón, el botón necesita un nombre, como «Buscar». Y mejor sin CAPTCHA: un campo trampa invisible frena el correo basura sin crear barreras.

3:06 El alt en el día a día

Para que todo esto funcione, hay que organizarlo. Quien escribe el contenido escribe también el alt, porque sabe para qué está la imagen. El gestor de contenidos debe pedirlo siempre. Y si una herramienta de inteligencia artificial lo propone, una persona lo revisa antes de publicar. La máquina ayuda, pero no sabe para qué pusiste la imagen.

3:27 Por qué importa

Piensa en Lucía. Es ciega y compra por internet con su lector de pantalla. Sin un buen alt, no sabe qué compra. Y quien tiene baja visión necesita texto real para ampliarlo. Lo exigen el Real Decreto 1112 de 2018 y la Ley 11 de 2023. Y además, mejora el posicionamiento y el mantenimiento.

3:49 Qué sabrás hacer

Al terminar, sabrás clasificar cualquier imagen, escribir y revisar alternativas útiles, y organizar el trabajo de tu equipo para que cada imagen nazca accesible. Te esperan 8 lecciones, un caso práctico y una lista de comprobación. Empieza ya, y prueba cada idea en tu ordenador.