Si llevas tiempo optimizando el LCP de tu web sin ver resultados, puede que estés arreglando el elemento equivocado. John Mueller, Search Advocate de Google, ha destacado recientemente un caso de estudio que explica por qué muchas mejoras de Largest Contentful Paint no dan fruto, y la razón es más sutil de lo que parece: el navegador está midiendo el elemento incorrecto desde el principio.
El problema no era la imagen pesada, sino qué imagen medía el navegador
El caso de estudio fue publicado el 24 de junio en web.dev y detalla un año de trabajo con los Core Web Vitals en Nuvemshop, una plataforma de ecommerce latinoamericana. Según el informe, el equipo técnico asumió al principio que el problema era el peso de las imágenes o la latencia del servidor. Pero al analizar en profundidad, descubrieron que el verdadero problema estaba en cómo el navegador seleccionaba el elemento LCP.
De acuerdo con los datos facilitados en el estudio, los carruseles estaban presentes en el 85% de las tiendas de la plataforma. El problema surgía porque las transiciones CSS aplicadas a esos carruseles y banners retrasaban el momento en que los elementos se volvían visibles para la detección LCP del navegador. Así, aunque el usuario veía el carrusel cargarse primero, el navegador podía identificar un banner más abajo como el elemento LCP, porque su visibilidad no estaba retrasada por ninguna transición.
Como consecuencia, según recoge el estudio, los esfuerzos de optimización anteriores se habían centrado en elementos que nunca habían sido realmente el LCP. Un trabajo técnico bien hecho, pero orientado al objetivo equivocado.
Las tres causas principales que identificó el equipo de Nuvemshop
Según la investigación descrita en el caso de estudio, hubo tres factores técnicos que combinados estaban distorsionando la medición del LCP:
- Transiciones CSS en las secciones superiores, que retrasaban el reconocimiento del elemento por parte del navegador y lo empujaban a medir otro elemento más abajo.
- Lazy loading mal aplicado en imágenes que estaban por encima del fold y que deberían cargarse de forma inmediata, no diferida.
- Ausencia de señales de prioridad en las imágenes críticas, lo que impedía al navegador saber qué recurso debía descargar antes.
Además, según la fuente, las mediciones provenían tanto de páginas de categoría como de producto, no solo de la home. Esto obligaba a que cualquier solución funcionase de forma transversal en distintos tipos de página, lo que añadía complejidad al problema.
Cómo lo solucionaron: tres ajustes técnicos concretos
El equipo de Nuvemshop implementó los cambios en sus themes principales. El primero fue eliminar las transiciones CSS de las secciones superiores para que los elementos se mostrasen de forma instantánea y el navegador pudiera reconocerlos correctamente como candidatos LCP sin ningún retraso artificial.
El segundo ajuste fue eliminar el atributo loading="lazy" de la primera imagen de esas secciones superiores. Según la propia documentación de web.dev, aplicar lazy loading a la imagen LCP siempre añade un retraso de carga innecesario, y es uno de los errores más habituales en webs con plantillas predefinidas.
El tercero consistió en añadir fetchpriority="high" a la imagen que probablemente fuera el LCP, señal que le indica al escáner de precarga del navegador que descargue ese recurso antes. De acuerdo con el estudio, Nuvemshop envolvió esta señal en lógica de validación para que solo se activase cuando el elemento pudiera ser realmente el candidato LCP. La recomendación de Google al respecto es reservar este atributo para una o dos imágenes clave, ya que si todo tiene prioridad alta, en la práctica nada la tiene.
Como cuarto cambio adicional, según la fuente, se implementó edge caching para reducir la latencia, aunque este ajuste fue complementario a los tres anteriores centrados en la detección del elemento correcto.
Los resultados que reporta Nuvemshop tras el año de trabajo
Según los datos facilitados por la propia compañía, el porcentaje de tiendas con buena puntuación LCP pasó del 57% al 96% tras aplicar estos cambios. La tasa global de aprobación de Core Web Vitals mejoró del 48% al 72% a lo largo del año.
En cuanto a métricas de negocio, Nuvemshop reporta que, para las tiendas brasileñas activas tanto en enero de 2025 como en enero de 2026, la tasa de conversión de visitantes móviles procedentes de búsqueda orgánica de Google subió un 8,9%, y el engagement con el carrito de compra creció un 8,4%. La empresa conecta estos resultados con su trabajo de velocidad, apoyándose en una investigación de Deloitte encargada por Google que estima que reducir 0,1 segundos el tiempo de carga puede elevar la conversión en retail un 8,4%.
Es importante tener en cuenta, como señala la fuente del análisis, que estas cifras son autoreportadas y corresponden a una comparación interanual de una cohorte específica de tiendas, no a un experimento controlado. Los resultados deben leerse como indicativos de una tendencia, no como causalidad demostrada.
Por qué este caso es relevante para cualquier web con layouts dinámicos
El LCP es uno de los tres indicadores principales de los Core Web Vitals, el conjunto de métricas de experiencia de usuario que Google utiliza como señal de ranking, aunque con un peso relativamente menor frente a factores como la relevancia del contenido. Aun así, mejorar el LCP repercute directamente en la experiencia del usuario, especialmente en mobile, donde los tiempos de carga tienen mayor impacto.
Lo que este caso ilustra especialmente bien es que el problema no siempre está donde parece. En plataformas con layouts personalizables —como cualquier ecommerce con themes variables, un WordPress con constructores de páginas o un CMS con secciones reordenables—, el elemento que mide el navegador como LCP puede cambiar de una página a otra o de un tema a otro. Optimizar la imagen incorrecta no solo es tiempo perdido, sino que puede dar una falsa sensación de que ya se ha hecho el trabajo.
«Antes de comprimir otra imagen hero, comprueba que estás optimizando el elemento que el navegador realmente trata como LCP», recoge el análisis de Search Engine Journal al comentar el caso.
Cómo verificar cuál es realmente tu elemento LCP antes de tocar nada
Para evitar caer en el mismo error, el primer paso es identificar el elemento LCP real en PageSpeed Insights o en el informe de Core Web Vitals de Google Search Console. Herramientas como Chrome DevTools o la extensión Web Vitals también permiten visualizar qué elemento está siendo marcado como LCP en tiempo real durante la carga de la página.
Una vez identificado el elemento correcto, la secuencia de comprobación recomendada es sencilla: verificar que no tenga loading="lazy", que cuente con fetchpriority="high" si es una imagen, y que ninguna transición CSS esté retrasando su aparición en pantalla. Son tres atributos o líneas de código, pero su impacto en la puntuación LCP puede ser determinante, como demuestra el caso de Nuvemshop a lo largo de doce meses de trabajo técnico.
Fuente: https://www.searchenginejournal.com/googles-mueller-flags-a-case-on-why-lcp-fixes-miss-the-target/581413/