Tácticas de crecimiento editorial para la temporada electoral | WEBINAR
Tácticas de crecimiento editorial para la temporada electoral | WEBINAR
A través de este módulo, aprenderá qué es la optimización de imágenes, su importancia para el SEO, las mejores prácticas para usarla de manera efectiva y los errores comunes que se deben evitar al optimizar imágenes.
Duración del vídeo
19:24
Responder cuestionario
Realizar la prueba del módulo actual
Materiales
Plantillas listas para usar
Recursos
Informes y recursos
No hay exámenes para mostrar para este módulo.
La optimización de imágenes consiste en aplicar las mejores prácticas a las imágenes que utiliza en su página para que su contenido tenga una mejor clasificación en las páginas de resultados de los motores de búsqueda (SERP).
Los usuarios de internet han mostrado una mayor preferencia por un contenido visual más completo . Esto significa que optimizar las imágenes es tan importante como optimizar el texto del contenido.
La optimización de imágenes se utiliza para producir imágenes con el mejor formato, tamaño y resolución posibles para mejorar la experiencia del usuario (UX). Para que Google pueda indexar y rastrear correctamente la imagen y mostrarla en las SERP, esta debe estar optimizada según las directrices de Google e identificada adecuadamente con los metadatos pertinentes.
En este módulo, profundizaremos en los aspectos más destacados de la optimización de imágenes.
Las imágenes también son contenido. Al igual que el texto, aparecen en los resultados de búsqueda e influyen en la utilidad de tu página para el lector. Aquí te explicamos por qué optimizar las imágenes es importante para el SEO.
En la mayoría de las páginas, las imágenes representan más del 70% de su peso , lo que significa que usar imágenes sin optimizar puede ralentizar los tiempos de carga. Dado que la velocidad del sitio es un factor importante para el posicionamiento, esto impacta directamente en el SEO. Además de la velocidad del sitio, las imágenes sin optimizar también pueden afectar la experiencia del usuario al causar problemas como cambios en el diseño.
Estos factores afectan los elementos web esenciales (CWV) de su sitio, que Google utiliza para medir la experiencia de la página.
Para obtener más información sobre CWV, consulte nuestro módulo de experiencia de página detallada aquí .
La optimización de imágenes implica identificar y etiquetar correctamente las imágenes mediante texto alternativo y datos estructurados, añadir imágenes a mapas de sitio y crear nuevos mapas de sitio para imágenes . Todo esto ayuda a los rastreadores web a identificar y procesar las imágenes de una página de forma rápida y correcta, mejorando así la velocidad y la eficiencia del rastreo.
Las búsquedas en Google son cada vez más visuales , en lugar de centrarse únicamente en palabras clave textuales. El número de imágenes en Google se ha disparado en la última década, por lo que optimizarlas es más importante que nunca.
Ya en 2018, Google anunció su compromiso de priorizar el contenido visual en las búsquedas . Como consecuencia, Google implementó varias funciones nuevas, como Subtítulos, Datos breves y Búsquedas relacionadas, todas ellas basadas en gran medida en imágenes. Como editor, aprovechar estas funciones probablemente impactará directamente en su SEO y la visibilidad de su contenido.
Eche un vistazo a lo que sucede cuando buscamos la Copa Mundial de la FIFA en Qatar.
Ahora hay un panel lateral dedicado a la derecha que muestra imágenes, que aparece justo encima de la entrada de Wikipedia para el término de búsqueda.
Al hacer clic en la pestaña Imágenes no solo se amplía la cantidad de opciones de imágenes explorables, sino que, como podemos ver en el cuadro verde a continuación, ahora ofrece un carrusel de términos sugeridos que le permiten filtrar imágenes por nombre.
Al desplazarse hacia abajo (como se muestra en la imagen a continuación), se revelan más recomendaciones de búsquedas relacionadas que pueden ayudar a limitar los resultados o ampliar la consulta.
Tener imágenes de su contenido entre las primeras imágenes es otra forma en que los editores pueden mejorar el descubrimiento de contenido.
Google también ha estado desarrollando y actualizando Google Lens , su tecnología de reconocimiento de imágenes habilitada por IA que se encuentra en la barra de búsqueda de la aplicación de Google para iOS y Android.
— para hacerlo aún más poderoso.
Con Google Lens, los usuarios pueden buscar más información sobre imágenes haciendo clic en la foto de algo o cargando una foto almacenada en su teléfono y luego pidiendo a Google que muestre coincidencias.
Una característica poderosa de Google Lens es la búsqueda múltiple, que permite a los usuarios agregar descripciones de texto a las búsquedas de imágenes para facilitar la búsqueda de información visual.
Google también está trabajando para hacer que la búsqueda múltiple sea más local, lo que significa que los usuarios pueden apuntar sus cámaras a algo, subirlo a Google Lens, escribir algunas preguntas y Google mostrará los mejores resultados cerca de su ubicación actual.
A pesar de su obvia importancia, los editores a menudo tienden a tener dificultades con la optimización de imágenes debido a algunos desafíos comúnmente observados.
Cuando se trata de optimizar contenido para texto, los editores a menudo saben qué parámetros monitorear y optimizar: palabras clave, pilares y grupos de contenido, encabezados y títulos, etc.
Sin embargo, cuando se trata de optimizar imágenes, es posible que los editores no sepan qué métricas deben monitorear y mejorar. Las métricas comunes incluyen el tamaño y el tipo de imagen, así como la velocidad de carga, por nombrar algunas.
Optimizar imágenes regularmente para los numerosos artículos que creas puede resultar tedioso. Si bien existen maneras de optimizar imágenes en masa, como usar plugins y una CDN, mantener la calidad de la imagen también es importante. Es fundamental lograr un equilibrio mediante pruebas rigurosas.
Ahora que entendemos qué es la optimización de imágenes y por qué es importante para el SEO, podemos comenzar a ver cómo abordar el proceso de optimización.
PNG y JPEG son los dos formatos de imagen más populares y universalmente admitidos . Es importante saber cuál usar en cada situación.
Si bien PNG funciona bien para capturas de pantalla, gráficos e imágenes con texto, JPEG es ideal para fotografías. PNG utiliza compresión sin pérdida, lo que ayuda a conservar la calidad de la imagen, mientras que JPEG la reduce cada vez que se guarda en este formato.
SVG (formato vectorial escalable) es ideal para logotipos y formas geométricas simples con baja complejidad de imagen.
Formatos más recientes, como WebP y AVIF, están ganando popularidad rápidamente como alternativas a los formatos mencionados. Si bien ambos formatos ofrecen una resolución de mayor calidad y la capacidad de soportar animación, WebP, en particular, es compatible con todos los navegadores web y móviles modernos.
Sin embargo, en general, PNG y JPEG/JPG siguen siendo, por lejos, los formatos de imagen más populares utilizados por el 81,3% y el 76,6% de todos los sitios web respectivamente, seguidos de cerca por SVG, en noviembre de 2022.
El tamaño total de las imágenes de tu página influye directamente en su velocidad de carga. Sin embargo, la compresión no debería resultar en una calidad de imagen deficiente.
Encontrar el equilibrio adecuado entre calidad y tamaño es esencial, pero puede resultar complicado si se intenta mediante ensayo y error. Sin embargo, aquí es donde las herramientas en línea realmente pueden destacar. Herramientas como Imagemin permiten comprimir imágenes en varios formatos, tanto con pérdida como sin pérdida.
Usar el formato correcto también puede ayudarte a encontrar el equilibrio perfecto. Por ejemplo, considera usar WebP. WebP es una mejor alternativa a JPEG , ya que puede reducir el tamaño de la imagen un 30 % sin afectar su calidad ni resolución.
Si WordPress es tu CMS preferido, puedes usar un plugin como Smush , Optimus o Imsanity para optimizar tus imágenes. Estos te ayudan a comprimir, redimensionar, cargar imágenes de forma diferida y más. También puedes considerar reemplazar imágenes animadas como GIF (que pueden ser de gran tamaño) con CSS. La animación y los efectos CSS pueden ayudarte a crear imágenes complejas que conservan la integridad de la resolución y la calidad incluso con un zoom alto.
El nombre de una imagen ayuda a Google a comprender su contexto para posicionarla en los resultados de búsqueda (SERP). En publicaciones más grandes, no siempre es posible nombrar con precisión todas las imágenes del sitio. En este caso, puedes crear un mapa del sitio de imágenes que ayude a Google a localizar la imagen, comprender su propósito e indexarla.
Además de los nombres de archivo contextuales, también recomendamos añadir un título y una descripción a la imagen. Si bien estos atributos son opcionales, complementan el contenido, ofreciendo al motor de búsqueda una visión más completa del tema, lo que facilita una mejor indexación de la imagen .
Cómo hacer esto
Los nombres de las imágenes deben añadirse al código fuente de la página. Esto se hace mediante el atributo img src, ya sea manualmente o con un complemento de CMS.
Si su imagen contiene un balón de fútbol, entonces el código para la fuente de la imagen debería verse así<img src=”football.jpg”/> , lo que ayuda a Google a comprender el contenido de la imagen. Por otro lado, un código como este<img src=”IMG11082022.jpg”/> es vago y no ofrece ningún contexto.
Cuando las personas no pueden ver sus imágenes (un problema para personas con discapacidad visual o cuando el ancho de banda bajo dificulta la visualización), los atributos de texto alternativo ayudan a describir la imagen. Esto también facilita que los motores de búsqueda rastreen e indexen sus imágenes con mayor facilidad.
Cómo hacer esto
Continuando con el ejemplo del punto anterior, el código para Alt Text debería aparecer así<img src=”football.jpg” alt=""mundo" cup official football on the ground”/> .
Si eres un desarrollador experimentado, puedes añadir el texto alternativo manualmente en el código de tu página. Si usas WordPress, puedes seguir estos pasos:
Al añadir datos estructurados a tus imágenes, puedes proporcionar a Google la información necesaria para mostrarlas como resultados enriquecidos y fragmentos. Esto proporciona a los usuarios más información, ayudándoles a elegir en qué enlace hacer clic, lo que genera más tráfico a tu página.
Actualmente, Google admite datos estructurados para imágenes en de productos , vídeos y recetas .
Cómo hacer esto
Google recomienda utilizar JSON-LD para crear scripts de datos estructurados para su contenido e imágenes.
Los datos estructurados se pueden agregar fácilmente usando uno de los varios complementos gratuitos o premium como Schema Pro , Schema.press , etc. Ya sea que agregue datos de estructura de imagen manualmente o mediante un complemento, los pasos implicarán agregar valores para todas las propiedades de imagen y tipos de datos , validar el código usando la prueba de Resultados enriquecidos y luego implementarlo enviando el mapa del sitio de imágenes a Google para que pueda rastrear e indexar las imágenes.
Para comprender más sobre los datos estructurados y cómo usarlos, consulte nuestro módulo sobre esquema .
Para aprender a crear y enviar mapas de sitios, consulte nuestro módulo detallado sobre mapas de sitios de Google Noticias.
La experiencia de página es un criterio importante que Google utiliza para clasificar las páginas. Uno de los elementos que la componen es la velocidad de carga.
A continuación te mostramos cómo puedes optimizar las imágenes para mejorar la velocidad de carga de la página:
En este método, solo se cargan inicialmente los recursos críticos, mientras que los de baja prioridad se cargan según sea necesario. Las ventajas de la carga diferida incluyen la reducción del tráfico de red, los problemas asociados de ancho de banda y los costes de uso de datos, una mejor legibilidad de páginas largas, la reducción de la carga de imágenes en línea que no aportan valor al contenido, etc.
Crear imágenes responsivas
Los usuarios visualizan imágenes en diversos dispositivos. Implementar el atributo srcset para diferentes dispositivos permite que la imagen se visualice de forma legible en distintos tamaños de pantalla. A continuación, se muestra un ejemplo del código img scrset:
Hemos cubierto los aspectos básicos de la optimización de imágenes. Sin embargo, los puntos que se enumeran a continuación también son muy útiles para optimizar imágenes para SEO.
Ni todas las imágenes del mundo pueden compensar un contenido de baja calidad. El enfoque principal debe ser el contenido orientado a satisfacer las necesidades de los usuarios. Las imágenes deben ser una extensión orgánica del contenido y utilizarse como apoyo en el proceso general de la narrativa. Inundar tu página con imágenes irrelevantes o sin relación no mejorará tu posicionamiento.
Por el contrario, Google se opone a estas prácticas y recomienda usar contenido original siempre que sea posible. Un contenido de alta calidad es la mejor garantía de que tu página tenga un buen posicionamiento en la Búsqueda de Google, incluidas las imágenes que uses.
El contenido que rodea la imagen proporciona información vital a los usuarios y al motor de búsqueda sobre su relevancia. Google recomienda colocar la imagen más importante cerca de la parte superior de la página.
Si bien es un tema de debate si las imágenes ubicadas más abajo en el pagerank tienen el mismo rango que las que están hacia arriba, es mejor seguir las pautas de Google sobre el tema.
Es poco probable que todos sus esfuerzos por optimizar las imágenes den resultados si Googlebot no puede acceder a ellas debido a la configuración de robots.txt o de no indexar.
Estos le indican a Google que no indexe ni rastree tu contenido, lo que significa que no aparecerá en los resultados de búsqueda. Puedes usar la función "Inspeccionar URL" en GSC para comprobar la accesibilidad del contenido y las imágenes.
Además, también recomendamos comprobar si el filtro SafeSearch se aplica a su contenido. SafeSearch es una configuración de usuario proporcionada por Google que permite o bloquea imágenes con contenido explícito y exige que los sitios web etiqueten el contenido adecuadamente .
Las pruebas no solo son importantes para la visibilidad, sino que también son valiosas para comprobar cómo se verán tus imágenes en diferentes dispositivos antes de publicarlas en la página. Google también ofrece contenido visual inmersivo con historias como parte de su formato Web Stories . Si bien esto está diseñado específicamente para ofrecer contenido visual optimizado para dispositivos móviles, las imágenes y el texto también aparecen en Google Imágenes y Discover. Puedes usar la función "Vista previa para desarrolladores" para probar tu contenido y lograr una narrativa más atractiva.
Hay imágenes libres de derechos de autor disponibles en diversas fuentes, como Pixabay, Unsplash y Pexels, entre otras. Si bien su uso es gratuito, recuerda que la misma imagen puede haber sido utilizada por otros creadores de contenido.
Según John Mueller de Google, esto puede dificultar el posicionamiento de la imagen en la búsqueda de imágenes de Google. En la medida de lo posible, intenta usar imágenes originales.
Además de seguir las pautas anteriores, también es importante evitar estos errores comunes para optimizar mejor tus imágenes.
Como se mencionó anteriormente, usar un texto alternativo descriptivo hace que tus imágenes sean más accesibles para los usuarios. Google tendrá en cuenta los atributos de tu texto alternativo y tenderá a posicionarlas mejor.
Sin embargo, es fácil caer en la tentación de saturar las palabras clave con el objetivo de posicionarse bien en las SERP. Esto se conoce como relleno de palabras clave y puede ser perjudicial para tus esfuerzos. No solo puede generar una mala experiencia de usuario, sino que Google también puede considerar tu página como spam .
A continuación se muestran algunos ejemplos de errores que se deben evitar y texto alternativo correctamente elaborado.
Veredicto: Malo, ya que le falta el atributo de texto alternativo.
Veredicto: Malo, debido al relleno de palabras clave.
Veredicto: Bueno, pero debería ser más descriptivo.
Veredicto: Ideal
Aunque Google cuenta con tecnología de reconocimiento óptico de caracteres (OCR) integrada para leer el texto impreso en las imágenes, es posible que no siempre sea 100 % preciso. Además, tanto los usuarios como los motores de búsqueda podrían no ser capaces de descifrar el texto incrustado en la imagen.
Si tienes información importante que transmitir es mejor utilizar texto en lugar de una imagen.
Probablemente no sea posible usar imágenes originales siempre. En tales casos, podrías verte tentado a usar la búsqueda de Google para encontrar nuevas imágenes. Sin embargo, algunas de esas imágenes pueden tener derechos de autor, lo que restringe su uso. Por lo tanto, debes consultar las condiciones de reutilización de la imagen antes de usarla en tu página.
Google Imágenes ofrece un filtro llamado "Derechos de uso" para buscar imágenes con información de licencia asignada por el sitio web o el proveedor de la imagen. Esta función está disponible en la sección "Herramientas", en el cuadro de búsqueda.
Después de seleccionar la imagen, puede consultar los detalles de la licencia para comprender las implicaciones, los costos (si los hay) y los requisitos del uso de la imagen.
Como puede ver en la captura de pantalla anterior, en “Derechos de uso” aparecen las opciones de licencia Creative Commons, Comercial u otras.
Generalmente, las imágenes con licencia Creative Commons son gratuitas, pero pueden requerir que se les dé crédito y se cite la fuente. Las imágenes con licencia comercial suelen tener un costo de uso. Google recomienda revisar los detalles de la licencia antes de usar cualquier imagen en su página.
La configuración "max-image-preview" permite establecer el tamaño máximo de la vista previa de la imagen cuando aparece en los resultados de búsqueda (SERP). Si no hay ningún valor para esta configuración, Google mostrará la imagen en su tamaño predeterminado.
Si bien esto se aplica a todas las superficies de Google, como imágenes, búsqueda y Discover, es más pertinente cuando se usa Discover, donde los formatos más grandes generan una experiencia de usuario más rica.
Se ha documentado que el uso del atributo de vista previa máxima de imagen mejora el CTR y el tráfico para varios editores. Este atributo permite a Google mostrar imágenes grandes en la vista previa tal como están, sin comprimirlas ni modificar su configuración. Tener imágenes grandes y de alta calidad en la vista previa tiene más probabilidades de captar el interés de los usuarios.
Las redes de distribución de contenido (CDN) son plataformas de alojamiento externalizadas que sirven como repositorio de imágenes y otros archivos multimedia. Gracias a su infraestructura avanzada, centrada en la latencia y el ancho de banda, pueden ofrecer velocidades de carga de página más rápidas que el material alojado internamente. Sin embargo, es necesario evaluar las ventajas de las CDN según sus necesidades específicas.
Si bien una CDN puede ayudar a resolver algunos problemas técnicos, puede perjudicar tu perfil de backlinks. Los backlinks son uno de los factores SEO de mayor posicionamiento y son valiosos para la aparición de tu sitio web en los resultados de búsqueda. Puedes obtener más información sobre el valor de los backlinks en nuestro módulo sobre este tema.
Cuando alojas una imagen en una CDN en lugar de en tu propio sitio, cualquier vínculo de retroceso a ella llevará al usuario a la ruta de la CDN para la imagen, reduciendo así las visitas directas a tu sitio que habría proporcionado un vínculo de retroceso efectivo.
Un paquete de imágenes es un collage de imágenes de diferentes sitios web que pueden aparecer en las SERP de Google. Su aspecto es similar al siguiente.
Sin embargo, al hacer clic en cualquiera de las miniaturas, no se te redirige automáticamente al sitio de origen. En su lugar, se muestra una ventana de Google Imágenes con una versión ampliada de esa imagen, como esta.
Solo al hacer clic de nuevo en la imagen (como se ve en el panel derecho de la captura de pantalla anterior) saldrás de Google y accederás a la página de origen. En otras palabras, Google Imágenes actúa como intermediario antes de que se complete la acción de enrutamiento.
Si tu imagen forma parte de un paquete de imágenes, Google Search Console (GSC) registrará una impresión de esa imagen cada vez que el paquete se cargue en una página de resultados de búsqueda (SERP). Esto se debe al atributo title de la etiqueta de imagen, que contiene tu URL.
Pero si bien puede registrar una gran cantidad de impresiones, es probable que la cantidad real de clics en su sitio sea mucho menor gracias al hecho de que los paquetes de imágenes contienen enlaces de refinamiento de consultas que generan un nuevo resultado de búsqueda de imágenes de Google en lugar de dirigir a los buscadores fuera de la plataforma.
Debido a la forma en que funcionan los enlaces de refinamiento de consultas, así como a cómo GSC cuenta las impresiones y los clics, los paquetes de imágenes pueden distorsionar drásticamente su tasa de clics (CTR) para las imágenes.
Ahora pasamos a un estudio de caso de un sitio web para deconstruir cómo ha implementado las pautas mencionadas en este módulo para optimizar las imágenes.
Kirbie Cravings es un blog gastronómico de San Diego que ha publicado cientos de recetas en su sitio web. Cada receta viene acompañada de imágenes vívidas y de alta calidad.
Cuando hacemos clic derecho en la página y vemos su código fuente, vemos el atributo max-image-preview:large en el<head> elemento justo al principio del código fuente.
Como resultado, las imágenes de alta calidad del editor aparecen en las vistas previas en las superficies de Google.
Al mismo tiempo, a pesar de ser grandes, estas imágenes no ralentizan el tiempo de carga de la página.
Hacemos clic derecho en la imagen y seleccionamos "Inspeccionar". Esto abre un panel a la derecha de la página donde podemos inspeccionar las propiedades del elemento seleccionado. Vemos lo siguiente para la imagen anterior:
Vemos dos cosas interesantes aquí:
Como comentamos anteriormente, las imágenes aportan la mayor parte del peso de una página, por lo que mantenerlas livianas es esencial para acelerar la carga de la página.
También hemos hablado de la importancia de usar el formato de archivo correcto. Recomendamos .jpg/.jpeg para fotografías, mientras que .png debería usarse para gráficos e imágenes digitales. A continuación, podemos ver que Kirbie Cravings usa .png siempre que utiliza imágenes digitales, como logotipos e iconos.
A continuación, dentro de este mismo panel de inspección, cuando hacemos clic en “Propiedades” podemos ver que la página ha utilizado la carga diferida, a pesar del peso relativamente ligero de las imágenes.
Esta página ha optimizado meticulosamente sus imágenes mediante:
A medida que evoluciona para servir mejor a las necesidades de sus usuarios, Google seguramente agregará/actualizará funciones y políticas relacionadas con la optimización de imágenes y su impacto en los resultados de búsqueda.
Si tiene en cuenta las mejores prácticas de imagen actuales cuando se trata de su sitio web, estará mejor posicionado para brindar la mejor UX, tener una clasificación más alta en los SERP y, eventualmente, generar tráfico en su dirección.
Activo ahora
Ver más
