Optimización SEO para imágenes

Lección 10 de la Guía SEO para Principiantes

¿Por qué es necesario optimizar las imágenes?

El SEO puede ponerse en práctica desde dos perspectivas:

Holística; en el conjunto de elementos que componen un sitio o página web e
individual, lo que quiere decir cada elemento por separado páginas, documentos, imágenes, etc..

Ambas formas de ejecutar el SEO son necesarias si tomamos en cuenta que toma vital importancia el análisis de datos a gran escala, y los sistemas de búsqueda tienen como oficio entender en su integridad la información que hay en internet mediante la obtenciónn de la información puntual arrojada por la data en cuestión.

¿Qué tiene que ver lo anterior con el SEO para imágenes?

Que las imágenes son grandes señales que indican la relevancia de un contenido para una búsqueda particular. Las imágenes inducen ciertos tipos de comportamientos como: compras, suscripciones, contactos, etc..

Y aún hoy, con la tecnología de avanzada, no podemos pasar por alto el proceso de optimización web de una imagen ya sea en sus características inherentes o en el contexto del documento donde está incrustada.

Por lo tanto vamos a separar la optimización de imágenes en dos partes:

  • Optimización de características del archivo de la imagen
  • Optimización en el documento donde va incrustado

Optimización del archivo de imagen

El SEO para el archivo de imagen consiste en dos fases:

  1. Reducir el peso de la imagen a su máxima expresión.
  2. Nombrar el archivo con una descripcion acertada.

Reducir el peso de la imagen a su máxima expresión

¿Cuál es el peso óptimo? ¿En qué formato debería guardar mi imagen .jpg, .gif, png? Salvaguardar la integridad visual de un diseño o una fotografía es una preocupación real entre los propietarios de un sitio web; es decir, pocos están dispuestos a sacrificar un par de pixeles, aún cuando los beneficios pueden ser enormes.

Una imagen muy pesada eleva costos de computación tanto para un usuario, como para el propietario del sitio web.

¿Cómo los eleva?

Cada imagen descargada tiene un peso en bytes específicos y cada X cantidad de bytes tiene un costo que varía de acuerdo al proveedor de servicios de internet, de telefonía celular, el proveedor de hosting, etc...

Por lo tanto una página web que contenga imágenes muy pesadas disminuye la experiencia del usuario, no solo visual, también económica.

¿Qué reglas deberíamos tomar para el peso de las imágenes?

  • Generar imágenes en archivos jpg de baja/media resolución.
  • Utilizar .png siempre y cuando sean archivos muy pequeños donde es necesario hacer uso de las propiedades de transparencia.

Nombrar el archivo con una descripcion detallada

Significa que la mejor manera de nombrar tu imagen es con su descripción.

Por ejemplo:

  • La imagen es una fotografía de un gato con botas lo más sensato sería llamar a esa imagen gato-con-botas.jpg.
  • La imagen es una fotografía de un gato amarillo con botas; entonces, nombraríamos a esta imagen así: gato-amarillo-con-botas.jpg
  • Y si la imagen es una fotografía de un gato amarillo y unas botas; entonces, la llamaríamos: gato-amarillo-botas.jpg. (la semántica es vital en todos los aspectos del SEO).

Optimización de la imagen incrustada en el contexto de la página

La segunda parte de la optimización de imágenes consiste en utilizar los atributos HTML necesarios para indicar a un robot el significado de una imagen en el contexto de una página. Estas atributos son:

  • Atributo title
  • Atributo alt

Atributo title (título de imagen)

Existen una serie de convenciones/recomendaciones en cuanto a cómo titular una imagen; sin embargo, en términos de una optimización el título no es una descripción de la imagen.

Tomemos la fotografía del gato amarillo con botas. La imagen muestra un gato amarillo con botas, que esta sea la descripción no significa que el objetivo de nuestra imagen es mostrar a un gato amarillo con botas, podríamos, tal vez, compartir la foto de tu mascota Apolo que resulta ser un gato con las características descritas. Y por el ende, el título sería: Mi mascota el Gato Apolo.

En tal caso "Mi mascota el Gato Apolo" corresponde a información extra, pero vital para entender el contexto en que se encuentra la imagen.

El título se coloca de la siguiente forma:

<img src="gato-amarillo-botas.jpg" title="Mi mascota el gato Apolo">

Atributo alt (texto alternativo)

Alt proviene de alternativa y ciertamente, es un texto alternativo a la imagen; si la imagen, no estuviera presente, ya sea por una conexión lenta u otras razones, cómo describiríamos ese supuesto espacio donde está colocada imagen.

Fácil con el atributo alt de la siguiente forma.

<img src="gato-amarillo-botas.jpg" title="Mi mascota el gato Apolo" alt="Gato amarillo con botas llamado Apolo">

El atributo alt puede corresponder a:

  • Una descripción precisa y concisa de la imagen.
  • Para describir el propósito de la imagen.

El atributo alt no es obligatorio en aquellos casos donde su utilización no define un propósito específico.

¿Tienes preguntas?

[vivafbcomment]