Crear el texto alternativo adecuado

El formato más accesible para cualquier contenido de la web es el texto sin formato. El texto simple es increíblemente manejable, se puede modificar de forma que se adapte a casi cualquier discapacidad.Sin embargo, la mayoría de los sitios web no están formados por texto puro. Tenemos otros tipos de contenido que no son tan manejables, estas son las imágenes. Para hacer que estas formas alternativas de contenido sean más accesibles, debemos proporcionarles una alternativa eforma de texto.Para las imágenes, generalmente se proporciona usando el atributo alt . Como regla general, todas las imágenes deben tener un atributo alt . Esto, sin embargo, no significa que deba proporcionarse texto alternativo real a cada imagen.
Existen tres tipos de texto alternativo.

Definido : donde se proporciona texto descriptivo real en el atributo, por ejemplo, alt="un perro" . En este caso, un lector de pantalla leerá el texto proporcionado cuando el usuario se encuentre con la imagen, y generalmente le dará el contexto de que se trata de una imagen.

Nulo : donde el atributo está escrito pero se deja vacío, por ejemplo, alt="" . En este caso, un lector de pantalla omitirá la imagen por completo.

Invalido ( mala práctica ): donde el atributo se omite por completo. En este caso, un lector de pantalla leerá el valor del atributo src lugar. Hacer que esto suceda nunca es útil para el usuario

Formas de el texto alternativo 

• Como regla general, las imágenes de texto deben evitarse, con la única excepción de logos
• Las imágenes informativas son imágenes que, como la palabra dice, brindan cierta información

•  Para imágenes informativas, el texto alternativo debe transmitir la misma información que la imagen.

• Las imágenes funcionales son aquellas que representan una acción a tomar. A diferencia de las imágenes informativas, que proporcionan información puramente para el usuario, las imágenes funcionales que se utilizan transmiten algo accionable. Estas imágenes también suelen estar vinculadas a elementos interactivos como enlaces o botones. Para imágenes funcionales, el texto alternativo debe comunicar claramente la acción que se debe toma
• Las imágenes decorativas son imágenes que no transmiten ninguna información real / procesable al espectador. Su propósito es puramente estilístico
•  En estos casos, se debe proporcionar un atributo alt vacío. Esto permite que el lector de la pantalla simplemente salte la imagen
•  Las imágenes complejas, un tipo de imagen informativa, son aquellas que contienen una cantidad de información muy detallada y sustancial.  
• Por ejemplo, gráficos de barras o gráficos. Para estas imágenes, se sugiere que proporcionemos descripciones cortas y largas.
  La descripción breve debe proporcionarse a través del atributo alt.
  
  • La descripción larga se puede definir en algún otro elemento, y se hace referencia a ella simplemente utilizando los longdesc / aria-labelledby , o utilizando los elementos <figure> y <figcaption> .
   
 Hay casos en que se utiliza más de una imagen para transmitir una sola información. Por ejemplo, una calificación de 5 estrellas

Los mapas de imágenes son imágenes que están divididas en múltiples secciones, cada una con su propio área interactiva. Se crean al combinar los elementos <img> y <map> . Para este tipo de imágenes, se recomienda que se proporcione un atributo alt definido para el elemento <img> , así como para cada <area> individual.

 Como con todo, cuándo y qué alt usar también depende del contexto