Igual no sabías, que el tamaño de las imágenes es de lo que más afecta en muchos casos al rendimiento de tu web. Por ello, es tan importante comprimir las imágenes que subes a tu blog o sitio web, y esto podría hacerte ganar posiciones en Google…

Te cuento cómo comprimir imágenes para subir a tu web y mejorar el rendimiento. También te dejo algunos plugin y herramientas gratuitas que te van a ser muy útiles para reducir y comprimir imágenes.

¿Por qué afectan las imágenes al rendimiento?

Si cargas imágenes demasiado grandes o increíblemente pesadas, va a afectar al tiempo de carga de tu sitio web. Porque deberán descargarse cuando alguien accede a tu web.

Incluso usando técnicas de carga diferida de imágenes (las imágenes cargan más tarde) dará una sensación de lentitud si tus imágenes son pesadas y tardan en aparecer.

Normalmente, es uno de los principales motivos. Uno coge cualquier foto de la cámara o de stocks gratuitos, y la sube tal cual. Y esto es un error grande, ya que hará que la página tarde más en cargar. Además de llenar el espacio en disco de tu servidor.

Aprende más métodos para mejorar la velocidad de carga de tu web.

Además, recuerda que la velocidad de carga de tu web afecta a tu posición en google.

¿Afecta a la calidad de las imágenes?

Igual te preguntas, si no va a empeorar la calidad de las imágenes el reducirlas y comprimirlas. Bien, normalmente sí. Sólo que no es algo que se aprecie lo suficiente como para que valga la pena preocuparte, salvo que te dediques a la fotografía (e igualmente, valdría la pena realizar algún tipo de compresión y reducción a las imágenes de tu web).

Te dejo aquí ejemplos de imágenes comprimidas para que compares. No las incluyo directamente aquí, porque aumentaría demasiado el tiempo de carga de esta entrada. 😉

¿Cómo reducir el tamaño de imágenes para tu web?

Te cuento en primer lugar de qué forma puedes reducir las imágenes de tu web sin plugins.

Redimensionar imágenes

Para redimensionar tus imágenes, cambiando el tamaño de la foto o imagen, tendrás que usar un editor de imágenes. Por ejemplo: Photoshop, Gimp o incluso Paint. Y estas dos últimas son gratuitas.

¿Cuáles son las dimensiones adecuadas para subir una foto a la web?

Dependerá mucho de la web y del uso de la imagen. Te dejo algunas pautas que yo suelo seguir:

  • En imágenes que aparecerán en contenido:
    • Si son de ancho completo, un ancho de 800 pixels.
    • Para imágenes que ocupan media pantalla o menos en PC y completa en móvil, 300 a 600 pixels, según el caso.
  • Para imágenes que aparecerán como imagen destacada en Facebook: Ancho 1200 pixels. Puedes ver aquí más sobre los tamaños para imagen destacada en Facebook.

Para la altura, simplemente mantengo las proporciones. En algunos casos, también puedes plantearte recortarlas a los tamaños recomendados.

Comprimir imágenes

Para comprimir tus imágenes puedes utilizar el mismo Gimp o Photoshop, al guardar te dan opciones para decidir cuánta compresión quieres aplicar a las imágenes.

A veces si tienes la imagen en formato PNG te puede valer la pena convertirla a JPG de paso. En ocasiones vale la pena probar ambos formatos y ver cuál te da una mayor compresión.

Yo suelo utilizar formato JPG con una reducción al 80% para imágenes que van a ir en el contenido

Usar Gimp para reducir y comprimir imágenes

Yo hace muchos años que empecé a usar Gimp como editor de imágenes. Es similar a Photoshop, solo que gratis y open source. Igual un poco más compleja de usar, aunque para lo básico no hace falta saber mucho. Muy recomendable.

Método óptimo para comprimir imágenes para tu web sin plugins

  1. Redimensionar y comprimir la imagen con un editor como Gimp o Photoshop.
  2. Aplicar una segunda compresión con https://tinypng.com/.
  3. Ya tienes tu imagen reducida lista para subir a la web.

Aquí puedes verlo en el siguiente vídeo:

Plugin gratuito de WordPress para comprimir imágenes automáticamente

Otra opción si la prefieres, para no tener que preocuparte de comprimir cada foto si te resulta engorroso, sería utilizar un plugin gratuito de WordPress.

En este caso, el plugin WP Smush te será muy útil. Con la versión gratuita, puedes comprimir todas las imágenes que ya tienes subidas a tu web, y redimensionarlas (por bloques) además de todas las nuevas fotos que subas a tu web.

Para ello debes configurar, marcando las opciones:

  • Reducir automáticamente mis imágenes al subirlas.
  • Eliminar los metadatos de mi imagen (recomendado por seguridad, salvo que te dediques a fotografía).
  • Redimensionar mis imágenes originales. Recomendaría dejar el máximo en 1200 x 800. O deja más altura si usas infografías por ejemplo.

Aquí te dejo como ejemplo la configuración de uno de mis blogs:

Cómo comprimir imágenes con un plugin gratuito de WordPress
Cómo configurar WP Smush para comprimir y redimensionar automáticamente

¿Dónde conseguir imágenes gratis?

Y si te preguntas dónde conseguir buenas fotos gratuitas con licencia gratuita para uso comercial, te dejo las referencias que yo utilizo.

¡Ya tienes algo que hacer! Comprime ya las fotos de tu web. 🙂