Casa » Optimización de motores de búsqueda » Optimización de imagen: etiqueta alt y etiqueta de título

Optimización de imagen: etiqueta alt y etiqueta de título

Optimización de imagen: etiqueta alt y etiqueta de título

Uno de los atributos más importantes de la optimización de imágenes en una página es la alt etiqueta (o etiqueta alt ). Agregar imágenes a sus publicaciones anima a las personas a leerlas y, si se elige bien, le ayuda a tener una buena clasificación en los resultados de búsqueda de imágenes.

SEO (Search Engine Optimization) es la práctica de optimizar páginas para lograr un mejor posicionamiento en los resultados de búsqueda. Además de clasificar sus imágenes en la búsqueda de imágenes, desea clasificar mejor sus páginas en los motores de búsqueda. Para esto la etiqueta alt también es importante.

LOS alt La etiqueta tiene como objetivo proporcionar a los motores de búsqueda la información necesaria para “explicar” de qué se trata la imagen, dando contexto al usuario.

¿Qué son los atributos alt y title?

Los atributos alt y título de una imagen se denominan comúnmente etiqueta alt y etiqueta de título. Técnicamente no son etiquetas, son atributos.

El atributo alt describe lo que hay en la imagen y su función en la página. Es utilizado por lectores de pantalla (lectores de pantalla), que son navegadores utilizados por personas ciegas o con discapacidad visual. Estos lectores de pantalla le dicen qué hay en la imagen leyendo la etiqueta alt.

etiqueta alt de una imagen
La etiqueta alt describe lo que hay en la imagen. Ej: “Matriz de segmentación de contenido”.

El atributo título a su vez, se muestra como una "sugerencia" cuando se coloca el mouse sobre el elemento. Puede ser importante en ocasiones, como una especie de pie de foto o para dar alguna instrucción al usuario. Desde el punto de vista del SEO, digamos que es "prescindible".

etiqueta de título de una imagen
El atributo de título que se utiliza para dar más contexto a la información.

Cada imagen debe tener un atributo alt. No solo para fines de SEO, sino también porque las personas ciegas y con discapacidad visual no sabrán de qué se trata la imagen.

Lea también: "SEO de contenido: optimización de contenido para búsquedas

El atributo título es prescindible, como dije antes. Si la información transmitida por el atributo título es relevante, considere hacerlo disponible en otro lugar, en texto sin formato y, si no es relevante, considere eliminar este atributo por completo.

Vea cómo proporcionar alternativas de texto (alt etiqueta) apropiado según el propósito de la imagen.

Objeto de la imagen

Imágenes informativas

Imágenes que representan gráficamente conceptos e información, generalmente imágenes, fotografías e ilustraciones. LOS alt la etiqueta debe ser al menos una breve descripción, que transmita la información esencial presentada por la imagen.

Imágenes decorativas

Proporcione una alternativa de texto nulo (alt = "") cuando el único propósito de una imagen es agregar decoración visual a la página, en lugar de transmitir información importante para la comprensión de la página.

Imágenes funcionales

La etiqueta alt de una imagen utilizada como enlace o botón debe describir la funcionalidad del enlace o botón, en lugar de la imagen visual. Ejemplos de tales imágenes son un icono de impresora para representar la función de impresión o un botón para enviar un formulario.

Imágenes de texto

A veces se muestra texto legible dentro de una imagen. Si la imagen no es un logotipo, evite el texto en las imágenes. Sin embargo, si se utilizan imágenes de texto, los alt La etiqueta debe contener las mismas palabras que en la imagen..

Imágenes complejas

Los gráficos y diagramas se utilizarían a menudo para transmitir datos o información detallada. Proporcione un texto completo equivalente a los datos o la información proporcionada en la imagen como alt.

Grupos de imágenes

Si varias imágenes transmiten una sola información, la alternativa de texto para una imagen debe transmitir la información a todo el grupo.

Mapas de imágenes

LOS alt La etiqueta de una imagen que contiene varias áreas en las que se puede hacer clic debe proporcionar un contexto general para el conjunto de enlaces. Además, Cada área en la que se puede hacer clic individualmente debe tener un texto alternativo que describa el propósito o el destino del enlace..

