Cómo escribir buenos textos alternativos
Los textos alternativos hacen que las imágenes sean accesibles para las personas que no pueden verlas. Aquí aprenderás las reglas, verás ejemplos y descubrirás cuándo un texto alternativo vacío es la elección correcta.
Para qué sirven los textos alternativos
Un texto alternativo (alt) es el equivalente textual de una imagen. Se escribe en el atributo HTML alt del elemento img y se hace visible cuando la propia imagen no está disponible, y audible cuando alguien no puede verla.
- Lectores de pantalla: las personas ciegas o con baja visión grave escuchan las páginas web en voz alta. Sin texto alternativo solo oyen el nombre del archivo o la palabra «gráfico»: la información de la imagen se pierde.
- Imágenes desactivadas o sin cargar: con conexiones lentas, errores de carga o imágenes desactivadas, el navegador muestra el texto alternativo.
- El SEO como efecto secundario: los buscadores utilizan los textos alternativos para entender el contenido de las imágenes. Es un bonus bienvenido, pero no el objetivo. Quien rellena los textos alternativos de palabras clave perjudica a las personas para las que realmente están pensados.
Los textos alternativos son, además, una de las exigencias más antiguas de la accesibilidad: el criterio de éxito 1.1.1 «Contenido no textual» pertenece al nivel de conformidad A, el más básico de las WCAG. Aun así, su ausencia figura desde hace años entre los errores más frecuentes de la web.
Las reglas básicas
La función antes que la descripción
Pregúntate primero: ¿qué papel cumple la imagen en este lugar? Un buen texto alternativo transmite la información o la función de la imagen, no cada detalle visible. La foto de la dirección de la empresa en una nota de prensa necesita nombres y contexto, no una descripción del color de las corbatas.
El contexto decide
La misma imagen puede necesitar textos alternativos completamente distintos según dónde aparezca. Una foto de un manzano significa una cosa en un blog de jardinería («Manzano joven de la variedad Elstar con tutor de madera») y otra muy distinta en la página de equipo de una explotación frutícola («Nuestra plantación durante la cosecha de otoño»). Escribe siempre el texto alternativo para la página concreta, nunca «en reserva» para la imagen en sí.
Longitud: breve, pero completo
Como regla general funcionan bien entre 80 y 125 caracteres: una o dos frases concisas. No es un límite técnico, sino una cuestión de consideración: los lectores de pantalla leen el texto alternativo de una sola vez, sin la posibilidad de hacer pausas que ofrece el texto corrido. Lo que necesite más espacio pertenece a una descripción larga (ver más abajo).
Nada de «imagen de…»
Los lectores de pantalla ya anuncian las imágenes como gráficos. Fórmulas como «imagen de», «la foto muestra» o «gráfico:» resultan, por tanto, redundantes. Excepción: si el tipo de representación es relevante en sí mismo («óleo», «radiografía», «captura de pantalla»), sí puede incluirse.
Ejemplos buenos y malos
| Situación | Mal | Bien |
|---|---|---|
| Foto de producto en la tienda online | «IMG_4823.jpg» o «zapato» | «Bota de senderismo azul con forro de membrana, vista lateral» |
| Foto de equipo en la página «Quiénes somos» | «Imagen de nuestro equipo» | «El equipo de doce personas delante de la sede de la empresa en Valencia» |
| Diagrama en el informe anual | «Diagrama» | «Gráfico de barras: la facturación creció un 18 por ciento en 2025, hasta 2,4 millones de euros» |
| Icono de lupa como botón de búsqueda | «Lupa» | «Buscar» |
| Motivo de olas decorativo como separador | «Motivo de olas azul como separador decorativo de página» | Texto alternativo vacío: alt="" |
Imágenes decorativas: alt vacío en lugar de omitirlo
No todas las imágenes aportan información. Marcos ornamentales, patrones de fondo, fotos simbólicas que solo crean ambiente sin relación con el contenido: todo eso puede saltárselo por completo un lector de pantalla. Para ello, la imagen recibe un atributo alt vacío: alt="".
Importante: un alt="" vacío es algo completamente distinto de un atributo alt ausente. Si el atributo falta del todo, muchos lectores de pantalla leen en su lugar el nombre del archivo: «DSC-cero-cero-cuatro-siete-guion-bajo-final-v2-punto-jpg». El atributo vacío, en cambio, dice expresamente: «Esta imagen puedes ignorarla».
En caso de duda ayuda una prueba sencilla: ¿le faltaría información a la página si la imagen desapareciera? Si la respuesta es no, es decorativa.
Imágenes con enlace: describe el destino
Si una imagen es a la vez un enlace, la tarea del texto alternativo cambia: debe describir adónde lleva el enlace o qué acción desencadena, no lo que se ve. Un logotipo enlazado en la cabecera recibe, por tanto, «Ir a la página de inicio» o el nombre de la empresa, no «logotipo con ola azul». Una imagen en miniatura que lleva a un artículo lleva como texto alternativo el título del artículo. Y si junto a la imagen ya hay un enlace de texto con el mismo destino, la imagen del enlace puede llevar alt="" para que quienes usan lector de pantalla no escuchen el enlace dos veces.
Gráficos complejos y diagramas
Las infografías, los diagramas, los organigramas o los mapas no caben en 125 caracteres. Aquí se aplica un procedimiento en dos niveles:
- Texto alternativo breve con el tema y el mensaje principal: «Gráfico de líneas: las visitas se triplicaron entre 2023 y 2026».
- Descripción larga con todos los datos relevantes: idealmente como texto normal justo debajo del gráfico, como bloque desplegable o como tabla de datos. De ella se benefician, por cierto, todas las personas, no solo quienes usan lector de pantalla.
Ofrecer los datos de un diagrama como tabla HTML suele ser la solución más limpia: las tablas permiten a los lectores de pantalla una navegación precisa; un bloque de texto leído de corrido, no.
Logotipos, iconos y texto dentro de imágenes
- Logotipos: el texto alternativo es el nombre de la empresa o del producto —«Wave Tools», no «logotipo»—. La palabra «logotipo» puede añadirse si ayuda a situarse.
- Iconos con función: describe la acción («Abrir el menú», «Cesta de la compra»), no el símbolo («tres rayas», «carrito»).
- Iconos junto a texto: si la etiqueta ya está al lado, el icono es decorativo:
alt="". - Texto dentro de la imagen: como principio, el texto debe estar en la página como texto real, no dentro de gráficos. Si no se puede evitar (por ejemplo, en el cartel de un evento), el texto completo debe figurar en el texto alternativo o en una descripción larga: palabra por palabra, no resumido a grandes rasgos.
Textos alternativos en WordPress
WordPress ofrece campos para los textos alternativos en dos lugares:
- Biblioteca de medios: cada imagen tiene allí un campo «Texto alternativo». Lo que escribas ahí se toma como valor por defecto cuando insertas la imagen de nuevo en un contenido. Las imágenes ya insertadas no cambian de forma retroactiva.
- Editor de bloques: en el bloque de imagen puedes ajustar el texto alternativo en los ajustes del bloque, bajo «Texto alternativo», para cada uso concreto: justo lo adecuado, porque el contexto decide. El valor del bloque prevalece sobre el de la biblioteca de medios.
Para las imágenes decorativas, simplemente deja el campo vacío en WordPress: el editor de bloques escribirá entonces correctamente alt="" en el HTML. La leyenda de la imagen (caption), por cierto, no sustituye al texto alternativo: se muestra a todo el mundo y cumple otra función.
Cómo puede ayudar la IA y dónde están sus límites
La IA de imágenes actual describe las fotos con una precisión sorprendente y es una ayuda real cuando hay cientos de imágenes sin texto alternativo en la biblioteca de medios. Reconoce motivos, número de personas, ambiente e incluso, a menudo, el texto dentro de la imagen, y entrega en segundos un borrador utilizable.
Lo que la IA no puede leer en la imagen es el contexto: ve «mujer con portátil en una oficina luminosa», pero no sabe que se trata de tu nueva directora general y que la imagen ilustra su presentación. Tampoco reconoce si una imagen es decorativa en esta página concreta o si, al ser un enlace, debería describir el destino.
Consejo práctico: usa la IA como primer borrador, no como resultado final. Revisa cada texto alternativo generado y completa lo que solo tú sabes: nombres, ocasiones, denominaciones de producto, la función de la imagen en la página. Así combinas la velocidad de la máquina con el conocimiento de la persona.
La mejor forma de comprobar si tus textos alternativos funcionan en la práctica es una pasada con lector de pantalla y herramientas de comprobación automáticas: cómo hacerlo te lo enseña nuestra guía Cómo probar la accesibilidad de tu web.
Wave Access genera textos alternativos asistidos por IA directamente en WordPress: para las nuevas subidas y para toda la biblioteca de medios, contigo como última instancia.
Descubre Wave Access →