Addaw, ir a inicio Donar

Cómo crear un buen texto alternativo

Escrito por David Prieto González Agosto 14, 2022

Cuando el texto alternativo se coloca bien, mejora tanto la accesibilidad de su sitio web como el posicionamiento de la pagina, además, los usuarios que no puedan ver las imágenes y usen lectores de pantalla tendrán una mejor comprensión del contenido de la web y navegarán mucho mjor por ella. Así mismo, cuando un motor de búsqueda escanea la web podrá leer e indexar el texto alternativo, lo que mejorará su clasificación de búsqueda.

Pero, ¿cómo se escribe bien el texto alternativo? En esta entrada os dejamos los errores más comunes que se comenten a la hora de colocar este texto.

1. Usar la palabra “imagen”

Uno de los errores más comunes es usar la palabra 'imagen de' o 'gráfico de' en el texto alternativo antes de describir una imagen. Los lectores de pantalla ya identifican que es una imágen y se lo dicen al usuario, no es necesario que lo hagamos nosotros, es redudante y molesto. Están programados para reconocer una imagen en la pantalla de una computadora y dirán 'imagen' o 'gráfico', dejándonos la descripción a nosotros.

Es importante comprender que el texto alternativo debe servir para que la persona que no puede ver la imagen entieda qué es lo que hay ahí, por tanto intenta ser claro y conciso con la descripción.

A veces es apropiado indicar el tipo de imagen, pero solo si es necesario para describir la imagen con precisión. Por ejemplo, la imagen de un gatito jugando con un ovillo podría ser una ilustración o un dibujo, en cuyo caso el texto alternativo podría decir: “Gatito jugando con un ovillo. Ilustración'. Los diagramas, gráficos y gráficos circulares son otros ejemplos de tipos específicos de imágenes donde lo que son puede ser información crucial para el usuario final.

 

2. No colocar el texto contenido en una imagen

El texto dentro de una imagen debe estar descrito en el texto alternativo. Los anuncios a menudo contienen texto que describe el producto, este texto es fundamental para comprender el contenido de la imagen, por tanto no debemos olvidar colocar este texto en el alt. Para imágenes con mucho texto o imágenes más complejas como diagramas o gráficos puede ser necesario incluir una descripción larga adicional fuera del atributo alt de la imagen, para esto usaremos el atributo longdesc.

 

3. Incluir texto alternativo para imágenes o elementos decorativos

Los elementos decorativos, como divisores o elementos de diseño que no brindan contexto o contenido adicional, no necesitan texto alternativo. Tienen poco sentido, o son innecesarios, cuando se leen con un lector de pantalla. Piensa el propósito de tu gráfico y si el texto alternativo proporcionará alguna información, beneficio o complementará de alguna forma lo que esta leyendo el lector.

Un ejemplo claro es el de la imágen de un teléfono que tiene junto a la imágen el texto «teléfono» ,y junto a este texto, el teléfono en sí. Describir la imágen en el alt será redundante y molesto para una persona, pues le leerá varias veces la palabra imagen.

Cuando una imagen es meramente decorativa y no aporta información al usuario es mucho mejor no tratar de describir la imagen. Por ejemplo, si tenemos un artículo sobre nuevas tecnologías y la imagen es un monton de 0 y 1 al estilo 'Matrix', esta imágen no debería tener texto alternativo pues en realidad colocar este texto no aportará nada a la persona que visita la web. Recordemos que debemos pensar que lo que hagamos debe ser útil.

Pero recuerda, el hecho de que una imagen no necesite texto alternativo no significa que puedas ignorarla. Indica a la tecnología de asistencia que omita las imágenes con un atributo alt nulo (alt='') o usando list-style-image.

 

4. Repetir el mismo texto tanto en el pie de foto como en el texto alternativo

Mientras que el texto alternativo es adecuado para proporcionar una breve descripción de una imagen, los subtítulos pueden ser útiles para descripciones más largas, imágenes complejas y galerías de fotos. A veces, a una imagen le va bien que tenga tanto alt como subtitulo, pero nunca deben ser identicos: lo ideal es que sean complementarios. Los lectores de pantalla leerán tanto el alt como el subtitulo y, si son identicos, quedará repetitivo y la experiencia en la página se resentirá.

Lo normal es que el pie de foto no describa el contenido de la imagen a la que acompaña (pues estos pies de foto los leerán personas videntes), por tanto, en el alt deberíamos de colocar la descripción pura de lo que se ve en la foto y, en el pie, el texto que complementaría dicha foto. Lo más fácil es que nos hagamos esta pregunta: ¿si cerrase los ojos y una maquina me leyese tanto el alt como el pie, tendría la misma información que si abriese los ojos y viese la imagen y leyese el pie?

 

5. Usar el 'logotipo de la empresa' como texto alternativo

Este es muy concreto, pero es tan común que necesita ser mencionado. Siempre que aparezca el logotipo de su empresa en su sitio web, este debe incluir el nombre de la empresa dentro del texto alternativo. Escribir 'logotipo de la empresa' en el alt es genérico y poco descriptivo cuando se accede a ella con un lector de pantalla. En caso de que el logotipo sea un enlace a la página de inicio (algo muy común), deberíamos colocar en el alt el destino del enlace, por ejemplo ADDAW, ir a inicio.

 

6. No utilizar un lenguaje sencillo

¿Por qué decir 'utilizar' cuando puedes decir 'usar'? El uso de un lenguaje sencillo proporciona un nivel de precisión y accesibilidad que resulta útil para muchas personas. Además, si el texto no es complejo, científico o para un público especializado (como en una revista médica), no tiene ningún valor hacer que el texto alternativo de esa información sea más pesado o más complicado de lo que debería ser.

 

7. No utilizar la ortografía o los signos de puntuación adecuados

Es muy común que los textos alternativos no tengan ningún signo de puntuación, pero la puntuación importa. La inclusión de puntos y comas permite que un lector de pantalla lea de una manera que suene más natural, proporcionando pausas apropiadas para separar ideas, párrafos u otro contenido. Lo mismo ocurre con la ortografía: las palabras mal escritas no se leerán correctamente e incluso pueden tener un significado diferente. Así como tienes cuidado es escribir contenido con la ortografía y la puntuación correctas, deberías hacer lo mismo con el texto alternativo.

 

8. Nunca revisar o actualizar el texto

Cada vez que se revisa el contenido en pantalla, se debe revisar el texto alternativo. Cuando se actualizó el mensaje del banner de la última campaña, ¿se actualizó el texto alternativo o está brindando información anticuada a algunos de sus usuarios? Cuando la empresa cambió de marca o pasó por un rediseño, ¿se actualizaron los textos alternativos para mantenerlos al día? Es fundamental para su mensaje y su reputación que el texto alternativo se mantenga actualizado.

 

ADDAW existe para ayudar, así que si tienes dudas sobre qué texto alternativo poner en una imágen, no dudes en contactar con nosotros

¿Te gusta lo que ves? Compártelo con un amigo.


David Prieto González

Ingeniero informático especializado en dirección de proyectos y accesibilidad Web. Hay quien dice que el camino del desarrollo es muy duro, pues tienes que estar continuamente renovándote y actualizándote. Sin embargo, si realmente te gusta lo que haces, este camino será agradable... y a mí me encanta.


Financiado por la unión europea Gobierno de españa red.es Plan de recuperación transformación y resilencia kit digital