¿Qué es WebP y cómo usar imágenes webp en WordPress?

Las imágenes, tan hermosas y expresivas como son, son uno de los principales culpables de la velocidad débil de la página. La compresión de la imagen de corte, formato y no incorrecta puede costar a los visitantes a su sitio y clasificaciones favorables en la búsqueda. Afortunadamente, hay un nuevo hijo (ish) en el bloque, un formato de imagen de nueva generación para abordar la crisis de velocidad de la página. En esta publicación, respondemos la pregunta “¿Qué es WebP?” Y le brinda nuevas perspectivas sobre los formatos de archivo de imagen contemporáneos. Las imágenes suelen ser una de las mayores causas para la carga lenta de páginas web. No solo ralentizan el tiempo de carga, sino que también pueden ocupar mucho espacio y recursos en su servidor. Elegir cuidadosamente el tipo de archivo y comprimirlos ayuda a reducir la velocidad de carga, pero solo se pueden optimizar hasta ahora antes de la calidad de la imagen. Otra opción es usar uno de los tipos de archivos de imagen más optimizados: WebP.
WebP es un formato de archivo de imagen -de -the -art desarrollado por Google. Este formato de archivo realmente existe desde 2010, pero no se usa ampliamente y también es muy conocido. En la siguiente guía, discutiremos el formato de imagen de nueva generación, WebP, y explicaremos cómo y por qué debe usarlos en su sitio de WordPress. ¿Qué es WebP? WebP es un formato de imagen ráster de Google, especialmente diseñado para la web. No ofrece compresión de pérdida y pérdida, lo que permite a los diseñadores web mostrar imágenes más ricas de archivos más pequeños.
Las imágenes de WebP con pérdidas usan codificación predictiva para codificar la imagen. Con esto, reduce las dimensiones de los archivos mirando los píxeles vecinos para predecir los valores y luego solo codifica las diferencias. Las imágenes de pérdidas son hasta un 34% más bajas que la imagen comparable como JPEG. Las imágenes de WebP sin pérdidas reconstruyen nuevos píxeles utilizando fragmentos de imagen que ya se han visto. Si no encuentra una coincidencia, puede usar una paleta local. Las imágenes libres de pérdida son 26% más bajas que la misma imagen que PNG. WebP sin pérdida acepta el canal alfa (transparencia) con un tamaño de archivo que es 3 veces más pequeño que la imagen comparable como png. ¿Qué es un archivo webp? Un archivo WebP utiliza datos de imagen VP8 o VP8L y un contenedor basado en riff. Utiliza la extensión del archivo .Webp. La Biblioteca LibWebP es la implementación de referencia para la especificación WebP. Puedes ver la biblioteca en el almacén Git o como un tarball. Los beneficios de usar la webp La principal ventaja de la webp es el pequeño tamaño del archivo. Con esto, sus páginas web se cargarán más rápido y usará menos recursos de su servidor. Esto también significa que podrá usar imágenes más grandes y más en color, sin agregar la carga actual del servidor, si sus visitantes usan un navegador que las acepta.
Esta nueva libertad para desatar con imágenes y gráficos también ayudará a su diseño web. Sin preocuparse por cada píxel y KB, no tendrá que ser tan concienzudo para usar áreas más pequeñas de los diseños de su imagen. Puede usar dimensiones que funcionan para el diseño en lugar de tener que hacer que el diseño coincida con imágenes más pequeñas debido a la velocidad de la página o los tiempos de carga. Cómo agregar imágenes WebP a WordPress a pesar del poder de las imágenes WebP, no se agregan tan fácilmente a la biblioteca de medios de WordPress. En primer lugar, el formato WebP aún no se acepta en todos los navegadores y requiere una imagen de copia de seguridad para la compatibilidad con la webp de inversión del navegador no es aceptada por WordPress, pero hay una solución
También se necesitan pasos de seguridad adicionales cuando se usa WebP, que evita que WordPress permita a los usuarios que cargan las imágenes WebP de forma predeterminada. Estas no son las mismas preocupaciones de seguridad que los archivos SVG; Los archivos WebP simplemente necesitan un proceso de solución antes de que se puedan agregar a la biblioteca de medios. Una vez que están formateados correctamente, se pueden cargar en sitios de WordPress. Hay algunas formas en que puede agregar imágenes WebP a WordPress. Puedes optar por:

