Las imágenes hacen que su sitio web sea atractivo y visualmente atractivo. Sin embargo, si no optimiza sus imágenes con texto alternativo (también conocido como «texto alternativo» o «etiquetas alternativas»), perderá una oportunidad crucial para mejorar la experiencia del usuario y la accesibilidad del sitio web.
Para usarlos correctamente, es importante comprender primero qué son las etiquetas alt. En esta publicación, cubriremos qué son las etiquetas alt y por qué se usan. También explicaremos cómo agregar etiquetas alt a las imágenes en WordPress y presentaremos algunas de las mejores prácticas sobre cómo hacerlo.
¡Empecemos!
Suscríbete a nuestro canal de YouTube
¿Qué es una etiqueta alternativa?
Las etiquetas Alt se agregan a las imágenes HTML para describir su contenido y contexto en la página web. La etiqueta alt también aparece en el contenedor de la imagen cuando el archivo multimedia no se puede cargar o mostrar correctamente:
Las etiquetas alt ayudan a las personas que usan lectores de pantalla, como las personas con problemas de visión, a comprender qué hay en su sitio. Y lo que es más, Robots de motores de búsqueda utilícelos para interpretar las imágenes a medida que su sitio es rastreado, indexado y calificado.
Agregada en una etiqueta de imagen, una etiqueta alt de alta calidad es una breve descripción que explica no solo lo que representa la imagen, sino también su propósito en la página. Cuando se usa en HTML, la etiqueta de imagen completa se parece a esto:
<img src="motorcycle-sunset.png" alt="Man in black and red checkered shirt riding an orange motorcycle at sunset."/>
Las etiquetas alt de imagen a veces se confunden con títulos o leyendas de imágenes. Sin embargo, los títulos de las imágenes son un tipo diferente de atributo. Aparecen como texto emergente cuando la persona pasa el mouse sobre la imagen. Por otro lado, los subtítulos aparecen con la imagen, generalmente debajo de ella, y brindan información adicional o detalles sobre la misma. En circunstancias normales, los usuarios nunca verán las etiquetas alternativas de sus imágenes.
¿Por qué usar etiquetas Alt en las imágenes?
Las etiquetas alt sirven para muchos propósitos. Si bien no tiene que usarlos, vienen con grandes beneficios. Como los utilizan tanto los robots de los motores de búsqueda como las herramientas de lectura de pantalla, son un componente clave de la accesibilidad web y la optimización de motores de búsqueda (SEO).
Mejoran la disponibilidad de la red
Las etiquetas alt ayudan a garantizar que los visitantes puedan acceder y disfrutar del contenido de su sitio web, incluso cuando utilizan tecnología de asistencia o navegadores basados en texto. Cuando una persona con discapacidad visual visita su sitio web, su lector de pantalla leerá su texto en la página. Cuando llegue a una imagen, usará una etiqueta alt para describir qué es esa imagen.
Si falta la etiqueta alt, el lector de pantalla puede leer el nombre del archivo de imagen en su lugar. Esto no solo suele ser ineficaz para explicar una imagen correctamente, sino que también puede ser confuso y disruptivo, especialmente si el nombre del archivo no estaba optimizado para SEO.
En algunos casos, como dejar la etiqueta alternativa de una imagen en blanco en WordPress, el lector de pantalla omitirá la imagen por completo. Suponiendo que las imágenes que publica en sus sitios web tienen un propósito específico, esta ausencia significa que su visitante no está obteniendo el valor completo o la experiencia que pretendía al usar su contenido.
Pueden aumentar su clasificación en los motores de búsqueda.
Las etiquetas alt pueden ayudarte a clasificar las palabras clave a las que intentas apuntar. Los robots de los motores de búsqueda son inteligentes, pero no pueden interpretar ni comprender los aspectos visuales de una imagen de la misma manera que lo hacen los humanos.
Los atributos Alt ofrecen una una alternativa de texto a la traducción de imágenesy más específicamente para agregar palabras clave relevantes. Las descripciones de texto que incluyen sus palabras clave de destino pueden aumentar sus posibilidades de obtener una clasificación alta en los resultados de búsqueda de imágenes.
Para resaltar el importante papel que juegan las imágenes (y, a su vez, las etiquetas alt) en el SEO, considere una página de resultados de búsqueda (SERP) como una «cama tamaño king»:
La primera página no solo produce resultados de texto; también hay muchos resultados de imagen. Las etiquetas alt correctamente optimizadas y utilizadas pueden ayudar a impulsar el SEO y generar imágenes con hipervínculos en las que se puede hacer clic que aparecerán en dichas búsquedas. Esto es especialmente beneficioso para los sitios de comercio electrónico y las páginas de destino.
¿Cómo agregar una etiqueta de imagen alternativa en WordPress?
Una vez que comprenda los beneficios de usar atributos alternativos de imagen en su sitio, es hora de descubrir cómo hacerlo. Afortunadamente, WordPress hace que esta tarea sea extremadamente simple y directa.
Para agregar una etiqueta alternativa de imagen en WordPress, inicie sesión en el panel de administración y vaya a la página o publicación a la que desea agregar su imagen. En el editor de WordPress, haga clic en el icono más y seleccione Imagen Unidad:
Luego cargue su imagen o elija una de la Biblioteca de medios. Después de insertar una imagen en un bloque, Configuración de imagen El panel se abrirá en la barra lateral de la derecha. Puedes introducir tu descripción en texto alternativo caja:
Cuando haya terminado, guarde los cambios. También puede hacer esto para las imágenes existentes. Por ejemplo, si desea actualizar una imagen en una publicación que ya está publicada en su sitio, simplemente haga clic en la imagen e ingrese una nueva etiqueta alt en la barra lateral.
Cómo agregar una etiqueta alternativa para una imagen en HTML
Cuando usa WordPress o cualquier otro CMS que incluya un módulo para agregar y editar etiquetas alt, automáticamente agregará HTML por usted. Sin embargo, si desea agregar el código usted mismo, puede hacerlo fácilmente.
Agregar etiqueta alt HTML en WordPresshaga clic en el apropiado Imagen Unidad. En la barra de herramientas del bloque, seleccione el botón con tres puntos verticales y seleccione Editar como HTML:
El código HTML mostrará la etiqueta de la imagen. Notará que el atributo alt está vacío. Pon tu texto entre comillas:
Cuando haya terminado, haga clic en Anuncio para volver al editor visual y luego guardar los cambios. Puede usar la misma sintaxis y formato para editar la etiqueta de imagen HTML de cualquier archivo.
Sugerencias y mejores prácticas para escribir etiquetas alternativas a las imágenes
Hay algunos puntos clave a tener en cuenta al crear etiquetas alt. Seguir estas mejores prácticas ayudará a mejorar la efectividad de las etiquetas alt:
- Sea específico y descriptivo. El propósito de las etiquetas alt es describir su imagen, por lo que debe ser lo más específico posible. Si no está seguro de si su descripción es suficiente, considere qué imagen visualizaría si solo viera esta línea de texto.
- Que sea breve. Si bien desea ser específico, tampoco necesita hacer que su etiqueta alternativa sea un párrafo largo (o incluso una oración completa). Apunta a alrededor de 100 a 125 caracteres como máximo.
- No seas superfluo. Para aprovechar al máximo su etiqueta alt, no querrá incluir palabras innecesarias. Esto incluye agregar «Imagen» o «Imagen» antes de la descripción. Estos elementos son innecesarios ya que ya se han sugerido.
- Incluya naturalmente palabras clave relevantes. Considere sus palabras clave objetivo e inclúyalas orgánicamente en el contexto de la página cuando sea posible. Es más fácil cuando usa imágenes muy relevantes que coinciden con el texto.
- Evite el relleno de palabras clave. Si bien el uso de palabras clave en las etiquetas alt puede mejorar el SEO, tenga cuidado de no exagerar. El relleno de palabras clave en realidad puede dañar el SEO y dar como resultado una experiencia de usuario deficiente.
- No uses imágenes en lugar de texto. El objetivo principal de la etiqueta alt es proporcionar contexto textual para máquinas que no pueden procesar e interpretar imágenes en la página. Por lo tanto, no tiene sentido usar texto en las imágenes, especialmente en los encabezados y títulos de las páginas.
Cuando cree etiquetas alternativas para sus imágenes, recuerde siempre que el objetivo es describir su imagen para aquellos que no la vean. Si bien incluir SEO y palabras clave es definitivamente una buena idea, escribir etiquetas alternativas con usuarios reales en mente puede ayudarlo a generar resultados más positivos.
Solicitud
Las imágenes pueden mejorar la apariencia de sus páginas web y hacerlas más interesantes, informativas y atractivas. Sin embargo, para maximizar su valor, es mejor rellenarlos con etiquetas alt. Estas breves pero descriptivas explicaciones brindan contexto tanto para los usuarios como para los motores de búsqueda. Las etiquetas de imagen alternativa ayudan a mejorar la experiencia del usuario, mejoran la accesibilidad y facilitan la clasificación de palabras clave relevantes.
¿Tienes otras preguntas sobre qué es una etiqueta alt o cómo agregarla a WordPress? ¡Háganos saber en la sección de comentarios!
Foto destacada: Honza Hruby / shutterstock.com
