No importa qué tan optimizado esté su sitio web, las imágenes siempre serán uno de los elementos de carga más lenta en la página. Si desea acelerar WordPress al máximo, debe implementar una estrategia que apunte específicamente a las imágenes, también conocida como optimización de imágenes en WordPress.

La publicación de hoy comparte seis consejos rápidos para optimizar la imagen al reducir el tamaño del archivo, todo en nombre de la velocidad. Si quieres un sitio web de WordPress ultrarrápido, ¡sigue leyendo!

Optimización de imágenes en WordPress tip #1: elige el tipo de archivo correcto

Cuando utilice Photoshop y otro software de edición de imágenes, puede especificar el tipo de archivo que desea guardar. La gran mayoría de las imágenes en línea se encuentran en dos formatos de archivo: JPEG y PNG.

Entonces, ¿cuál deberías usar? Bueno eso depende. Ambas opciones tienen ventajas y desventajas, y la elección depende en gran medida del escenario.

  • JPEG : JPEG es la mejor opción para fotografías y otras imágenes que muestran una gran variedad de colores. También se pueden comprimir, sacrificando la calidad por una reducción del tamaño del archivo.
  • PNG : los PNG ganan para gráficos, dibujos, texto y algunas capturas de pantalla. También admiten transparencia, a diferencia de los archivos JPEG. Este formato utiliza compresión sin pérdidas, lo que da como resultado archivos de mayor calidad pero también más grandes.

Por lo general, el formato de archivo está determinado por el tipo de imagen con la que estamos trabajando, como se describe anteriormente. Sin embargo, ¿cuál es la consecuencia de elegir el formato de archivo incorrecto , en términos de tamaño de archivo?

Bueno, echemos un vistazo a algunos escenarios para probar esto.

Esta captura de pantalla de tamaño completo de mi tablero de WordPress tenía 150 kb en formato PNG, pero 259 kb como JPEG. Recuerde, las capturas de pantalla suelen ser el dominio de PNG: el JPEG es un 75% más voluminoso.

Ejemplo de optimización de imágenes en WordPress: captura de pantalla PNG

(Nota del editor. Los PNG hacen un gran trabajo para la mayoría de las capturas de pantalla, pero no para todas. Si tiene una captura de pantalla de algo que usa más de un puñado de colores, es decir, cuando su captura de pantalla contiene una fotografía en algún lugar, está aún mejor con JPG.)

Sin embargo, la versión de tamaño completo de esta foto que tomé durante las vacaciones arroja resultados opuestos. La foto en formato JPEG es de 1,26 mb; el PNG la friolera de 7.23mb. Eso significa que el PNG es un 550% más grande (¡ay!).

Ejemplo de optimización de imagen en WordPress: imagen JPEG

Esto demuestra cuán importante es el formato de archivo correcto para el tamaño de sus imágenes. Si se le presiona, siga la siguiente regla:

La imagen recortada:

Imagen recortada

Por supuesto, el beneficio de recortar es que, al igual que cambiar el tamaño, reduce las dimensiones de la imagen, reduce el tamaño del archivo y, por lo tanto, es una excelente manera de optimizar la imagen en WordPress.

4. Baja calidad de imagen (compresión con pérdida)

Cuando haya terminado de recortar y cambiar el tamaño de sus imágenes, puede disfrutar de más reducciones en el tamaño de los archivos comprimiéndolas. Esta técnica es particularmente efectiva y popular para archivos JPEG, aunque los PNG también se pueden comprimir.

Ahora, JPEG admite un tipo de compresión llamado compresión con pérdida . Esto significa que algunos de los datos de la imagen se eliminan para reducir el tamaño del archivo.

Por ejemplo, si dos píxeles adyacentes muestran la más mínima diferencia de color, podemos hacerlos iguales. El cambio es apenas detectable a simple vista, pero al tener menos colores, el tamaño del archivo es bajo.

Al guardar un archivo JPEG con un software de edición de imágenes, se le pedirá que seleccione un puntaje de calidad de 0 a 100. Esto es esencialmente una compensación entre la calidad de la imagen y el tamaño del archivo.

  • Puntuación más alta: compresión más baja; mejor calidad; tamaño de archivo más grande.
  • Puntuación más baja: mayor compresión; baja calidad; tamaño de archivo más pequeño.