La ruta manual (esto requiere un poco de grasa en el codo pero nada demasiado complicado) o
Use un complemento.
Si está interesado en un remedio rápido, puede usar uno de los siguientes complementos, en lugar de seguir meticulosamente la ruta manual. Agregar manualmente las imágenes WebP a WordPress primero debe asegurarse de que las imágenes estén en el formato correcto. Tendrá que convertirlos en webp. Luego debe subir las imágenes en su biblioteca de medios. Conversión de imágenes a WebP Antes de que pueda comenzar a usar imágenes WebP, deben convertirse en el formato de archivo correcto para que sean compatibles con la biblioteca de medios de WordPress. Para hacer esto, necesitará un convertidor de imagen en línea, como Online-Convert.com. Si tiene un sitio con algunas imágenes, puede retirarlas, puede convertir y cargar el nuevo formato. Además, si crea un nuevo sitio, puede ejecutar fácilmente el contenido de imagen del nuevo sitio a través de la herramienta de conversión antes de cargar las imágenes. Para usar el convertidor, simplemente tire y coloque las imágenes donde escribe “tirar los archivos aquí”, espere el proceso de conversión y luego descargue la nueva imagen.
Use una herramienta en línea para convertir la imagen en webp
Convertir las imágenes WebP en línea de forma predeterminada, Adobe Photoshop no permite la exportación de archivos en formato WebP. Sin embargo, puede agregar esta funcionalidad con un complemento para el programa en sí. Este complemento premium para Adobe Photoshop (no WordPress) debe descargarse y agregarse a la carpeta Photoshop en su computadora.
Otra opción es el uso de una aplicación de escritorio. Tanto WebPConv para Windows como Mac Webavis son aplicaciones de escritorio que se pueden descargar y usar fuera de línea. Estos programas pueden hacer conversiones JPEG en WebP o PNG en WebP. Si trabaja en un sitio web existente que ya tiene una serie de imágenes en la biblioteca de medios, necesitará una solución más robusta para convertir las imágenes en el formato de próxima generación. Para esto, puede seguir el tutorial en la línea de comandos en esta guía webp. Agregue imágenes WebP a su sitio web Una vez que sus imágenes estén en el formato correcto, puede cargarlas en su sitio de una de dos maneras: con SFTP, puede iniciar sesión en el servidor y puede agregar las imágenes a la carpeta de carga, evitando la biblioteca de medios o

