Hoy vamos a ver cómo comprimir o reducir el tamaño de una imagen JPG o JPEG utilizando la herramienta o software llamado ImageMagick.
Gracias a este software podremos comprimir una imagen o modificar la calidad de la misma con un simple comando.
Como lo dije, vamos a usar imagemagick. Mira aquí cómo se instala en Windows, también asegúrate de agregarlo a la PATH (en el post que enlazo está cómo hacerlo).
Una vez que tienes imagemagick en la PATH abre una terminal o CMD, navega hasta el lugar en donde está la imagen y ejecuta:
magick convert -strip -interlace Plane -quality 50% original.jpg comprimida.jpg
Voy a explicar los parámetros de compresión de la imagen.
quality
: El porcentaje de calidad, entre menor calidad, menor peso
original.jpg
: el nombre de la imagen original
comprimida.jpg
: el nombre que tendrá la imagen comprimida
Obviamente puedes cambiar la calidad, pero entre más baja, la imagen se aprecia menos.
Si quieres reducir todavía más la imagen, puedes aplicar un desenfoque gaussiano; la imagen se ve un poco borrosa o desenfocada pero reduce el tamaño de manera notable.
El comando sería:
magick convert -strip -interlace Plane -gaussian-blur 0.05 -quality 50% original.jpg comprimida_50_gaussian.jpg
Lo que estamos agregando es la opción de -gaussian-blur
con el valor de 0.05
En mi caso comprimí las imágenes y aquí expongo los resultados.
Peso: 106 KB
Peso: 59.9 KB
Peso: 46.4 KB
Como puedes ver, se puede reducir el tamaño hasta en un 50 %.
Si no quieres ejecutar el comando imagen por imagen, respalda tus imágenes originales y luego ejecuta (en donde están todas las imágenes que vas a comprimir) lo siguiente:
magick mogrify -strip -interlace Plane -quality 50% *.jpg
(fíjate que ahora usamos mogrify
como en otro tutorial)
En este caso las imágenes serán comprimidas usando ImageMagick, pero serán comprimidas en el mismo lugar; es decir, se van a sobrescribir (por eso dije que hagas un respaldo)
Al comparar tamaños tenemos:
Recuerda que el tamaño de las imágenes afecta en la velocidad de un sitio web, por ello es importante que comprimas tus imágenes o que utilices lazy loading.
Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…
En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…
En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…
Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…
En este artículo te voy a enseñar cómo usar un "top level await" esperando a…
Ayer estaba editando unos archivos que son servidos con el servidor Apache y al visitarlos…
Esta web usa cookies.