En términos generales, los pequeños cambios en el puntaje de calidad hacen poca diferencia en la calidad general de su imagen. De hecho, es poco probable que sus visitantes puedan notar la diferencia.

Para ilustrar esto, vea las dos fotos a continuación. Uno tiene un puntaje de calidad de 100, uno de 80. ¿Cuál es cuál?

Optimización de imagen en WordPress fotografía A:

Fotografía A

Fotografía B:

Fotografía B

Haga clic aquí para revelarLa fotografía B tiene una puntuación de calidad de 100.

Es difícil notar la diferencia, ¿verdad? Sin embargo, cuando se trata de tamaños de archivos, la diferencia es el día y la noche: 418kb frente a 90kb.

Sin embargo, no puede seguir bajando la calidad para siempre, ya que en algún momento, la caída de la calidad se notará. La siguiente imagen tiene una puntuación de calidad de 20:

Imagen de menor calidad

Claro, puede que solo sea de 28 kb, pero no me gustaría tener esto en mi sitio web, ¿y tú?

Ahora, no existe una regla de oro para el nivel de compresión perfecto. Sin embargo, contrariamente a la intuición, cuanto más compleja sea la imagen, más podrá bajar la calidad en su camino hacia la optimización de imagen definitiva en WordPress.
Si está buscando una manera simple de hacer esto usando complementos, consulte los mejores complementos de optimización de imágenes de WordPress para ver cómo funciona cada uno.

5. Servir imágenes en un CDN

Todo en línea sucede en un instante, ¿verdad? Pues no, en realidad. Las distancias geográficas entre la ubicación de un visitante y el servidor de su sitio web tienen un impacto en la velocidad del sitio: cuanto mayor sea la distancia, más larga será la espera.

Para resolver este problema de latencia, considere instalar un CDN. Los CDN almacenan su sitio web en múltiples servidores repartidos por todo el mundo, luego conectan a sus visitantes con el que está geográficamente más cerca de ellos. Problemas de latencia resueltos, su sitio web se sirve más rápidamente.

Si desea acelerar WordPress, le complacerá saber que el complemento Optimole se envía con su propio CDN gratuito, solo para imágenes.

Todo lo que necesita hacer es instalar y activar Optimole. Voilà , tus imágenes se mostrarán en un tiempo récord.

Para conocer algunas soluciones de CDN más complejas, y también mejores, consulte nuestra otra publicación .

6. Obtenga carga perezosa

De forma predeterminada, el software de WordPress trata todas las imágenes por igual. Sin embargo, esto es claramente un uso ineficiente de los recursos, y especialmente si desea optimizar imágenes en WordPress.

Después de todo, una imagen en la parte inferior de la página no se verá hasta mucho más tarde que la imagen en la parte superior de la página. ¿No merece prioridad la primera imagen?

Priorizar imágenes es exactamente lo que logra la carga diferida. Las imágenes en la parte superior de la página tienen prioridad, mientras que las imágenes debajo del pliegue se cargan solo cuando el visitante se desplaza hacia abajo en la página. Esto hace que la carga diferida sea el equivalente «justo a tiempo» de la carga de una página web.

Si desea utilizar la carga diferida para acelerar WordPress, Optimole le ayudará de nuevo. Lo bueno de este complemento es que ofrece una función de marcador de posición de imagen de baja calidad, también conocida como carga diferida de una imagen intermedia de baja calidad hasta que la imagen de tamaño completo se muestra por completo .

Es completamente gratis , también.

A ti

Y eso concluye nuestro resumen de seis consejos rápidos que lo ayudarán con la optimización de imágenes en WordPress. Como puede ver, al combinar varias de estas estrategias, puede ahorrar mucho en el tamaño de los archivos de sus imágenes. Sus visitantes lo amarán por esto, ¡y su sitio web se cargará significativamente más rápido!

Optimizar sus imágenes es realmente muy simple si está utilizando un complemento como Optimole , que hará todo el trabajo automáticamente (y en su mayoría de forma gratuita).

Si tiene alguna pregunta sobre optimización de imágenes, ¡compártala en la sección de comentarios a continuación!

¿Quieres que tu sitio web sea aún más rápido?  No se olvide de nuestro curso de correo electrónico gratuito sobre cómo acelerar WordPress: 

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Nuestra web usa cookies para mejorar tu experiencia.