Cómo escribir un buen texto alternativo para imágenes

Para qué sirve el texto alternativo

El texto alternativo es la alternativa textual de una imagen y se escribe en el atributo alt. Los lectores de pantalla lo leen en voz alta, las líneas braille lo muestran y el navegador lo enseña cuando la imagen no carga. Los buscadores también pueden usarlo. El estándar web de accesibilidad, las WCAG, pide una alternativa textual que cumpla la misma función que la imagen (criterio de conformidad 1.1.1, nivel A).

La idea clave: el texto alt no es un pie de foto ni una descripción de la imagen por sí misma. Dice qué aporta la imagen a la página. La misma foto puede necesitar textos alt distintos en dos páginas, o ninguno.

Cuatro tipos de imágenes

• Las imágenes informativas aportan significado: una foto, un icono junto a un número de teléfono, un diagrama. Escribe un texto alt breve que transmita ese significado.
• Las imágenes funcionales están dentro de enlaces y botones. El texto alt nombra la acción o el destino, no la imagen: «Buscar» para una lupa, «Imprimir esta página» para un icono de impresora.
• Las imágenes decorativas no aportan nada: un borde, un espaciador, un adorno o una imagen que solo repite el texto de al lado. Dales un atributo alt vacío (alt="") para que los lectores de pantalla las salten, o ponlas en la hoja de estilos como fondo.
• Las imágenes de texto son el último recurso. Si necesitas una, el texto alt repite las palabras de la imagen. Un logotipo que no es un enlace lleva el nombre de la organización.

Cómo escribir un buen texto alt

1. 1Pregúntate por qué está la imagen en la página. ¿Qué echaría en falta un visitante si no estuviera?
2. 2Escribe lo que importa para esa finalidad, en una expresión o en una frase.
3. 3Empieza por el contenido. Un lector de pantalla suele anunciar que algo es una imagen, así que «imagen de» o «foto de» rara vez ayuda.
4. 4No repitas lo que ya dice el texto junto a la imagen. Si lo dice todo, la imagen es decorativa y lleva un alt vacío.
5. 5Lee el texto alt en voz alta sin mirar la página. ¿Tiene sentido por sí solo?

Errores habituales

• Ningún atributo alt. Algunos lectores de pantalla leen entonces el nombre del archivo.
• Un nombre de archivo o un código como texto alt, por ejemplo «IMG_2041.jpg».
• La misma ristra de palabras clave en muchas imágenes. El texto alt es ante todo para personas.
• Una descripción larga de una imagen puramente decorativa.
• Describir el aspecto de un botón con imagen en lugar de su acción. Un botón de búsqueda no es «lupa», es «Buscar».

¿Qué longitud debe tener?

El criterio 1.1.1 de las WCAG no fija un número de caracteres. El W3C aconseja que sea breve, idealmente una expresión o una frase. Para gráficos y otras imágenes complejas, da la información completa como texto en la página y mantén breve el texto alt. Si necesitas más de una frase, probablemente la imagen contiene información que corresponde al texto de la página.

Revisa tu sitio

Para encontrar imágenes sin un texto alt útil, pasa el Comprobador de texto alternativo gratuito por una página. Para obtener propuestas para muchas imágenes, usa la herramienta Textos alternativos. Una propuesta automática puede pasar por alto lo que importa en tu página, así que lee cada texto y cámbialo cuando no encaje con la finalidad de la imagen.

Las herramientas de Do4U te ayudan a escribir, no a decidir: si una imagen es informativa, funcional o decorativa lo sabes tú mejor que nadie. Vuelve a revisarlo después de cambios grandes en tu sitio.