Comprimir fotos para la velocidad de carga

Core Web Vitals puntúa una página por Largest Contentful Paint — el tiempo hasta que el elemento visible más grande (casi siempre una imagen principal, un banner o una foto sobre el pliegue en sitios de contenido) termina de renderizarse. El umbral de Google para «bueno» es 2,5 segundos en el percentil 75 de visitas reales. En páginas con muchas imágenes, el peso de archivo de esa única imagen suele ser la palanca más grande disponible — una foto sin comprimir de 4 MB puede por sí sola empujar el LCP más allá del umbral en una conexión móvil de gama media, mientras que una versión correctamente comprimida de la misma foto carga en una fracción de segundo.

Por qué el peso del archivo domina el LCP en páginas con muchas imágenes

El tiempo de descarga escala directamente con los bytes transferidos y el ancho de banda disponible. En una conexión 4G que promedia de forma realista unos pocos megabits por segundo, una foto sin optimizar de 3-4 MB puede tardar un segundo entero o más solo en descargarse, antes de que el navegador siquiera la decodifique y la pinte — y eso sin contar el tiempo de respuesta del servidor, la resolución DNS y cualquier recurso que bloquee el renderizado por delante de ella en la secuencia de carga. Comprime esa misma foto a un archivo WebP de tamaño adecuado por debajo de 200 KB y la parte de descarga del LCP prácticamente desaparece del presupuesto.

Objetivos de tamaño realistas

Estos objetivos asumen que la imagen también se ha redimensionado para coincidir con sus dimensiones reales de visualización — servir un archivo fuente de 4000 px de ancho en un espacio principal de 1200 px de ancho desperdicia ancho de banda en píxeles que el navegador descarta de inmediato, sin importar cuán bien esté comprimido el archivo. Combina redimensionar al tamaño de visualización con la compresión de formato y calidad para la mayor mejora.

El formato importa tanto como el control de calidad

Para contenido fotográfico, WebP suele superar a JPEG en un 25-35% con calidad visual equivalente, y todos los navegadores principales lo soportan desde 2020 — hay poca razón para usar JPEG por defecto en un sitio moderno. Para gráficos con grandes áreas de color plano, bordes nítidos o texto (capturas de pantalla, diagramas, logos), compara WebP con PNG en lugar de asumir que WebP gana automáticamente; consulta PNG vs JPG vs WebP para saber cómo decidir. Sea cual sea el formato que elijas, la combinación de dimensiones de píxel correctas más un ajuste de calidad sensato (75-85 para WebP/JPEG) es lo que realmente mueve el número de LCP — no el formato por sí solo.