El LCP es el tiempo que tarda en aparecer la cosa más grande de tu pantalla. En una ficha de producto, la foto. En una landing, el titular con la imagen de fondo. Se mide en segundos y responde a una sola pregunta: ¿cuándo deja tu visitante de mirar una pantalla en blanco?

Por eso importa más que cualquier otra métrica de velocidad. Cuando la página tarda, el visitante no espera: vuelve a los resultados y entra en la de al lado. Y el coste se puede medir. El retailer Farfetch, en un caso publicado por Google, calculó que su tasa de conversión caía de media un 1,3% por cada 100 ms más de LCP. Un LCP alto es exactamente esa espera: la parte del retraso que el cliente ve.

Qué mide el LCP y qué no

LCP son las siglas de Largest Contentful Paint: pintado del contenido más grande. El navegador mira lo que cabe en la pantalla sin hacer scroll, identifica el elemento de mayor superficie y cronometra cuándo termina de dibujarse.

Los candidatos son cuatro:

• Imágenes <img> y <image> dentro de un SVG
• El póster de un <video>
• Fondos cargados con background-image: url()
• Bloques de texto: un <h1>, un párrafo grande

En un ecommerce de skincare gana casi siempre la foto del producto o el banner del hero. Ahí es donde tienes que mirar.

Lo que el LCP no mide: no es «la página cargó del todo». Puedes tener un LCP de 1,8 segundos y seguir teniendo scripts corriendo diez segundos más. Y al revés: una página que técnicamente termina rápido puede tener un LCP horrible porque la foto principal entra la última.

El umbral de Google, sin adornos

Los publica Google en su documentación de Web Vitals: «el LCP debe ocurrir dentro de los 2,5 segundos posteriores a que la página comienza a cargarse».

Dos detalles que casi nadie te cuenta:

Se mide en el percentil 75. No es tu promedio: la propia documentación de Google aclara que las Core Web Vitals se evalúan en el percentil 75 de las cargas de página. Se toman tus visitas reales y se coge el valor que supera al 75% de ellas. Si tu tienda va rápida en fibra y lenta en 4G, manda el 4G. Un promedio bonito puede esconder un percentil 75 en rojo.

Es una de tres. El LCP viaja con el CLS (estabilidad visual, bueno por debajo de 0,1) y el INP (respuesta a la interacción, bueno por debajo de 200 ms). Son las Core Web Vitals, y en Google Search Central Google confirma que forman parte de lo que sus sistemas de posicionamiento buscan recompensar. Pero el LCP es el que se traduce directo en carritos: nadie añade al carrito un producto que todavía no ha visto.

Las cuatro piezas de un LCP lento

Google descompone el LCP en cuatro tramos. Saber cuál es el tuyo cambia por completo qué arreglas:

1. TTFB — lo que tarda tu servidor en soltar el primer byte. Si esto ya son 1,5 segundos, ningún truco de imágenes te salva. Es hosting, o una base de datos ahogada, o falta de caché.
2. Retraso de carga del recurso — el navegador ya podría pedir la imagen pero no lo hace, porque está atascado leyendo CSS y JavaScript primero, o porque la imagen la mete un script en vez del HTML.
3. Tiempo de carga del recurso — descargar la imagen. Aquí es donde una foto de 2,4 MB en PNG te cuesta segundos enteros en móvil.
4. Retraso de renderizado — la imagen ya está en el navegador pero no se pinta, normalmente porque una fuente web o un CSS bloqueante lo impide.

Antes de tocar nada, mira cuál de los cuatro se está llevando el tiempo en tu tienda. Si el grueso está en los tramos 2 y 3 —los de la imagen—, tienes suerte: son los más baratos de arreglar.

Errores que disparan el LCP en tiendas reales

Dos etiquetas que valen más de lo que parecen y caben en una línea de código: fetchpriority="high" en la imagen del LCP, para que el navegador la pida antes que nada, y <link rel="preload" as="image"> cuando el hero lo mete el CSS y el HTML no lo declara.

Cómo medirlo en cinco minutos

1. PageSpeed Insights (pagespeed.web.dev). Mete tu URL y mira la pestaña móvil, no la de escritorio. Arriba sale el dato de campo, tus usuarios reales; abajo el de laboratorio, una simulación. Si tienes dato de campo, ese es el que cuenta.
2. En el informe, despliega «Largest Contentful Paint element». Te dice exactamente qué elemento es tu LCP. A veces no es la foto del producto: es un banner de cookies o un logo enorme.
3. Search Console → Core Web Vitals. Te agrupa las URLs por tipo de plantilla. Si tus fichas de producto están en rojo, están todas en rojo, y una sola corrección las arregla todas.
4. Chrome DevTools → Performance. Graba una carga con throttling Slow 4G y busca la marca LCP en la línea de tiempo. Aquí ves cuál de los cuatro tramos se está comiendo el tiempo.

Mide siempre la ficha de producto, no la home. La home es la que se mira primero; la ficha es la que vende.

Qué hacer el lunes por la mañana

Media hora, en este orden:

1. Pasa por PageSpeed Insights tres URLs: la home, tu producto más vendido y el carrito. Apunta los tres LCP de móvil en un papel.
2. Anota qué elemento identifica el informe como LCP en cada una.
3. Abre el HTML de esa imagen y busca loading="lazy". Si está, quítalo. Es el arreglo de un minuto con más efecto de la lista.
4. Mira el peso real de esa imagen (DevTools → Network, columna Size). Si pasa de 200 KB, conviértela a WebP y súbela otra vez.
5. Vuelve a medir. Si bajaste de 4 a 2,8 segundos, ya cambiaste la clasificación de Google y, más importante, lo que ve tu cliente.

Que esto mueve la aguja no es teoría. El marketplace argentino Agrofy documentó en un caso publicado por Google que, tras mejorar su LCP un 70%, el abandono durante la carga en las fichas de producto cayó un 76%: del 3,8% al 0,9%.

Si después de eso el LCP sigue por encima de 4 segundos, tu problema no son las imágenes: es el TTFB o el tema. Eso ya no se arregla con una etiqueta, sino rehaciendo la plantilla mobile-first — que es justo lo que hace nuestro paquete de tienda y landing express, desde US$350.

Preguntas frecuentes

¿Qué es el LCP en una web?

Es el tiempo que tarda en dibujarse el elemento visible más grande de la pantalla: normalmente la imagen principal o el titular. Se mide en segundos desde que el visitante pide la página.

¿Cuál es un buen LCP?

Google marca como bueno un LCP por debajo de 2,5 segundos, mejorable entre 2,5 y 4, y malo por encima de 4 segundos. Se evalúa en el percentil 75 de tus visitas reales, no en el promedio.

¿Cómo bajo el LCP de mi tienda?

Empieza por la imagen principal: conviértela a WebP o AVIF, quítale el lazy load, ponle fetchpriority="high" y sírvela al tamaño real en que se ve en móvil. Ese suele ser el arreglo con más efecto y menos riesgo.

Fuentes

• Google / web.dev — Métricas web esenciales (Web Vitals)
• Google Search Central — Comprender las Core Web Vitals y los resultados de la Búsqueda
• Google / web.dev — Luxury retailer Farfetch sees higher conversion rates for better Core Web Vitals
• Google / web.dev — Agrofy Market: A 70% improvement in LCP correlated to a 76% reduction in load abandonment