Categorías

Optimización de la imagen: Todo lo que necesita saber

La optimización de imágenes es una práctica conocida de SEO. Aquí tienes 11 consejos de optimización de imágenes que debes conocer.

La optimización de imágenes consiste básicamente en optimizar tus imágenes para que se posicionen en Google. ¿Pero cómo se optimizan las imágenes? En este artículo, hablamos con más detalle de lo que es la optimización de imágenes, y te damos 11 consejos de optimización de imágenes que debes conocer para mejorar el SEO.

¿Qué significa optimizar las imágenes?

Si pudiera resumir la optimización de la imagen en una palabra, diría eficiencia.

La optimización de la imagen es, fundamentalmente, un equilibrio entre tener imágenes de alta calidad, es decir, hacer que una imagen se vea lo mejor posible y que ocupe el menor espacio (y ancho de banda) posible. 

Aquí hay una explicación más detallada de lo que quiero decir:

Sabemos que las grandes cantidades de datos tardan más en transferirse por Internet.

En otras palabras, los archivos de imagen de mayor tamaño requieren una mayor velocidad de carga. Las imágenes más grandes (en tamaño de archivo, no necesariamente en tamaño de píxel) tienen tiempos de carga más largos.

Por otro lado, una imagen de menor tamaño (imágenes, en nuestro caso) puede no ser de tan alta calidad como un archivo de mayor tamaño. (No es una afirmación absoluta, pero en igualdad de condiciones, suele ser así).

ajustes del tamaño de la imagen optimización de la imagen de wordpress

Las ventajas de formatear las imágenes

Por lo tanto, lo que queremos decir con la optimización de imágenes es exactamente eso: hay un equilibrio entre el tamaño del archivo (tiempo de carga) y la calidad visual. Ese es el verdadero beneficio aquí. Afortunadamente, con los consejos que se enumeran a continuación, debería ser capaz de reducir significativamente el tamaño del archivo de imagen de casi cualquier imagen, al tiempo que conserva gran parte de su calidad visual.

Por qué es importante la búsqueda de imágenes

A continuación, hablo de nombrar correctamente tus imágenes (es decir, los nombres de los archivos) y del texto alternativo. Estos son factores clave para ayudar a que tu imagen sea encontrada en una búsqueda de imágenes. Seguramente sabes que puedes limitar una página de resultados de búsqueda de Google para que sólo muestre imágenes. Optimizar tus imágenes para el SEO, ayuda a que tu imagen aparezca en la parte de imágenes de los resultados de búsqueda.

cámara google search seo optimización de imágenes

11 importantes consejos de SEO para imágenes que debe conocer

Los siguientes 11 consejos de optimización de imágenes deberían darle una sólida comprensión de lo que necesita hacer exactamente para tener imágenes que se vean bien y se carguen rápidamente.

Consejo#1: Crear imágenes únicas

Con las avanzadas tecnologías de reconocimiento de imágenes de hoy en día, crear imágenes únicas u originales puede ser una ventaja, sobre todo si te dedicas a un mercado orientado a la imagen (como la fotografía de bodas) y quieres destacar.

Consejo #2: Elija bien las dimensiones de la imagen y los ángulos del producto

Afortunadamente, las dimensiones de las imágenes se pueden escalar proporcionalmente. La mayoría de las plataformas modernas de creación de sitios pueden escalar una imagen grande (es decir, grande en píxeles) para que se ajuste a la mayoría de las pantallas. Dicho esto, es preferible que las dimensiones de su imagen se ajusten a los tamaños de pantalla modernos. De este modo, podrá controlar mejor cómo se mostrará la imagen en la mayoría de las pantallas. 

Puedes optar por un tema responsive ya que puede convertir las imágenes en una imagen responsive. Una imagen responsiva es aquella que ha sido codificada para que funcione bien en una variedad de tamaños de pantalla, desde la pantalla del escritorio hasta la del móvil.

Sin embargo, si tu tema no es responsivo, también hay algunos plugins de optimización de imágenes que puedes añadir a tu sitio y que pueden ayudar a que tus imágenes sean responsivas.

Consejo#3: nombre su imagen de forma descriptiva y en lenguaje sencillo

Este consejo se refiere al nombre de archivo que se utiliza para la imagen. El texto de los nombres de archivo puede ser indexado y buscado. Por lo tanto, en lugar de utilizar un nombre de archivo predeterminado como imagen1.jpg, cambie el nombre de la imagen por el de su palabra clave objetivo para ayudar a clasificarla por ese término y obtener más tráfico de búsqueda de imágenes de Google.

