Analizador de compresión de imágenes
Respuesta breve
Comprueba el peso, los formatos y el ahorro por compresión de las imágenes, además del marcado responsive: srcset, ancho y alto, y carga diferida.
Lo que no hace: Revisa como máximo 15 imágenes y estima el ahorro en WebP sin convertirlas; no incluye imágenes de fondo CSS ni las añadidas por scripts.
Qué hace
Comprueba hasta 15 imágenes de una página en cuanto a formato y tamaño de archivo, marca las que aún se sirven como JPEG o PNG en lugar de WebP o AVIF, y estima los bytes que ahorrarías al convertirlas a WebP. Una segunda parte comprueba cada `<img>` en busca de marcado responsivo: un `srcset`, atributos `width` y `height` que evitan el desplazamiento del diseño, carga diferida para las imágenes fuera de pantalla y formatos modernos.
Por qué importa
Las imágenes suelen ser la parte más pesada de una página y a menudo su elemento de Largest Contentful Paint. Enviar JPEG a tamaño completo a los teléfonos desperdicia datos y ralentiza ese pintado, y las imágenes sin width y height hacen que el diseño salte al cargarse, lo que perjudica el Cumulative Layout Shift.
Cómo funciona
-
Introduce la URL de una página
-
Enumeramos las imágenes de la página y comprobamos el formato y el tamaño de hasta 15
-
Estimamos el ahorro con WebP y luego comprobamos cada `<img>` en busca de srcset, dimensiones y carga diferida
-
Devolvemos un resultado por cada parte, con las imágenes más pesadas y las que carecen de marcado responsivo
Ejemplo de entrada y salida
url: https://rankproof.eu/tools
Peso y formatos de imagen imágenes comprobadas: 15 formato moderno (WebP/AVIF): 11 / 15 warn peso total de imágenes: 890 KB OK (menos de 1 MB) ahorro estimado con WebP: 64 KB más pesada: /images/hero-banner.jpg — 210 KB Imágenes responsivas: 18 con srcset: 18 OK width y height configurados: 18 OK (sin desplazamiento del diseño) las imágenes fuera de pantalla cargan de forma diferida OK 1 de 2 áreas están bien
Quién lo usa
-
Responsable de e-commerce
Comprueba las páginas de categoría y de producto en busca de imágenes que aún se sirven como JPEG o PNG a tamaño completo de cámara.
-
Responsable de contenido
Detecta subidas que se saltaron el redimensionado, y páginas donde las imágenes carecen de srcset o dimensiones.
-
Ingeniero/a de rendimiento
Estima cuánto ahorraría una conversión a WebP antes de elegir un flujo de trabajo de imágenes.
Preguntas frecuentes
- ¿Cuánto puedo ahorrar?
- El informe estima los bytes ahorrados al convertir a WebP cada imagen que no está en un formato moderno. El ahorro real depende de la imagen y del ajuste de calidad que elijas.
- ¿Perjudica la compresión la calidad de la imagen?
- Con ajustes de calidad razonables, los formatos modernos se ven igual para la mayoría de las personas. Compara el antes y el después al tamaño en el que se muestra la imagen.
- ¿Qué hace que una imagen sea responsiva?
- Un `srcset` (o un elemento `<picture>`) para que el navegador pueda elegir un archivo más pequeño en pantallas pequeñas, más `width` y `height` para reservar el espacio antes de que cargue la imagen.
- ¿Deberían las imágenes cargarse de forma diferida?
- Las imágenes fuera de pantalla, sí: añade `loading="lazy"`. No cargues de forma diferida la imagen principal de la parte superior de la página; suele ser el elemento de Largest Contentful Paint.
- ¿Debería eliminar los metadatos EXIF?
- Para mostrarla en la web, normalmente sí: ahorra bytes y elimina detalles como la ubicación GPS.