SEO Imágenes | 9 elementos Imprescindibles

Uno de los instrumentos más utilizados que casi siempre y en todo momento van de la mano de cualquier texto es la imagen. Esta no solo ayuda a enfatizar unas partes del texto que queremos resaltar, sino que también aligera la lectura, haciendo que este momento sea mucho más entretenido y agradable. Asisten, sin duda, a ofrecerle al usuario la mejor experiencia posible y, puesto que Google centra sus esfuerzos exactamente en mimarlo en este sentido para que continúe interactuando con él, ¿por qué nos olvidamos en muchas ocasiones de optimizar nosotros las imágenes para su motor de búsqueda?
Sin duda, merece la pena invertir algo de tu tiempo en trabajar sobre las imágenes para sacarles el máximo partido, así que presta atención a los siguientes 9 elementos que tendrás que tener en consideración en el momento de iniciar con la optimización posicionamiento en buscadores para imágenes.

Back to top

1) 1. Líneas generales del posicionamiento SEO para imágenes

A menudo centramos todos nuestros esfuerzos en posicionar las URLs de valoren las Search Engines Ranking Positions. No obstante, como comentábamos al inicio de este artículo, es importante optimar las imágenes con el objetivo de posicionar en los resultados de Google en el apartado de ‘ Google Imágenes’ y ampliar las posibilidades de atraer más tráfico orgánico a través de las mismas.

Captura de pantalla de los presentes resultados de Google Imágenes para la palabra clave «posicionamiento web».

Los robots de Google no son capaces de ‘leer’ las imágenes. Están pensados para leer el código e un sitio web, no de una animación en particular o de cualquier imagen por lo general. Por esto debemos facilitarle esta información implementando una sencilla serie de pautas de optimización posicionamiento en buscadores. De ellas dependerá que pueda interpretar o bien no la información que procuramos mostrarle, de que pueda o bien no poder valorarlas y que que puedan rankear en su sección de Google imágenes.

Back to top

2) 2. Peso y tamaño de las imágenes

Dos de los factores a tener en consideración en el momento de optimizar las imágenes son el peso y el tamaño de las imágenes.

Peso:

Las imágenes pesadas subidas a la página web ralentizan la velocidad de carga de la URL en la que están incorporadas y, por lo tanto, de la web completa. La velocidad de carga es uno de los factores de posicionamiento orgánico tanto para desktop como para mobile, con lo que es esencial que estén optimados desde este punto de vista.

Herramientas para aligerar el peso:

Existen muchas herramientas que nos asisten a aligerar el peso de las imágenes. Aunque no contemos con programas de edición y tratamiento de imágenes a nivel profesional como Photoshop o Illustrator, podemos hacer uso de plataformas en línea semejantes como:

Tamaño:

Además, es también importante guardar diferentes tamaños de una misma imagen a fin de que se muestre la más adecuada en función del dispositivo en que se muestra. Aunque existen complementos que reescalan el tamaño de la imagen, debemos tener precaución en el momento de poner en práctica esta opción. Esto es porque, por ejemplo, una imagen de mil px reescalada a cuatrocientos px de forma automática hará que se fuerce la vista de la imagen a 400 px; sin embargo, la imagen seguirá cargándose en el tamaño inicial (1000 px) y afectará al desempeño y velocidad de la página web.

Herramientas:

El punto más importante a la hora de seleccionar las imágenes es saber la plataforma en la que vamos a trabajar. Si trabajamos en Wordpress por servirnos de un ejemplo, contamos con herramientas como, un plugin que nos permite delimitar el ancho y alto máximo que queremos que tengan nuestras imágenes y las redimensiona y comprime al subirlas al servidor.

Si por el contrario trabajamos con plataformas de código propias, deberemos de crear un proceso manual o automatizado que nos deje optimar las imágenes antes de subirlas al servidor.

Ejemplo de las sugerencias de optimización de las imágenes de la home de posicionamiento web Alive en WebSpeedTest.

Back to top

3) 3. Formatos de las imágenes posicionamiento web-friendly

En la actualidad, existen 4 formatos para guardar las imágenes para web de la manera más óptima:

• WebP:Puede ahorrar hasta un 25-treinta y cinco por cien del peso inicial de la imagen. Es el formato más recomendado en estos momentos, aunque algunas versiones de navegadores no son todavía capaces de leerlo. Es uno de los formatos que más compresión permite sin perjudicar la calidad de la imagen.
• Formato .png:Es la más idónea para imágenes de pocos colores y con fondos transparentes. Se usa mucho para logos.
• Formato .jpg:Es el formato que se debería emplear para fotografías y también imágenes normalmente. Se pierde un tanto de calidad al comprimir las imágenes, pero, no se pierden colores o tonalidades.
• Formato .gif:Utilizado para animaciones y también imágenes en movimiento.