Consejo#4: Elija el formato adecuado

Por formato de los archivos de imagen, me refiero al tipo de archivo (o extensión): las imágenes .jpeg, .gif y .png se encuentran entre las extensiones de archivo de imagen más establecidas.

Pero hay uno relativamente nuevo que merece atención: WebP.

Aunque probablemente pueda optimizar imágenes de cualquier formato, dependiendo del contenido de la imagen, algunos formatos son más adecuados que otros.

El que voy a analizar aquí es WebP, que es un formato de archivo desarrollado por Google. En comparación con las imágenes .png, las imágenes sin pérdidas de WebP pueden tener un tamaño 26% menor, y en comparación con las .jpgs, las imágenes con pérdidas de WebP tienen un tamaño 25-34% menor.

Por lo que he visto, WebP está siendo aceptado lentamente como un formato de archivo de imagen viable. Puede que aún no se haya puesto de moda (los otros formatos llevan años y años), pero ya que estamos hablando de optimización de imágenes, su menor tamaño de archivo lo convierte en un formato a tener en cuenta.

Tip#5: Imágenes vectoriales
consejos de optimización de imágenes rasterizadas vs vectoriales

Uno de los problemas de algunos formatos de imagen es que, al ampliarlos, pueden parecer pixelados. No es el caso de las imágenes vectoriales: pueden ampliarse sin que se produzca ningún tipo de pixelación (así, las líneas redondas del original siguen conservando su suavidad independientemente de cuánto se haya ampliado).

Consejo#6: Piense en la estructura del archivo de imagen

La estructura de los archivos (o mejor dicho, la estructura de las carpetas), es más bien algo de lo que se tienen que preocupar los webmasters.

En definitiva, es la jerarquía de carpetas en la que, en nuestro caso, se encuentra la imagen.

Por ejemplo, su imagen podría encontrarse en:

site.com/content/images/2021/my-image.jpg

O, tal vez es en:

site.com/my-image.jpg

En general, suele ser bueno almacenar los archivos más cerca de la página de inicio (tener menos carpetas dentro de las carpetas), pero esto depende realmente de su plataforma de creación de sitios web.

Consejo#7: Escriba un texto alternativo que sea fácil de encontrar.

En un momento, explicaré qué es el texto alternativo, pero básicamente, al igual que quieres tener nombres de archivo descriptivos, para el texto alternativo (que no son nombres de archivo), sólo quieres tener un texto que describa el contenido de la imagen.

¿Qué son las etiquetas Alt y el texto Alt?

Alt es la abreviatura de alternativa.

Texto alternativo es el término técnicamente correcto, mientras que el término etiqueta altaunque no es tan preciso desde el punto de vista técnico, se utiliza indistintamente con el texto alternativo.

No sé si alguna vez has visto que una imagen no se carga: a veces, puedes ver un texto que describe el contenido de la imagen que no se ha cargado. Ese texto es un texto alternativo. El texto alternativo puede ser bueno para las personas que tienen problemas de visión: su software lector de pantalla puede leer el texto alternativo y comunicarlo de una manera que la persona no podría entender de otra manera. 

Además, los robots o rastreadores de búsqueda no tienen ojos y también se basan en el texto alternativo para "leer" lo que es la imagen.

También es una buena práctica seo añadir la palabra clave de destino en el texto alternativo. Utiliza tus palabras clave sabiamente y evita el relleno de palabras clave. Una forma de evitar el relleno de palabras clave es utilizar otras palabras clave relevantes y variaciones de sus palabras clave en nuestras etiquetas de imagen alt y texto alt.

Consejo#8: Precaución al proporcionar imágenes más grandes

Las imágenes excesivamente grandes (ya sea en tamaño de píxel o en tamaño de archivo) pueden consumir más recursos (tanto en tamaño de pantalla como en memoria/ancho de banda).

Aunque la Internet moderna puede manejar archivos de gran tamaño, como estamos hablando de SEO, es bueno recordar que se busca un equilibrio entre la cantidad (tamaño) y la calidad (atractivo visual).

Consejo#9: Considere la calidad de la compresión frente al tamaño

Una técnica de optimización de imágenes que aún no he mencionado es la compresión.

La compresión de imágenes es básicamente un proceso en el que se reduce el tamaño del archivo de una imagen, al tiempo que se intenta mantener la calidad de la misma. Dependiendo del método que se utilice para comprimir imágenes, se puede reducir significativamente el tamaño del archivo de una imagen sin casi ninguna pérdida distinguible en el nivel de calidad de la imagen.