Para un vistazo rápido a cómo decidir en qué categoría encaja una imagen en particular, consulte el árbol de decisiones de alt etiqueta a continuación. LOS alt La etiqueta debe ser determinada por el autor, dependiendo del uso, contexto y contenido de la imagen. Por ejemplo: el tipo y la apariencia exacta de una puesta de sol en una imagen puede ser menos relevante en el sitio web de una ciudad, pero puede ser apropiado en un sitio web que trata sobre playas paradisíacas.

¿Por qué es importante la etiqueta alt?

Dejando de lado los aspectos SEO, que ya sabemos que son muy importantes, las imágenes y gráficos hacen que el contenido sea más agradable y fácil de entender. Esto es aún más evidente para las personas con discapacidades visuales, cognitivas y de aprendizaje. Sirven como pistas que se utilizan para orientarse en el contenido.

Sin embargo, las imágenes se utilizan ampliamente en sitios web y pueden crear barreras importantes cuando no son accesibles. Las imágenes asequibles son beneficiosas en muchas situaciones, como:

  • Personas que usan lectores de pantalla: un alt la etiqueta puede leerse en voz alta o reproducirse en Braille;
  • Personas que utilizan software de entrada de voz: los usuarios pueden centrarse en un botón o una imagen vinculada con un solo comando de voz;
  • Personas que navegan por sitios habilitados para voz: un alt la etiqueta se puede leer en voz alta;
  • Usuarios de Internet móvil: las imágenes se pueden desactivar, especialmente para datos en itinerancia;
  • Optimización de motores de búsqueda: las imágenes se vuelven indexables por los motores de búsqueda.

Árbol de decisión de etiqueta alternativa

Este árbol de decisión describe cómo utilizar el atributo alt del elemento en diversas situaciones. Para algunos tipos de imágenes, existen enfoques alternativos, como el uso de imágenes de fondo CSS para imágenes decorativas o fuentes web en lugar de imágenes de texto. Identifica la mejor alternativa para tus imágenes.

1- ¿La imagen contiene texto?

No:

Continúe con la pregunta 2.

Si:

… Y el texto también está presente como texto cercano.
Usa un atributo alt vacío. Ver imágenes decorativas.

… Y el texto se muestra solo con fines visuales.
Usa un atributo alt vacío. Ver imágenes decorativas.

… Y el texto tiene una función específica, por ejemplo, es un icono.
Usa el atributo alt para comunicar la función de la imagen. Ver imágenes funcionales.

… Y el texto de la imagen no está presente de otra manera.
Usa el atributo alt para incluir el texto de la imagen. Ver imágenes de texto.

2- ¿Se utiliza la imagen en un enlace o botón, y sería difícil o imposible entender qué hace el enlace o botón si la imagen no estuviera ahí?

No:

Continúe con la pregunta 3.

Si:

Usa el atributo alt para comunicar el destino de la llamada o la acción realizada. Ver imágenes funcionales.

3- ¿La imagen aporta significado a la página o contexto actual?

No:

Continúe con la pregunta 4.

Si:

... y es un simple gráfico o fotografía.
Utilice una breve descripción de la imagen de una manera que transmita ese significado en el atributo alt. Ver imágenes informativas.

… Y es un gráfico o información compleja.
Incluya la información contenida en la imagen en otra parte de la página. Ver imágenes complejas.

... y muestra contenido que es redundante para el texto real cercano.
Usa un atributo alt vacío. Ver imágenes funcionales.

4- ¿La imagen es meramente decorativa o no está pensada para el usuario?

No:

Continúe con la pregunta 5.

Si:

Usa un atributo alt vacío. Ver imágenes decorativas.

5- El uso de la imagen no se menciona arriba o no está claro qué texto alt ¿debería ser provisto?

Este árbol de decisiones no cubre todos los casos. Para obtener información detallada sobre la provisión de alt etiqueta, revisa la propósito de la imagen.

Conclusión

Cada imagen debe tener un alt etiqueta, con pocas excepciones.

El atributo título es prescindible en el aspecto SEO, pero puede contribuir a la usabilidad y la experiencia del usuario.

Identificar el propósito de la imagen dentro de la página para definir cuál será el alt etiqueta utilizada.

Referencias:

Sigue leyendo: "Mejorando su auditoría técnica de SEO

Sobre el Autor

¡Consejos gratuitos para optimizar su sitio web!
  • Obtenga consejos semanales sobre SEO, análisis y WordPress.
  • Estrategias digitales y conocimientos para mejorar sus conversiones.
Menú