Árbol de decisión para escribir un texto alternativo

Un texto alternativo es el texto que identifica a la imagen para las personas con problemas de visión que necesitan utilizar lectores de pantalla. Concretamente, estos lectores de pantalla, cuando ven una imagen, leen en voz alta su texto alternativo. 

Debemos tener siempre presente que el objetivo prioritario de este texto debe ser que estas personas puedan consumir el contenido en igualdad de condiciones con una persona que sí podría ver la imagen. Poniendo siempre en el centro la experiencia de usuario de este tipo de personas, concluiríamos que no siempre es útil para ellos que se les lea el texto, como por ejemplo el de una imagen que es meramente decorativa y cuya la lectura de texto alternativo no aportaría nada.

La W3C creó un árbol de decisión muy útil para saber cómo comportarse con el texto alternativo dependiendo de los tipos de imagen. En este artículo simplemente compartiremos la traducción de este árbol e incluiremos información que siempre es útil cuando se está pensando en qué texto alternativo poner.

• ¿La imagen contiene texto?
• Sí:
• … y el texto también está presente como texto real cerca.
• Se trata de una imagen decorativa, deja el texto alternativo vacío.
• … y el texto solo se muestra para efectos visuales.
• Se trata de una imagen decorativa, deja el texto alternativo vacío.
• … y el texto tiene una función específica, por ejemplo es un icono.
• Se trata de una imagen funcional. Utiliza el texto alternativo para comunicar la función o el propósito de la imagen.
• … y el texto de la imagen no está presente de otra manera.
• Se trata de una imagen de texto. Usa el texto alternativo para incluir el texto de la imagen. Este caso se da mucho, por ejemplo, en banners de rebajas. En este caso, el texto alternativo debe contener el contenido de la rebaja.
• No:
• Continúa.
• ¿La imagen se usa en un enlace o en un botón? ¿Sería difícil o imposible entender lo que hace el enlace o el botón si la imagen no estuviera allí?
• Sí:
• Se trata de una imagen funcional. Utilice el texto alternativo para comunicar el destino del enlace o la acción realizada. 
• No:
• Continúa.
• ¿La imagen aporta significado a la página o contexto actual?
• Sí:
• … y es un simple gráfico o fotografía.
• Se trata de una imagen informativa. Usa una breve descripción de la imagen de una manera que transmita ese significado en el atributo «alt».
• … y es un gráfico o información compleja.
• Se trata de una imagen compleja. Incluye la información contenida en la imagen en otra parte de la página.
• … y muestra contenido que es redundante con respecto al texto real cercano.
• Incluir un texto alternativo sería redundante y, por tanto molesto. Utilice un atributo «alt» vacío. 
• No:
• Continúa.
• ¿La imagen es puramente decorativa o no está destinada al usuario?
• Sí:
• Se trata de una imagen decorativa. Utiliza un atributo «alt» vacío. 
• No:
• Continúa.
• Si has llegado hasta aquí, debe de ser una imagen muy particular. Ten en cuenta que este pequeño árbol de decisión no aborda todas las casuísticas. Nuestro consejo es que, si solo pudieses escuchar lo que muestra la página, ¿qué tipo de texto alternativo necesitarías para entender la parte de la web donde está la imagen de una forma realmente útil? Esta es la pregunta clave y respondiendo a ella podrás saber qué hacer.

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.