Puede editar el archivo functions.php para activar las cargas webp
Agregar imágenes WebP utilizando un complemento Uno de los mejores de usar imágenes WebP como diseñador o desarrollador es que no tiene que hacer el trabajo de creación de archivos. En cambio, solo tendrá que instalar un enchufe de conversión. Subirá sus imágenes ordinarias en formatos JPEG o PNG, y el complemento convierte esos archivos en WebP para entregar las imágenes de sus visitantes.
La ventaja de este método es que debe administrar solo los tipos de archivos a los que ya está acostumbrado, y sus visitantes que no pueden usar WebP continuarán recibiendo los tipos de archivos originales. Aquellos que puedan recibir el tipo de archivo WebP verán tiempos de carga más rápidos. Otro método es permitirle cargar archivos WebP en su sitio web. No se recomienda este método, porque no todos los navegadores aceptan este formato. Esto significa que algunos de sus visitantes no pueden ver sus fotos. Hay varios complementos gratuitos y premium que convierten las imágenes en la webp. Aquí hay un vistazo a algunas opciones gratuitas. EWWW IMAGEN OPTIMIZERCCIA DE ENTRADA EWWW Optimizador de imágenes de WordPress Warehouse
EWWW Image Optimizer es un complemento gratuito con una función de conversión WebP. Genera la versión webp de sus archivos JPEG y PNG. Incluye muchas opciones, como reglas de reescritura compatibles con Apache y una opción alternativa de reescritura webp. Es compatible con caché y CDN y funciona con el habilitador de caché KeyCDN. Esto es probablemente el más fácil de usar. Las funciones de WebP incorporadas le permiten usar la conversión con pérdidas para JPEG y sin pérdidas de PNG, y la conversión es automática. Todo lo que tiene que hacer es instalar el complemento y activar la función en la pestaña WebP. No se requiere otra configuración. Optimizador de imágenes de shortpixel
Descargar ShortPixel Image Optimizer de WordPress Warehouse
ShortPixel Image Optimizer es un complemento gratuito que convertirá cualquier JPEG, PNG o GIF en WebP. Utiliza tanto pérdidas como pérdidas. También funciona con complementos de caché que son conscientes de WebP. Proporciona imágenes de navegadores webp que pueden verlas, y la otra se formó para aquellos que no pueden. También tiene una opción para agregar imágenes WebP a las páginas front-end usando HTML. Para hacer esto, puede usar la etiqueta en lugar de la etiqueta normal . Para establecer las imágenes automáticas, simplemente active la función en la pestaña avanzada. Puede restaurar las imágenes si lo desea. WebP ExpressDecăciti Web Express de WordPress Warehouse

WebP Express es un complemento gratuito que produce imágenes que tienen menos de la mitad del tamaño de los archivos JPEG. Dirige JPEG y PNG a un convertidor de imagen para convertirse o a la imagen ya convertida. Funciona sin importar cómo las imágenes hayan llegado al servidor. Funciona con la biblioteca de medios, las galerías y para las imágenes temáticas a las que se mencionan con CSS. No funciona con el servidor Microsoft IIS o WAMP y no se ha probado con múltiples sitios. Requiere ciertas configuraciones para métodos de conversión, pero tiene más que elegir. Las imágenes primero usarán el método de conversión en la parte superior, y si falla, irá por la lista hasta que encuentre un método que funcione con la imagen. Puedes ponerlos en el orden en que quieres usarlos. Opti Mozjpeg Guetzli WebP

Descargar Opti Mozjpeg Guetzli WebP de WordPress Warehouse
Opti Mozjpeg Guetzli WebP es un complemento gratuito que se ha creado considerando Google PageSpeed ​​Insights. Use Mozilla Mozjpeg, Google Guetzli y Google Web Image para convertir sus imágenes. Los codificadores se pueden instalar localmente o puede usar el cliente SSH construido. Acceda a codificadores remotos utilizando una conexión SSH a la máquina virtual del autor. Puede convertir todos sus PNG no alfa en formato JPEG. Copia de seguridad para imágenes antes de hacer cambios. Puede volver a sus fotos en cualquier momento que desee. Un ejemplo de las imágenes WebP en acción a continuación es una demostración de imágenes webp en acción. Para mis ejemplos, quería mostrar algunas diferencias en calidad y tamaño, por lo que guardo la misma imagen en diferentes formatos y niveles de calidad para compararlos. De hecho, muestro las capturas de pantalla de las imágenes en mi editor de imágenes. Para estos ejemplos, uso Paint.net con un complemento WebP. Estas imágenes se reducen un poco más en tamaño cuando las cargan en este sitio web, por lo que pueden verse un poco diferentes entre sí que en realidad, pero espero que proporcionen una buena comparación. Una imagen en la que tomé de Unsplash. Este es el archivo JPEG, reducido a 800 píxeles de ancho y guardado en una calidad del 98%. Es un archivo de 237 kb.

Aquí está la misma imagen guardada como PNG. Es un archivo de 1.09 MB.
Aquí está la misma imagen guardada como webp. También se guarda en una calidad del 98%. Es un archivo de 199 kb.