Ejemplo de los diferentes pesos de las imágenes dependiendo del formato utilizado.

Recomendaciones:

1. Utiliza siempre y en toda circunstancia el formato que mejor le venga a la imagen en cuestión de peso y compatibilidad.
2. Comprime siempre y en toda circunstancia las imágenes ya sea con una herramienta que automatice el proceso o bien de forma manual.
3. Si en la página web hay varios iconos, agrúpalos en una única imagen a través de CSS Sprites con el fin de reducir el número de peticiones al servidor y mejorar el desempeño de la página web.

Back to top

4) 4. Campos posicionamiento SEO imágenes

Cada imagen tiene una serie de campos asociados a ella que ayudarán a los robots de los motores de búsqueda (y, por supuesto, a los usuarios) para poder disponer de una mejor accesibilidad.

Nombre de la imagen

El nombre de la imagen hace referencia al nombre del archivo. Es el título de la imagen con guiones altos o bien bajos para separar las distintas palabras. Se recomienda incluir en él la palabra clave por la que queremos posicionar la imagen eludiendo tildes y caracteres extraños (como la ‘ñ’, ‘?’, etcétera).

También es conveniente obviar las preposiciones u otro tipo de caracteres vacíos que no aportan información alguna al nombre del fichero con el fin de acortar lo máximo posible la URL y hacerla lo más posicionamiento SEO friendly posible.

Título (title)

Es el texto que aparece al poner el cursor encima de una imagen. Se aconseja cumplimentarlo para dotar un título semántico a la imagen añadiendo la palabra clave primordial por la que queremos posicionar.

Este puede ser exactamente el mismo que el texto alt, si bien no lleva mucho tiempo extra redactarlo haciendo una ligera variación de este otro atributo.

Atributo ‘alt’

Es el elemento más importante, ya que es lo que lee Google. Debe contener la keyword primordial por la que queremos posicionar una URL y está concebido para descripciones cortas.

Su sintaxis es la siguiente:

<img src=”ENLACE DE LA IMAGEN” alt=”DESCRIPCIÓN ALT DE LA IMAGEN” />

Ejemplo de una imagen optimizada:

Veamos cómo se podrían rellenar los campos para optimar la imagen en base al término objetivo ‘ ciberseguridad pymes’, cuyo promedio de búsquedas mensuales es de noventa búsquedas (en España):

Nombre archivo:

• mal: .jpg
• bien: ciberseguridad-pymes.jpg

Título: Consejos de ciberseguridad para empresarios y pymes

Alt text:Ciberseguridad para pymes y empresarios: consejos

De esta forma, conseguiremos que todos los campos estén optimados y tendremos una imagen lista para combatir por las primeras posiciones. Como es lógico, optimar las imágenes no es garantía de que aparecerán en lo más alto, pero es un primer paso para conseguirlo :)

Back to top

5) 5. Contexto semántico

Google considera más relevantes las imágenes cuanto mayor relación tengan con el contenido que las rodea. De ahí que, es recomendable que estén rodeadas de texto relacionado. De esta forma, conseguiremos ampliar el contexto semántico total de la URL.

Back to top

6) 6. Sitemap específico de imágenes

Con el fin de que el robot de Google rastree las imágenes de una manera más eficiente, es necesario crear un sitemap.xml exclusivo con este género de ficheros. Desde WP puede producirse automáticamente a través de herramientas (plugins) como Yoasto RankMath. En el caso de no trabajar con WordPress, se pueden usar herramientas alternativas o hacerlo de forma manual con herramientas de programación (rastreo de urls).

A continuación, puedes ver un ejemplo de sitemapcon 2 imágenes en un artículo:

<?xml version=»1.0″ encoding=»UTF-8″?>
<urlset xmlns=»/schemas/sitemap/0.9″
xmlns:image=»/schemas/sitemap-image/1.1″>
<url>
<loc>/sample.html</loc>
<image:image>
<image:loc>/image.jpg</image:loc>
</image:image>
<image:image>
<image:loc>/photo.jpg</image:loc>
</image:image>
</url>
</urlset>

Algunas de las etiquetas más comunes a la hora de crear un sitemap para imágenes son:

→ El título de la imagen.
→ La URL o bien senda del fichero donde está alojado
→ El pie de la página
→ El género de licencia
→ Aporta información de geolocalización

