ramonjosegn
Sigma
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario popular!
Hola, chicos/as. Como muchos sabéis en los últimos años ha habido un interesante esfuerzo por conseguir formatos de imagen más ligeros para poder publicar en web.
Así es como nacen formatos como webP (de Google), flif (FLIF - Free Lossless Image Format), BPG (BPG Image format) y otros más.
webP tiene cierto soporte para navegadores como Chrome y Opera (y otros basados en Chrome) pero es complejo de manejar, necesita etiquetas especiales o algún servicio CDN que lo soporte (y no he tenido buena experiencia usando ese tipo de servicios CDN).
Mozilla no pareció mirar con muy buenos ojos el formato webP (de hecho todavía no hay una implementación completa en su navegador Firefox), y optaron por seguir otro camino.
Mozilla parece haberse plantenado ¿por qué no seguir usando JPEG PERO CON ALTERACIONES SECRETAS en la imagen?
Así fue como, por parte de Mozilla, nació MozJPEG, en realidad el mismo formato JPEG donde se alteran algunos parámetros para obtener unas compresiones brutales, a veces casi cercanas a webP (pero eso va a depender del archivo, por lo general se dice que MozJPEG comprime un 5% más que JPEG estándar y webP un 30% más que el formato JPEG estándar).
VENTAJAS DE WEBP - Comprime un 30% más que JPEG
DESVENTAJAS DE WEBP - Sólo compatible con Chrome (y derivados), necesita etiquetas especiales, no se puede descargar y visualizar (excepto con visores especiales), no hay apenas software de compresión (Irfanview, XNview y alguno más). No ha seguido evolucionando. No hay apenas plugins para WordPress.
VENTAJAS DE MOZJPEG - Comprime un 5% más que JPEG. Compatible con todos los navegadores. Puedes bajar el archivo y visualizarlo en la mayoría de navegadores modernos. Puedes insertarlo en casi cualquier aplicación que soporte JPEG. Puedes usarlo en WordPress como cualquier otro formato de imagen habitual.
DESVENTAJAS DE MOZJPEG- Sólo he encontrado un addon para GIMP para compresión y un par de servicios online, el demás software que he podido revisar es mediante línea de comandos.
Otro día trataré de armar un tutorial sobre GIMP + plugin MOZJPEG pero hoy lo que quiero mostraros es un servicio online que utiliza MOZJPEG.
El servicio se encuentra en estado ALPHA, es decir, todavía puede tener errores y de hecho he visto que en ocasiones algunas imágenes parece no soportarlas.
Pero ahí vamos con el tutorial y espero que os resulte de utilidad el servicio.
PASO 1. -
Ingresamos al sitio web
mozjpeg | codelove
https://mozjpeg.codelove.de/
Podréis ver que la interfaz no es nada compleja.
PASO 2. -
Fíjate que el sitio web sólo acepta los siguientes formatos
jpg,bmp,targa
Además he visto que archivos muy pesados pueden no ser procesados (recuerda que el servicio está en estado alpha)
Tendrás que elegir un archivo original en alguno de esos formatos.
PASO 3. -
A continuación establecemos el nivel de compresión para nuestro archivo.
EL VALOR RECOMENDADO PARA EVITAR LA MÍNIMA DEGRADACIÓN VISUAL ES ENTRE 60 Y 90.
Por supuesto puedes escoger valores por debajo de 60 para obtener compresiones brutales, pero también verás que la imagen comienza a sufrir pérdidas visuales importantes.
Por lo tanto movemos el deslizador a la opción deseada. He comprobado que valores sobre 75 ofrecen una excelente compresión/calidad para web.
Así que voy a poner el deslizador en ese nivel.
IMPORTANTE - Debemos ajustar el valor ANTES DE SUBIR EL ARCHIVO (esperemos que en el futuro mejoren esta opción y se pueda cambiar una vez subida la imagen para ver los cambios en tiempo real).
PASO 4. -
Arrastramos la imagen que deseamos comprimir SOBRE EL PRIMER CUADRO desde nuestra computadora.
En mi caso voy a escoger esta imagen de PIXABAY la cual he descargado con un tamaño de 1920 x 1440 y que pesa 702kbs.
https://pixabay.com/es/piscina-hotel-océano-playa-bahamas-115851/
Se mostrará una barra de carga en la parte inferior indicando el nivel de subida del archivo.
PASO 5. -
Esperamos unos segundos y posteriormente aparecerá la imagen comprimida en la segunda caja (una vista previa).
Debajo de la caja se mostrará información sobre el tamaño de la imagen comprimida.
En nuestro ejemplo hemos pasado de tener una imagen de 702 kbs a 275 kbs lo cual es una compresión muy buena.
PASO 6. -
Hacemos clic en el botón ROSADO QUE DICE - download image y se iniciará la descarga de nuestra imagen comprimida
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN FINAL (aplicada compresión, peso 275 kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 50 (peso 166kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 30 (peso 111kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 10 (peso 41kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
NOTAS FINALES
Si quieres comprobar otros niveles de compresión tendrás que repetir DESDE EL PASO 4, pues como había comentado el sistema NO PERMITE COMPRIMIR EN TIEMPO REAL, por lo que tendrás que arrastrar el deslizador de nuevo, y volver a subir la imagen.
Si no quieres tener pérdidas visuales puedes escoger la opción lossless (pero sólo acepta archivos JPEG). En nuestro ejemplo la imagen quedaría comprimidad en a 655 kbs.
Espero que os haya gustado el tutorial.
Si tienes alguna duda trataré de responderla en la medida que me sea posible.
Así es como nacen formatos como webP (de Google), flif (FLIF - Free Lossless Image Format), BPG (BPG Image format) y otros más.
webP tiene cierto soporte para navegadores como Chrome y Opera (y otros basados en Chrome) pero es complejo de manejar, necesita etiquetas especiales o algún servicio CDN que lo soporte (y no he tenido buena experiencia usando ese tipo de servicios CDN).
Mozilla no pareció mirar con muy buenos ojos el formato webP (de hecho todavía no hay una implementación completa en su navegador Firefox), y optaron por seguir otro camino.
Mozilla parece haberse plantenado ¿por qué no seguir usando JPEG PERO CON ALTERACIONES SECRETAS en la imagen?
Así fue como, por parte de Mozilla, nació MozJPEG, en realidad el mismo formato JPEG donde se alteran algunos parámetros para obtener unas compresiones brutales, a veces casi cercanas a webP (pero eso va a depender del archivo, por lo general se dice que MozJPEG comprime un 5% más que JPEG estándar y webP un 30% más que el formato JPEG estándar).
VENTAJAS DE WEBP - Comprime un 30% más que JPEG
DESVENTAJAS DE WEBP - Sólo compatible con Chrome (y derivados), necesita etiquetas especiales, no se puede descargar y visualizar (excepto con visores especiales), no hay apenas software de compresión (Irfanview, XNview y alguno más). No ha seguido evolucionando. No hay apenas plugins para WordPress.
VENTAJAS DE MOZJPEG - Comprime un 5% más que JPEG. Compatible con todos los navegadores. Puedes bajar el archivo y visualizarlo en la mayoría de navegadores modernos. Puedes insertarlo en casi cualquier aplicación que soporte JPEG. Puedes usarlo en WordPress como cualquier otro formato de imagen habitual.
DESVENTAJAS DE MOZJPEG- Sólo he encontrado un addon para GIMP para compresión y un par de servicios online, el demás software que he podido revisar es mediante línea de comandos.
Otro día trataré de armar un tutorial sobre GIMP + plugin MOZJPEG pero hoy lo que quiero mostraros es un servicio online que utiliza MOZJPEG.
El servicio se encuentra en estado ALPHA, es decir, todavía puede tener errores y de hecho he visto que en ocasiones algunas imágenes parece no soportarlas.
Pero ahí vamos con el tutorial y espero que os resulte de utilidad el servicio.
PASO 1. -
Ingresamos al sitio web
mozjpeg | codelove
https://mozjpeg.codelove.de/
Podréis ver que la interfaz no es nada compleja.
PASO 2. -
Fíjate que el sitio web sólo acepta los siguientes formatos
jpg,bmp,targa
Además he visto que archivos muy pesados pueden no ser procesados (recuerda que el servicio está en estado alpha)
Tendrás que elegir un archivo original en alguno de esos formatos.
PASO 3. -
A continuación establecemos el nivel de compresión para nuestro archivo.
EL VALOR RECOMENDADO PARA EVITAR LA MÍNIMA DEGRADACIÓN VISUAL ES ENTRE 60 Y 90.
Por supuesto puedes escoger valores por debajo de 60 para obtener compresiones brutales, pero también verás que la imagen comienza a sufrir pérdidas visuales importantes.
Por lo tanto movemos el deslizador a la opción deseada. He comprobado que valores sobre 75 ofrecen una excelente compresión/calidad para web.
Así que voy a poner el deslizador en ese nivel.
IMPORTANTE - Debemos ajustar el valor ANTES DE SUBIR EL ARCHIVO (esperemos que en el futuro mejoren esta opción y se pueda cambiar una vez subida la imagen para ver los cambios en tiempo real).
PASO 4. -
Arrastramos la imagen que deseamos comprimir SOBRE EL PRIMER CUADRO desde nuestra computadora.
En mi caso voy a escoger esta imagen de PIXABAY la cual he descargado con un tamaño de 1920 x 1440 y que pesa 702kbs.
https://pixabay.com/es/piscina-hotel-océano-playa-bahamas-115851/
Se mostrará una barra de carga en la parte inferior indicando el nivel de subida del archivo.
PASO 5. -
Esperamos unos segundos y posteriormente aparecerá la imagen comprimida en la segunda caja (una vista previa).
Debajo de la caja se mostrará información sobre el tamaño de la imagen comprimida.
En nuestro ejemplo hemos pasado de tener una imagen de 702 kbs a 275 kbs lo cual es una compresión muy buena.
PASO 6. -
Hacemos clic en el botón ROSADO QUE DICE - download image y se iniciará la descarga de nuestra imagen comprimida
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN FINAL (aplicada compresión, peso 275 kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 50 (peso 166kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 30 (peso 111kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
IMAGEN COMPRIMIDA CON NIVEL 10 (peso 41kbs)
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
NOTAS FINALES
Si quieres comprobar otros niveles de compresión tendrás que repetir DESDE EL PASO 4, pues como había comentado el sistema NO PERMITE COMPRIMIR EN TIEMPO REAL, por lo que tendrás que arrastrar el deslizador de nuevo, y volver a subir la imagen.
Si no quieres tener pérdidas visuales puedes escoger la opción lossless (pero sólo acepta archivos JPEG). En nuestro ejemplo la imagen quedaría comprimidad en a 655 kbs.
Espero que os haya gustado el tutorial.
Si tienes alguna duda trataré de responderla en la medida que me sea posible.
Última edición: