Alt text

De esto se trata el Alt text o texto alternativo también es conocido en inglés como “alt attributes” o “alt descriptions”.

¿Qué es Alt Text?

Es la manera de agregar texto por medio de un código de HTML a las imágenes que se encuentran en una página web o incluso en correos electrónicos de la empresa.

Es el texto en código que aparece cuando no carga adecuadamente o que permite conocer una breve descripción textual sobre una pieza gráfica.

La manera más adecuada de generar alt text para las imágenes publicadas en un sitio web es que sea lo suficientemente descriptivo evitando keywords innecesarias o exageradas, por lo que es importante consolidar frases que brinden un buen contexto de la imagen que facilite a los rastreadores de los motores de búsqueda indexar la imagen satisfactoriamente.

¿Para qué sirve Alt Text?

El texto alternativo o “alt text” de las imágenes es una descripción textual de una imagen que se muestra en una página web. Sirve para ayudar a las personas que utilizan lectores de pantalla o que tienen discapacidad visual a entender el contenido de la imagen. Además, el texto alternativo también es utilizado por los motores de búsqueda para entender el contenido de una página web, lo que puede mejorar el posicionamiento en los resultados de búsqueda.

El alt text debe ser breve y descriptivo, y debe reflejar el contenido de la imagen. Idealmente, debe ser informativo y relevante para el contexto de la página. El uso adecuado del texto alternativo no solo mejora la accesibilidad de su sitio web, sino que también puede mejorar la experiencia del usuario y la optimización de motores de búsqueda.

Importancia del Alt Text en la accesibilidad Web

El Alt text desempeña un papel crucial no solo en la optimización de motores de búsqueda (SEO) sino también en la accesibilidad web. Esta función tiene una relevancia particular cuando se consideran las leyes y regulaciones de accesibilidad web, como la Ley para Americanos con Discapacidades (ADA) en Estados Unidos.

1. Facilita la Navegación para Usuarios con Discapacidad Visual:

• El Alt text es esencial para los usuarios que dependen de lectores de pantalla para navegar por Internet. Estos dispositivos leen en voz alta el texto alternativo de las imágenes, proporcionando un contexto y una descripción de lo que no pueden ver.

2. Cumplimiento de Normativas de Accesibilidad:

• En varios países, existen leyes que exigen que el contenido web sea accesible para las personas con discapacidades. En EE. UU., la ADA requiere que todos los espacios públicos digitales, incluidos los sitios web, sean accesibles. El uso adecuado del Alt text en imágenes es un aspecto fundamental para cumplir con estas regulaciones.

Alt Text y la Ley ADA

1. ADA y el Acceso Digital:

• La ADA se amplió para incluir el acceso digital, lo que significa que los sitios web deben ser accesibles para personas con diversas discapacidades, incluidas las visuales. Si bien la ADA no especifica directamente el uso de Alt text, se interpreta que las imágenes accesibles son parte de un sitio web accesible.

2. Riesgos de Incumplimiento:

• No cumplir con las pautas de accesibilidad, incluido el uso inadecuado del Alt text, puede llevar a litigios y multas. Los sitios web que no son accesibles se exponen a demandas por discriminación contra personas con discapacidades.

Mejores Prácticas para Alt Text y Accesibilidad

1. Descriptivo y Conciso:

• El Alt text debe ser breve y describir de manera efectiva el contenido y la función de las imágenes en el sitio web. Esto es esencial para los usuarios de lectores de pantalla.

2. Evitar el Relleno de Palabras Clave:

• Si bien es tentador usar Alt text para mejorar el SEO mediante la inclusión de palabras clave, esto puede deteriorar la experiencia del usuario con discapacidad visual. El objetivo principal del Alt text debe ser la accesibilidad, no el SEO.

3. Inclusión de Texto Alternativo en Todas las Imágenes Relevantes:

• Todas las imágenes que transmiten información esencial deben tener Alt text. Esto incluye gráficos, fotografías que ilustran un contenido y cualquier imagen que aporte al contexto.

4. Uso de Alt Text en Botones y Enlaces:

• Los botones gráficos y los enlaces también deben tener Alt text para describir su función, lo cual es crucial para la navegación accesible.

Alt text y SEO

Parece increíble pero es cierto que el alt text contribuye en buena medida al crecimiento SEO del sitio web. El Alt Text de las imágenes permite identificar palabras clave (keywords) que ayuda a los motores de búsqueda a rastrear y clasificar mejor la página web.

El uso de keywords en imágenes con alt text hacen que el algoritmo de Google pueda leer el contenido, sin esto, Google solo lo verá en pixeles, por lo que no brinda mayor información para el posicionamiento orgánico.

Qué tan importante es el Alt text

Junto con implementar las mejores prácticas para el título y el nombre de archivo de las imágenes, incluir texto alternativo asegura que todos los usuarios y bots puedan entender el contenido de su sitio web.

El texto alternativo le ofrece otra oportunidad para incluir su palabra clave objetivo. Dado que el uso de palabras clave en la página sigue siendo un factor importante para el ranking de los motores de búsqueda, es en su mejor interés crear un texto alternativo que describa la imagen y, si es posible, incluya una palabra clave o frase clave que esté apuntando.

