El Alt Text, también conocido como Texto Alternativo, es un atributo de HTML utilizado en las etiquetas de imagen (<img>) para describir el contenido visual de una imagen. Este texto no se muestra directamente en la página web a los usuarios (a menos que la imagen no se cargue), pero es fundamental por varias razones que van más allá de la apariencia del sitio.
Desde la perspectiva del SEO, la accesibilidad y la usabilidad, el Alt Text desempeña un rol crucial.
¿Qué es el Alt Text?
El Alt Text es un atributo que proporciona una descripción textual de una imagen cuando esta no se puede cargar correctamente, o cuando los usuarios están utilizando tecnologías de asistencia, como los lectores de pantalla. Se añade dentro de la etiqueta de imagen en HTML, de la siguiente manera:
<img src="imagen-ejemplo.jpg" alt="Descripción de la imagen">Si por alguna razón la imagen no se carga (debido a una conexión lenta o un error de archivo), el navegador mostrará el Alt Text en su lugar. Además, este texto es leído en voz alta por los lectores de pantalla para las personas con discapacidades visuales, lo que les permite entender el contenido de la imagen.
Importancia del Alt Text en SEO
El Alt Text tiene un impacto directo en el SEO, ya que los motores de búsqueda, como Google, no pueden «ver» las imágenes como lo hace un ser humano. En su lugar, confían en el Texto Alternativo para comprender el contenido de las imágenes y determinar su relevancia para una búsqueda específica. Aquí hay algunas razones clave por las cuales el Alt Text es vital para una estrategia SEO efectiva:
Mejora la accesibilidad del sitio web
Uno de los principales objetivos del Alt Text es mejorar la accesibilidad del sitio web. Los lectores de pantalla utilizan el Texto Alternativo para describir las imágenes a las personas con discapacidades visuales. Tener un Alt Text bien redactado garantiza que el contenido sea accesible para todos los usuarios, independientemente de sus habilidades, y además, contribuye a cumplir con las normas de accesibilidad web como las directrices de accesibilidad WCAG (Web Content Accessibility Guidelines).
Optimización para la búsqueda de imágenes
El Alt Text es crucial para la optimización de imágenes en los motores de búsqueda. Google Imágenes, por ejemplo, utiliza el Alt Text como uno de los factores para entender de qué trata una imagen y si debe mostrarla en sus resultados. Una imagen optimizada con un Texto Alternativo relevante tiene más posibilidades de aparecer en los resultados de búsqueda de imágenes, lo que puede generar tráfico adicional hacia el sitio web.
Refuerza el contexto semántico del contenido
Además de ayudar con la indexación de las imágenes, el Alt Text proporciona contexto adicional al contenido general de la página. Cuando el Texto Alternativo está alineado con el tema general de la página y las palabras clave relevantes, los motores de búsqueda pueden identificar mejor la relevancia de la página para ciertas consultas de búsqueda.
Mejora la experiencia de usuario
Si una imagen no se carga debido a problemas técnicos o de conexión, el Alt Text proporciona una alternativa útil al usuario, permitiendo que entienda qué imagen debía aparecer en ese lugar. Esto mejora la experiencia de usuario y puede reducir el impacto negativo de los problemas de carga de imágenes en la percepción del sitio.
Ayuda con la comprensión del contenido visual
Algunas imágenes no tienen un propósito meramente estético, sino que comunican información crítica (por ejemplo, gráficos, tablas, diagramas). El Alt Text asegura que esta información se mantenga accesible y comprensible, incluso si la imagen no se carga.
Buenas prácticas para escribir Alt Text optimizado
Redactar un Alt Text efectivo y optimizado no es solo cuestión de describir lo que ves. Hay que hacerlo con estrategia. Aquí tienes algunas recomendaciones para crear un Alt Text que cumpla con sus objetivos de SEO, accesibilidad y experiencia de usuario:
Sé descriptivo y preciso
El Alt Text debe describir de manera clara y precisa lo que se muestra en la imagen. Imagina que estás describiendo la imagen a alguien que no puede verla. Evita ser vago o utilizar palabras irrelevantes.
Mala práctica:
<img src="coche.jpg" alt="coche">Buena práctica:
<img src="coche-deportivo-rojo.jpg" alt="Coche deportivo rojo en una carretera montañosa">Incorpora palabras clave, pero de manera natural
Es una buena idea incluir palabras clave relevantes en el Alt Text para ayudar con el SEO, pero solo si encajan naturalmente en la descripción. El uso forzado de palabras clave, o el llamado keyword stuffing, puede perjudicar más que ayudar.
Mala práctica:
<img src="camiseta.jpg" alt="camiseta barata, comprar camiseta barata, tienda de camisetas">Buena práctica:
<img src="camiseta.jpg" alt="Camiseta blanca de algodón con diseño de montañas">No uses “imagen de” o “foto de”
El Alt Text debe describir el contenido de la imagen, no su tipo. Los motores de búsqueda ya saben que es una imagen, por lo que no es necesario comenzar con frases como «imagen de» o «foto de». Ve directo al contenido.
Mala práctica:
<img src="parque.jpg" alt="Imagen de un parque con árboles">Buena práctica:
<img src="parque.jpg" alt="Parque con grandes árboles y bancos de madera">No dejes el Alt Text vacío para imágenes informativas
Para imágenes que contienen información esencial, como gráficos o infografías, siempre debes incluir un Alt Text que describa la información clave que se muestra. Sin embargo, para imágenes decorativas o de relleno que no aportan contenido relevante, puedes dejar el atributo alt="" para que los lectores de pantalla lo ignoren.
Mantén el Alt Text conciso
Es recomendable que el Alt Text no sea excesivamente largo. La mayoría de los motores de búsqueda y tecnologías de asistencia prefieren textos alternativos de menos de 125 caracteres. Describe lo esencial de la imagen sin agregar detalles innecesarios.
Usar el Alt Text como texto ancla si la imagen es un enlace
Si la imagen actúa como un enlace en tu sitio web, es importante que el Alt Text describa claramente el destino del enlace, similar a cómo lo harías con un texto ancla en un enlace de texto. Esto no solo ayuda a los usuarios que dependen de lectores de pantalla, sino también a los motores de búsqueda a entender el propósito del enlace.
Por ejemplo, si una imagen enlaza a una página de productos específicos, el Alt Text debería describir lo que los usuarios encontrarán al hacer clic en la imagen.
Mala práctica:
<a href="https://www.ejemplo.com/productos">
<img src="productos.jpg" alt="imagen de productos">
</a>Buena práctica:
<a href="https://www.ejemplo.com/productos">
<img src="productos.jpg" alt="Explora nuestros productos más vendidos">
</a>