Codifica las imágenes de forma eficaz

En la sección Oportunidades de tu informe de Lighthouse, se enumeran todas las imágenes no optimizadas, con posibles ahorros en kibibytes (KiB). Optimiza estas imágenes para que la página se cargue más rápido y consuma menos datos:

Captura de pantalla de la auditoría Codifica las imágenes de forma eficaz de Lighthouse

Cómo Lighthouse marca las imágenes como optimizables

Lighthouse recopila todas las imágenes JPEG o BMP de la página, establece el nivel de compresión de cada imagen en 85 y, luego, compara la versión original con la versión comprimida. Si los ahorros potenciales son de 4 KiB o más, Lighthouse marca la imagen como optimizable.

Cómo optimizar las imágenes

Existen muchos pasos que puedes seguir para optimizar tus imágenes, como los siguientes:

Optimiza las imágenes con las herramientas de la GUI

Otro enfoque es ejecutar las imágenes a través de un optimizador que instales en tu computadora y ejecutes como una GUI. Por ejemplo, con ImageOptim, puedes arrastrar y soltar imágenes en su IU, y luego se comprimen automáticamente sin afectar la calidad de manera notable. Si administras un sitio pequeño y puedes optimizar manualmente todas las imágenes, esta opción es adecuada.

Squoosh es otra opción. El equipo de DevRel de Google Web mantiene Squoosh.

Orientación específica de la pila

Drupal

Puedes usar un módulo que optimice y reduzca automáticamente el tamaño de las imágenes que se suben a través del sitio sin perder la calidad. Además, asegúrate de usar los estilos de imágenes responsivas nativos que proporciona Drupal para todas las imágenes renderizadas en el sitio.

Joomla

Puedes usar un complemento de optimización de imágenes que comprima las imágenes y conserve la calidad.

Magento

Considera usar una extensión de Magento de terceros que optimice las imágenes.

WordPress

Puedes usar un complemento de optimización de imágenes de WordPress que comprima tus imágenes y conserve la calidad.

Recursos