Además, si el tráfico de la búsqueda de imágenes es una parte importante de su estrategia de SEO, dar a Google la información correcta sobre sus imágenes es una buena manera de comunicar la relevancia del tema. Puede hacer esto utilizando los formatos de archivo modernos, el texto alternativo, los nombres de archivo relevantes y el marcado de esquema de manera correcta.

El Alt text óptimo

El mejor formato para el texto alternativo es suficientemente descriptivo pero no contiene ningún intento spam de relleno de palabras clave. Si puede cerrar los ojos, tener a alguien que lea el texto alternativo y visualizar una versión razonablemente precisa de la imagen, está en el camino correcto.

Diferencia entre Alt text y título de imagen

La confusión entre el Alt text (texto alternativo) y los títulos de las imágenes es común, pero estos dos elementos sirven propósitos distintos en el diseño web y la accesibilidad.

Alt Text (Texto Alternativo)

1. Propósito Principal: El Alt text está diseñado para proporcionar una descripción textual de una imagen en casos donde la imagen no puede ser vista por el usuario, ya sea por problemas de carga, por uso de lectores de pantalla por personas con discapacidades visuales, o porque las imágenes están desactivadas en la configuración del navegador.
2. Importancia en la Accesibilidad: El Alt text es crucial para la accesibilidad web. Ayuda a los usuarios con discapacidad visual a comprender el contenido de una imagen a través de lectores de pantalla.
3. Importancia en SEO: Ayuda a los motores de búsqueda a entender el contenido de una imagen, lo que es relevante para el SEO. Una imagen con Alt text adecuado puede ser indexada correctamente, lo que mejora la visibilidad del sitio en los resultados de búsqueda.
4. Descripción: Debe ser conciso y descriptivo, proporcionando suficiente contexto que permita a los usuarios entender lo que la imagen representa, incluso si no pueden verla.

Títulos de Imágenes (Image Titles)

1. Propósito Principal: Los títulos de las imágenes se utilizan principalmente para proporcionar información adicional o contextual sobre una imagen. A menudo aparecen como un “tooltip” (texto emergente) cuando el cursor se mueve sobre la imagen.
2. No Esencial para la Accesibilidad: A diferencia del Alt text, los títulos de imágenes no son esenciales para la accesibilidad y, por lo general, no se leen en voz alta por los lectores de pantalla.
3. Menos Relevancia en SEO: Los títulos de las imágenes tienen menos impacto en el SEO que el Alt text. Son más útiles para mejorar la experiencia del usuario al proporcionar información adicional.
4. Descripción: Puede ser más largo que el Alt text y no necesita ser tan descriptivo de la imagen en sí, sino que puede agregar contexto o detalles adicionales.

Recomendaciones para uso de Alt text

Para sacarle todo el provecho a la utilización de Alt text en imágenes insertas en el sitio web o en campañas de email marketing, te recomendamos tener en cuenta los siguientes tips:

Longitud del texto

El texto alternativo o alt text siempre debe ser corto y no sobrepasar de 125 caracteres, es decir de 4 a 8 palabras máximo. De esta manera no será un factor distractor para quien se encuentra leyendo el contenido.

Así que busca las palabras indicadas que sean parte de un contenido amigable para una persona.

Usa palabras clave con moderación

Si bien el texto no debe ser largo, no descartes la posibilidad de poner allí alguna keyword que buscas posicionar en tu sitio web.

Pero hazlo de forma que describa bien la imagen y que el alt text tenga coherencia, cohesión e interés en el contenido que se presenta.

Trata de no enfocarte en solo poner keywords para posicionamiento SEO, pues puede pasar que Google lo identifique como SPAM.

Incluye texto que no forma parte de la imagen

Si la imagen es puramente decorativa y contiene una frase que es más relevante que la imagen por sí sola, puedes usar esa frase como alt text, siempre que cumpla con las características anteriores.

Si por el contrario, la imagen es más importante (aunque tenga una frase inserta) puedes usar el alt text para describir el contenido de la misma.

No repitas contenido en alt text

Si la imagen hace parte por ejemplo de un programa de eventos que ya se encuentra en tu página en el header o contiene el logotipo del evento y de la campaña como tal, no es necesario ubicar alt text repitiendo esa información.

Ejemplos de un buen Alt text

Veamos algunas maneras de aplicar correctamente el alt text en imágenes

alt text mas o menos bueno: <img src=”gallo.png” alt=”gallo”>

alt text mejorado: <img src=”gallo.png” alt=”gallo cacareando”>

alt text excelente: <img src=”gallo.png” alt=”gallo blanco de cresta roja cacareando”>

alt text mas o menos bueno: <img src=”escaleraelectrica.png” alt=”escalera electrica”>

alt text mejorado: <img src=”escaleraelectrica.png” alt=”personas en escalera electrica”>

alt text excelente: <img src=”escaleraelectrica.png” alt=”personas en escalera electrica en centro comercial”>

martes, 21 de marzo de 2023