• Documentación: En el, se puede hallar una extensa cantidad de información sobre el sitemap de imágenes con ejemplos, guías para incorporarlo y mucho más.

Una vez hayamos efectuado toda la implementación, podremos comprobar el estado de la cobertura de la indexación a través de la Search Console.

Back to top

7) 7. Lazy Load (carga diferida) para imágenes

La imagen es uno de los recursos que generalmente más se usan en los sitios web. Y es que, como se suele decir, ‘una imagen vale más que mil palabras’. De ahí que se cuide mucho el aspecto visual de cada una de las páginas a través de la implementación de estos elementos multimedia. Sin embargo, no trabajarlas puede acarrear un impacto negativo sobre la experiencia del usuario y sobre la velocidad de carga de una web, por lo que es recomendable cargarlas a través de lo que es conocido como lazy load o bien carga diferida.

Gracias al lazy load, las imágenes solo se cargan cuando se ven en pantalla. O sea, si se hallan en una parte inferior aún no visible en la pantalla del dispositivo, estas no llegarán a cargarse hasta que el usuario haga scroll. Esto reduce en gran medida el número de peticiones HTTP, por lo que el tiempo de carga será mejor y a Google le gustará(s) más.

7.1) Plugins para incorporar Lazy Cargar en WordPress

Si eres de los que trabajan con esta aplicación software para gestionar sitios, hay una serie de plugins que seguro te resultan de interés si necesitas optimar las imágenes a través de la implementación de la carga diferida. Eso sí, recuerda repasar primero si el theme que está instalado lleva o no esta función. En caso negativo, aquí te planteamos algunos muy interesantes:

• BJ Lazy Load:de fácil instalación y configuración, es uno de los más populares, con más de 90.000 instalaciones. Gracias a este complemento se pueden realizar imágenes escaladas a fin de que se vean en distintos tamaños de pantallas.
• Lazy Cargar by WP Rocket:sencillo y sin dificultades en el momento de configurarlo (básicamente porque no te da opciones), este plugin cuenta con el beneficio de no utiliza una biblioteca de JavaScript como jQuery.

Back to top

8) 8. Usar un CDN para imágenes

Una Red de distribución de contenido o bien CDN (Content Delivery Network)es un conjunto de servidores distribuidos por todo el planeta que facilitan el contenido de un sitio web cacheado en función de la ubicación de quien hace la petición. Merced a esta red de alojamiento, será el servidor más cercano al que solicita la información el que disponga de una copia de la página web demandada.

El empleo de una CDN (Content Delivery Network), por consiguiente, nos ayuda a que una URL se descargue de forma más rápida, con lo que mejora los tiempos de carga de nuestro site y favorece también su posicionamiento orgánico.

Si hacemos uso de una CDN (como, por servirnos de un ejemplo, Cloudflare) para servir las imágenes, las descargará y mostrará más rápido, con lo que, como se sobreentiende una vez más, dicha fluidez mejorará nuestro posicionamiento SEO.

Back to top

9) 9. Otras consideraciones

Las imágenes con valor posicionamiento en buscadores o, lo que es lo mismo, que queremos posicionar, deben incluirse en el código fuente de una URL. Aquellas que están incorporadas como propiedad background en CSS no serán perceptibles para Google, en tanto que no tiene la capacidad de comprender las hojas de estilo.

Además, existen otros pequeños detalles a tener en cuenta en el momento de optimizar nuestras imágenes que no debemos olvidar:

• Exif: Con cada imagen, se guardan una serie de atributos como la fecha en la cual se tomó la fotografía y otro tipo de información relevante para los profesionales de este campo. Sin embargo, a nivel de posicionamiento SEO, esta información no es relevante y tan solo ocupa espacio. Eliminar esta información será otra manera de optimizara las imágenes y hacer que sean menos pesadas.
• « longdesc«: Este atributo muchas veces está olvidado mas también será bien interesante incorporarlo en nuestras imágenes. Se trata de una descripción larga de la imagen.
• Enlazado: Del mismo modo que el link building juega un papel esencial en el desarrollo orgánico de nuestras páginas, lo mismo sucede con las imágenes. Estas también pueden ser enlazas y por ende pueden conseguir un mejor reconocimiento en los buscadores.

¿Nos hemos dejado algún consejo que consideres esencial?Nos encantaría saber tu opinión. ¡Escribe tu comentario a continuación y siéntete libre de aportar todos tus conocimientos!

9.0.1) Comparte este artículo por favor. ¡Mil gracias!

Back to top