Recibe el boletín informativo, todos los lunes, y descarga nuestros ebooks exclusivos.

Cómo servir imágenes WebP

WP-AL-DIA-1024x576 Cómo servir imágenes WebP

Servir imágenes, en el formato de nueva generación WebP, en tu sitio web, es una manera de optimizar el rendimiento del mismo. El recurso de esta semana es un plugin de WordPress para convertir automáticamente tus archivos jpg, png, etc. a WebP, a la vez que los presenta cuando son solicitados.

WP al día

El contenido de este post se publicó originalmente el 6 de junio de 2022 en nuestra newsletter WP al día.

imágenes en formatos de próxima generación: WebP y AVIF

Converter for Media – Convert WebP and AVIF & Optimize Images | Ease image optimization

Este plugin convierte las imágenes de tu sitio web al formato WebP y los usuarios reciben automáticamente imágenes nuevas, mucho menos pesadas que las originales. Con ello se puede ganar más de la mitad del peso de la página sin perder calidad. 

Cuando el navegador carga una imagen, el plugin verifica si es compatible con el nuevo formato WebP. Si es así, se carga la imagen. En caso contrario, se carga la original. En algunos casos, la imagen convertida puede ser mayor en peso que la original y entonces se carga ésta.

Las imágenes de la biblioteca de medios no se alteran. La conversión masiva con un clic solo debes realizarla la primera vez y las nuevas imágenes se van convirtiendo a medida que se van subiendo a la librería multimedia. Si borras el plugin, todas las imágenes convertidas se eliminan.

Otro formato de próxima generación es AVIF. El formato AVIF solo lo puedes utilizar en la versión Pro del plugin. El formato AVIF es el sucesor de WebP. AVIF permite alcanzar niveles aún más altos de compresión de imágenes y la calidad de AVIF es aún mejor que en WebP.

Naturalmente, hemos probado a servir imágenes en formato WebP en entornos de test; e, incluso, en la web de Blogpocket. Ahí, las imágenes, en png y jpg, penalizaban el rendimiento sobre todo en dispositivos móviles (a pesar de estar optimizadas). Con WebP hemos logrado un Lighthouse de 80% en móvil y un 100% en escritorio. Todavía hay margen de mejora en móvil pero en escritorio el resultado es espectacular

GTMETRIX-BLOGPOCKET-2022-1024x642 Cómo servir imágenes WebP

¿Cómo saber si el plugin está funcionando? Una manera sencilla es comprobando que en GTmetrix o Lighthouse desaparece el mensaje de «servir imágenes en formato de próxima generación».

Antes de emplear este plugin, revisa si tu hosting te provee de alguna herramienta para llevar a cabo esta conversión automáticamente. Por ejemplo, SiteGround lo incluye en su plugin SG Optimizer. 

También tienes que tener cuidado si tu servidor es Nginx, porque entonces tendrás que aplicar algunos cambios antes de poder utilizar el plugin. 

Por qué recomiendo el plugin Converter for Media: Un sitio web mejor optimizado también afecta a tu ranking en Google. 
La optimización de las imágenes es muy importante. Y porque tratamos, además, de conseguir sitios web sostenibles. Y para esto es preciso aligerar y alcanzar niveles óptimos de rendimiento.

Más información: Cómo optimizar imágenes para WordPress en 2022 – Y uso de WebP.

Comparte en Mastodon:

mastodon Cómo servir imágenes WebP

Y aún hay más…

Cómo se hace un sitio web

Una revisión a vista de pájaro de todo lo necesario para crear un sitio web de WordPress.

Recursos

La lista de recursos recomendada en Blogpocket.

Mi lista de plugins

La lista de plugins de WordPress recomendada en Blogpocket

UN-BLOG-DE-21-MAS-1-COVER-3D-1024x944 Cómo servir imágenes WebP

Suscríbete a la newsletter

En la newsletter «WP al día» recopilamos las ideas, trucos y noticias de actualidad acerca de WordPress, Gutenberg y la Edición completa del sitio. Recíbela todos los lunes a primera hora.

Suscríbete ahora y descarga, entre otros, nuestro último ebook «Un blog de 21 años (la historia jamás contada)!.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información básica sobre protección de datos Ver más

  • Responsable: Antonio Cambronero.
  • Finalidad:  Moderar los comentarios.
  • Legitimación:  Por consentimiento del interesado.
  • Destinatarios y encargados de tratamiento: No se ceden o comunican datos a terceros para prestar este servicio. El Titular ha contratado los servicios de alojamiento web a GreenGeeks que actúa como encargado de tratamiento.
  • Derechos: Acceder, rectificar y suprimir los datos.
  • Información Adicional: Puede consultar la información detallada en la Política de Privacidad.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ir al contenido