diagrama general de compresión de imágenes looseless vs loosy
Tip#10: Optimización con pérdidas o sin pérdidas
seonitro - lossless vs lossy Imagen

Los dos tipos generales de compresión de imágenes son la compresión sin pérdidas y la compresión con pérdidas.

La forma más sencilla de distinguir entre lossless y lossy es la siguiente: La prioridad de Lossless suele ser la calidad en primer lugar, y el tamaño del archivo en segundo lugar. La prioridad de Lossy es la reducción del tamaño del archivo y la calidad en segundo lugar. (También se puede pensar en la palabra lossless como loss-less, es decir, menos pérdida de calidad).

Dicho esto, lo que he mencionado anteriormente puede ser una simplificación excesiva, pero es una manera muy fácil de pensar en lossy y lossless.

Consejo #11: ¿Ha pensado en la carga lenta?
optimización de imágenes de sitios web de carga lenta

Antes de describir la carga lenta, tengo que dar unos pasos atrás y proporcionar algo de contexto.

El SEO (optimización de motores de búsqueda) debe ir de la mano de la experiencia del usuario (UX).

El tiempo que tarda una página en cargarse (a veces llamado velocidad de la página) es un factor de la experiencia del usuario. Se dice que la gente no quiere esperar más de 3 segundos a que se cargue una página.

De hecho, se ha dicho que si la velocidad de las páginas de ciertos sitios de grandes minoristas aumentara tan sólo un segundo (es decir, si tardan un segundo más de lo habitual en cargarse), podría suponer una pérdida de millones de dólares al año (simplemente porque la gente no espera a que las páginas se carguen).

Sabemos que todos los archivos (imágenes) necesitan ancho de banda y, por tanto, tiempo para cargarse. Cuanto mayor sea el tamaño de los archivos y el número de imágenes, más tardará la página en cargarse.

¿Y si su página tiene muchas, muchas imágenes?

Bueno, hay algo que se llama "lazy loading".

Básicamente, sin la carga perezosa, una página web lo cargará todo (todas las imágenes y archivos) independientemente de que el usuario se desplace hasta ellos.

En otras palabras, un usuario puede llegar a su página, ver que tarda en cargarse (más de 3 segundos) y abandonarla.

Por otro lado, con la carga perezosa, las imágenes no se cargan hasta que el usuario se desplaza hasta ellas.

Así, un usuario puede llegar a su página y ver rápidamente la primera de las muchas imágenes. Si quiere ver más, puede desplazarse (y esas otras imágenes se cargarán a medida que el usuario se desplace hasta ellas).

De esta manera, con la carga lenta, la página (aunque no la página completa) se carga rápidamente (para que el usuario no tenga que esperar a que se cargue todo). Si quieren ver más, pueden desplazarse, y en ese momento las otras imágenes se cargarán según sea necesario.

Esto aumenta efectivamente la velocidad de la página (para el usuario) y puede reducir el uso del ancho de banda (porque si el usuario decide no seguir desplazándose, al menos esos activos no se han cargado innecesariamente).

Otra opción a tener en cuenta si tienes un número de imágenes en tu página (un ejemplo es si te dedicas al comercio electrónico y tienes un número de imágenes de productos que mostrar, o si tienes alguna imagen animada que pueda ocupar un gran tamaño de archivo) es utilizar una Red de Entrega de Contenido. La idea detrás de una CDN es que si un visitante está geográficamente más cerca del servidor que aloja su sitio, entonces la experiencia de ese usuario será mejor que la de otro que esté más lejos. Esto se debe a que, debido a la proximidad geográfica, su sitio se cargará más rápido para el usuario local. 

Una CDN es una red de servidores repartidos por diferentes ubicaciones geográficas del mundo. Estos servidores alojan su sitio a los visitantes que están más cerca de ellos, lo que resulta en tasas más rápidas de transferencia de datos y una velocidad de carga más rápida para su sitio.

Mejore sus técnicas de optimización de imágenes

Esperamos que este artículo le haya proporcionado consejos útiles para optimizar las imágenes de su sitio. Recuerde siempre apostar por imágenes de alta calidad sin dejar de considerar el equilibrio entre calidad y velocidad. Si sigues los consejos de optimización de imágenes mencionados anteriormente, es muy probable que crees una mejor experiencia de usuario y tengas un mejor posicionamiento SEO para tu sitio.

DK Fynn

SIA STAFF SEO WRITER

DK Fynn biografía completa aquí.