Uno de los instrumentos más utilizados que prácticamente siempre van de la mano de cualquier texto es la imagen. Esta no solo ayuda a enfatizar unas partes del texto que deseamos destacar, sino que asimismo aligera la lectura, haciendo que este momento sea considerablemente más entretenido y agradable. Asisten, sin duda, a ofrecerle al usuario la mejor experiencia posible y, dado que Google centra sus esfuerzos exactamente en mimarlo en este sentido a fin de que continúe interactuando con él, ¿por qué nos olvidamos muy frecuentemente de optimizar nosotros las imágenes para su motor de busca?
Sin duda, vale la pena invertir algo de tu tiempo en trabajar sobre las imágenes para sacarles el máximo partido, con lo que presta atención a los próximos 9 elementos que tendrás que tener en cuenta a la hora de iniciar con la optimización posicionamiento web en buscadores para imágenes.
1) 1. Líneas generales del posicionamiento en buscadores para imágenes
A menudo centramos todos nuestros sacrificios en posicionar las URLs de valor en las SERPs. No obstante, tal como comentábamos al comienzo de este blog post, es esencial optimizar las imágenes con el fin de posicionar en los resultados de Google en el apartado de ‘Google Imágenes’ y ampliar las posibilidades de atraer más tráfico desde buscadores mediante las mismas.
Captura de pantalla de los actuales 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 concebidos para leer el código y también un sitio, no de una animación particularmente o bien de cualquier imagen por lo general. Por esto debemos facilitarle esta información incorporando una fácil serie de pautas de optimización posicionamiento en buscadores. De ellas va a 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 top2) 2. Peso y tamaño de las imágenes
Dos de los factores a tomar en consideración en el momento de optimar las imágenes son el peso y el tamaño de las imágenes.
Peso:
Las imágenes pesadas subidas a la web ralentizan la velocidad de carga de la URL en la que están incorporadas y, por ende, de la web completa. La velocidad de carga es uno de los factores de posicionamiento orgánico tanto para desktop para mobile, por lo que es importante que estén optimizadas desde este punto de vista.
Herramientas para aligerar el peso:
Existen muchas herramientas que nos asisten a aligerar el peso de las imágenes. Si bien no contemos con programas de edición y tratamiento de imágenes a nivel profesional como Photoshop o Illustrator, podemos hacer uso de plataformas on-line tales como:
Tamaño:
Además, es también esencial guardar diferentes tamaños de una misma imagen para que se muestre la más adecuada en función del dispositivo en que se muestra. Si bien existen complementos que reescalan el tamaño de la imagen, debemos llevar cuidado en el momento de poner en práctica esta opción. Esto es porque, por poner un ejemplo, una imagen de mil px reescalada a 400 px de manera automática hará que se fuerce la vista de la imagen a 400 px; no obstante, la imagen proseguirá cargándose en el tamaño inicial (mil px) y afectará al desempeño y velocidad de la página web.
Herramientas:
El punto más importante a la hora de elegir las imágenes es saber la plataforma en la que vamos a trabajar. Si trabajamos en WP por poner un ejemplo, contamos con herramientas como , un complemento que nos permite acotar 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 permita optimizar 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 en buscadores Alive en WebSpeedTest.
Back to top3) 3. Formatos de las imágenes SEO-friendly
En la actualidad, existen cuatro formatos para guardar las imágenes para web de la forma más óptima:
- WebP: Puede ahorrar hasta un 25-35 por ciento del peso inicial de la imagen. Es el formato más recomendado en estos momentos, si bien algunas versiones de navegadores no son aún capaces de leerlo. Es uno de los formatos que más compresión deja sin dañar la calidad de la imagen.
- Formato .png: Es la más idónea para imágenes de pocos colores y con fondos transparentes. Se utiliza mucho para logotipos.
- Formato .jpg: Es el formato que se debería usar para fotografías y también imágenes por norma general. Se pierde un poco de calidad al comprimir las imágenes, pero, no se pierden colores o tonalidades.
- Formato .gif: Usado para animaciones y también imágenes en movimiento.
Ejemplo de los diferentes pesos de las imágenes dependiendo del formato empleado.
Recomendaciones:
- Utiliza siempre el formato que mejor le venga a la imagen en cuestión de peso y compatibilidad.
- Comprime siempre y en todo momento las imágenes así sea con una herramienta que automatice el proceso o de forma manual.
- Si en la web hay múltiples iconos, agrúpalos en una sola imagen a través de CSS Sprites con la intención de reducir el número de solicitudes al servidor y prosperar el desempeño de la página web.
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, naturalmente, a los usuarios) para poder contar con 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 bajos para separar las diferentes palabras. Se aconseja incluir en él la palabra clave por la que queremos posicionar la imagen eludiendo tildes y caracteres extraños (tales como la ‘ñ’, ‘?’, etcétera).
También es recomendable obviar las preposiciones o bien 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 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 principal por la que deseamos posicionar.
Este puede ser el mismo que el texto alt, aunque no lleva bastante tiempo extra redactarlo haciendo una ligera variación de este otro atributo.
Atributo ‘alt’
Es el elemento más esencial, puesto que es lo que lee Google. Debe contener la palabra clave primordial por la que deseamos posicionar una URL y está concebido para descripciones cortas.
Su sintaxis es la siguiente:
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 buscas mensuales es de 90 búsquedas (en España):
Nombre archivo:
- mal: 04745892595295.jpg
- bien: ciberseguridad-pequeñas y medianas empresas.jpg
Título: Consejos de ciberseguridad para empresarios y pymes
Alt text: Ciberseguridad para pequeñas y medianas empresas y empresarios: consejos
De esta manera, conseguiremos que todos los campos estén optimizados y vamos a tener una imagen lista para combatir por las primeras posiciones. Evidentemente, 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 top5) 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 conveniente que estén rodeadas de texto relacionado. De esta forma, lograremos ampliar el contexto semántico total de la URL.
Back to top6) 6. Sitemap concreto de imágenes
Con el fin de que el robot de Google rastree las imágenes de una forma más eficiente, es necesario crear un sitemap.xml exclusivo con este tipo de archivos. Desde WordPress puede producirse de forma automática mediante herramientas (plugins) como Yoast o bien RankMath. En el caso de no trabajar con Wordpress, se pueden utilizar herramientas alternativas o hacerlo de forma manual con herramientas de programación (rastreo de urls).
A continuación, puedes ver un ejemplo de sitemap con dos imágenes dentro de un artículo:
xmlns:image=»http://www.google.com/schemas/sitemap-image/1.1″>
http://example.com/sample.html
http://example.com/image.jpg
http://example.com/photo.jpg
Algunas de las etiquetas más comunes en el momento de crear un sitemap para imágenes son:
→ El título de la imagen.
→ La URL o bien ruta 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 localizar una extensa cantidad de información sobre el sitemap de imágenes con ejemplos, guías para implementarlo y mucho más.
Una vez hayamos realizado toda la implementación, podremos comprobar el estado de la cobertura de la indexación mediante la Search Console.
Back to top7) 7. Lazy Cargar (carga diferida) para imágenes
La imagen es uno de los recursos que en general más se emplean en los sitios. Y es que, como se suele decir, ‘una imagen vale más que mil palabras’. Por eso se cuide mucho el aspecto visual de cada una de las páginas a través de la implementación de estos elementos multimedia. No obstante, 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 conveniente cargarlas a través de lo que es conocido como lazy cargar o bien carga diferida.
Gracias al lazy cargar, las imágenes solo se cargan cuando se ven en pantalla. Es decir, si se encuentran en una parte inferior aún no perceptible en la pantalla del dispositivo, estas no llegarán a cargarse hasta el momento en que el usuario haga scroll. Esto reduce en buena 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, existe una serie de complementos que seguro te interesan si necesitas optimar las imágenes mediante la implementación de la carga aplazada. Eso sí, recuerda repasar primero si el theme que está instalado lleva o bien no esta función. En caso negativo, acá te proponemos ciertos muy interesantes:
- BJ Lazy Load: de fácil instalación y configuración, es uno de los más populares, con más de noventa instalaciones. Merced a este complemento se pueden efectuar imágenes escaladas para que se vean en distintos tamaños de pantallas.
- Lazy Cargar by WP Rocket: fácil y sin dificultades en el momento de configurarlo (básicamente por el hecho de que no te da opciones), este complemento cuenta con el beneficio de no usa una biblioteca de JavaScript como jQuery.
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 mundo que facilitan el contenido de un sitio cacheado en función de la ubicación de quien hace la solicitud. Gracias a esta red de alojamiento, será el servidor más cercano al que pide la información el que disponga de una copia de la página web demandada.
El uso de una CDN (Content Delivery Network), por lo tanto, 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 asimismo su posicionamiento orgánico.
Si utilizamos una CDN (como, por poner un ejemplo, Cloudflare) para servir las imágenes, las descargará y mostrará más rápido, por lo que, como se sobreentiende de nuevo, dicha fluidez mejorará nuestro posicionamiento en buscadores.
Back to top9) 9. Otras consideraciones
Las imágenes con valor posicionamiento SEO o bien, lo que es exactamente 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 van a ser perceptibles para Google, en tanto que no tiene la capacidad de entender las hojas de estilo.
Además, hay otros pequeños detalles a tomar en consideración a la hora de optimizar nuestras imágenes que no debemos olvidar:
- Exif: Con cada imagen, se guardan una serie de atributos como la data en la que se tomó la fotografía y otro género de información relevante para los profesionales de este campo. No obstante, a nivel de SEO, esta información no es relevante y solo ocupa espacio. Quitar esta información va a ser otra manera de optimizara las imágenes y hacer que sean menos pesadas.
- «longdesc«: Este atributo muchas veces está olvidado pero asimismo será muy interesante implementarlo en nuestras imágenes. Se trata de una descripción larga de la imagen.
- Enlazado: De igual forma que el link building juega un papel esencial en el crecimiento orgánico de nuestras páginas, lo mismo sucede con las imágenes. Estas también pueden ser enlazas y por lo tanto pueden lograr un mejor reconocimiento en los motores de búsqueda.
¿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!