Conociendo el WebP de Google
WebP es un formato de imagen desarrollado por Google en el 2010. Su objetivo principal es unificar todas las ventajas de los formatos PNG, JPEG y GIF en uno único mucho más ligero que cualquiera de los tres. Lo que se traduce en webs menos pesadas y con más velocidad de carga, que actualmente se ha convertido en una necesidad debido a que hoy en día, la mayor parte del tiempo navegamos por Internet, sea en computadora o directamente desde el móvil.
Aproximadamente, las imágenes en este formato de compresión son un 30% más pequeñas que la misma imagen en otros formatos habituales como JPEG o PNG con la misma calidad de imagen y basados en sus propios métodos de compresión. Mientras que los archivos en formato JPEG se basan en un método de compresión con pérdida, los archivos PNG hacen lo mismo pero sin pérdida, y son los WebP los que admiten ambas posibilidades. “Conoce un poco más” del WebP con Gustavo Oliver Marketing.
Recordemos que en la actualidad tenemos tres códecs o formatos mayoritarios que todo el mundo utiliza. Son el JPEG, PNG y GIF, que datan de 1991, 1996 y 1987 respectivamente. Desde su nacimiento estos formatos han ido evolucionando para lograr que sigan teniendo utilidad.
Cada uno de estos tres formatos tiene sus características únicas:
- JPEG: Se caracteriza por su alta capacidad de compresión, aunque a cambio tiene una importante pérdida de calidad en las imágenes.
- PNG: Es un formato sin pérdida que admite transparencia, pero no tiene una compresión tan potente y hace que las imágenes resulten especialmente pesadas.
- GIF: Su compresión no tiene pérdidas, pero sólo puede representar 256 colores. Teniendo en cuenta que tu pantalla representa millones de colores, el resultado es que el GIF es posiblemente el formato más obsoleto de los tres, aunque el único que soporta animaciones.
Por lo tanto, que Google ofrezca todos los beneficios de estos tres formatos quiere decir que tienen por una parte la alta compresión de JPEG, por otra la capacidad de ofrecer imágenes sin pérdidas como las PNG, y por último la capacidad de reproducir imágenes en movimiento y sin pérdidas como los GIF. Teniendo presente que en todos los casos, los archivos WebP son más ligeros, desde cualquier punto de vista el WebP es una gran ventaja para el mundo digital.
Las características de compresión, así como otras propiedades centrales del formato WebP, se pueden resumir de la siguiente manera:
- Compresión (con pérdida): la compresión con pérdida de WebP se basa en la codificación del fotograma clave de VP8.
- Compresión (sin pérdida): la compresión sin pérdida de WebP se basa en distintas técnicas que transforman los parámetros y los datos de la imagen. En este caso, se utiliza el algoritmo LZ77, entre otros.
- Transparencia: el canal alfa de 8 bits que ofrece el formato WebP también se puede utilizar para la compresión RGB con pérdida.
- Metadatos: WebP puede incluir los metadatos EXIF y XMP que normalmente crean las cámaras fotográficas.
- Perfil de colores: el formato de Google puede incluir perfiles ICC integrados (registros que describen el espacio de color).
- Animaciones: el formato WebP permite almacenar secuencias de imágenes.
El WebP y la optimización
Desde hace tiempo, la velocidad de carga se ha convertido en uno de los ajustes más importantes a la hora de optimizar una página web. Los motores de búsqueda utilizan diversos criterios para la evaluación de una web. En este sentido, no solo es relevante el número de usuarios que la visitan, sino que también se valora el tiempo que una página tarda en responder a la solicitud. Un código más pequeño y comprimido o el uso de mecanismos de caché se cuentan entre las soluciones probadas para una presencia web rápida tanto como el uso de imágenes comprimidas.
Por tanto, la utilidad del formato WebP o cualquier otro formato que sea mejor que los ya existentes, es una gran ventaja para todas las personas dedicadas al desarrollo web, ya que, una web con peso liviano es sinónimo de carga rápida y, por lo tanto, un paso adelante en la mejora de nuestro SEO.
La estructura de WebP
Los archivos WebP son archivos contenedores que recurren al formato contenedor RIFF (Resource Interchange File Format) desarrollado por Microsoft e IBM. Por eso, un archivo en formato WebP se compone de una cabecera RIFF y de los correspondientes contenidos WebP.
La cabecera RIFF/WebP está compuesta de las siguientes tres secuencias de 4 bytes:
- FourCC (Código de cuatro caracteres) RIFF describe el tipo con los cuatro caracteres ASCII R, I, F y F, que especifican que se trata de un archivo contenedor RIFF
- Tamaño del archivo: especifica el tamaño del archivo
- FourCCWEBP: describe el tipo con los cuatro caracteres ASCII W, E, B y P, que indican que el contenedor RIFF contiene un archivo WebP
Al final de la cabecera se encuentran los bloques de archivo WebP, que en los contenedores RIFF también se conocen como “chunks”. Cada chunk tiene su propia cabecera, que incluye la información correspondiente. Algunos posibles bloques del nivel superior son VP8 (WebP con pérdida), VP8L (WebP sin pérdida) y VP8X (WebP ampliado). Los últimos determinan archivos WebP con información adicional como los metadatos EXIF (chunk EXIF) o un perfil de color ICCP (chunk ICCP), así como WebP animado (chunk ANIM).
Para la compresión sin pérdida de WebP, el primer paso es la transformación de la imagen, donde se pueden utilizar las siguientes técnicas:
- Transformaciones basadas en predicciones especiales: WebP utiliza 13 modos de predicción diferentes que aprovechan el hecho de que los píxeles vecinos suelen estar correlacionados. Para ello, se predice el valor real de los píxeles a partir de píxeles ya codificados, y se codifica solo el valor residual.
- Transformación de colores: El objetivo de la transformación de colores es la descorrelación de los valores RGB de cada uno de los píxeles. Para ello, en primer lugar la imagen se divide en bloques, antes de que el rojo (R) se transforme a partir del verde (G) y el azul (B) a partir del verde y del rojo. El único que mantiene su valor es el verde.
- Transformación por sustracción del verde: Variante adicional para transformar el color en la que el valor verde se extrae de los valores rojos y azul de cada píxel.
- Transformación por color indexado: Si hay pocos valores de píxel inequívocos, el formato WebP ofrece también la posibilidad de hacer una transformación por color indexado. En ese proceso, se determina el número de valores RGBA inequívocos y, si la cifra es demasiado baja, se crea una disposición de estos colores. Dicha disposición se utiliza para sustituir los valores de los píxeles por el índice correspondiente.
- Codificación del color por memoria caché: La compresión WebP sin pérdida puede utilizar incluso fragmentos de imagen ya vistos para reconstruir nuevos píxeles. Si no tiene ningún resultado apropiado, se utiliza una memoria local caché de color con los 32 últimos colores utilizados como punto de partida. Esta se actualiza continuamente.
Los parámetros y datos de imagen transformados se codifican entrópicamente, para lo que se utiliza una variante del algoritmo LZ77. Esta utiliza pequeños valores para píxeles cercanos en el espacio.
Existen diferentes motivos por los que una página web puede ralentizarse y ofrecer una mala experiencia de usuario, que a su vez repercute negativamente en aspectos como el SEO. Para más información sobre nuestro servicios y herramientas de Marketing, visítanos en https://gustavoliver.com/
