Lente Studio
Rendimiento

Core Web Vitals: por qué tu web es lenta y cómo arreglarlo

Qué miden LCP, INP y CLS, qué valores pide Google, las causas más habituales de una web lenta y cómo arreglarlas por orden de impacto.

Las tres métricas, sin jerga

MétricaQué mideBuenoMejorableMalo
LCPCuánto tarda en aparecer el elemento principal (la imagen o el titular grande)Hasta 2,5 sHasta 4 sMás de 4 s
INPCuánto tarda la página en reaccionar cuando tocas algoHasta 200 msHasta 500 msMás de 500 ms
CLSCuánto saltan los elementos mientras cargaHasta 0,1Hasta 0,25Más de 0,25

INP sustituyó a FID en marzo de 2024. Si lees guías que hablan de FID, están desactualizadas.

Datos de laboratorio y datos reales

PageSpeed Insights enseña dos cosas distintas. Arriba, si tu web tiene suficiente tráfico, salen los datos de usuarios reales de los últimos 28 días: es lo que usa Google. Abajo sale una prueba de laboratorio, una simulación en ese momento. La nota de 0 a 100 es del laboratorio y cambia de una prueba a otra; no te obsesiones con ella.

En webs con poco tráfico no hay datos reales todavía. Ahí el laboratorio sirve como guía.

Las causas más habituales, por orden de impacto

Imágenes

Casi siempre son lo primero. Fotos de 4.000 píxeles para un hueco de 800, en JPG o PNG sin comprimir.

  • Usa formatos modernos como WebP o AVIF.
  • Sirve cada imagen al tamaño en que se ve.
  • Pon ancho y alto en el código para que el navegador reserve el hueco.
  • Carga en diferido lo que está más abajo, pero nunca la imagen principal de arriba.

Scripts de terceros

Chats, píxeles de publicidad, mapas, widgets de reseñas, vídeos incrustados. Cada uno carga su código, y algunos bloquean la página. Revisa qué sigue haciendo falta y carga el resto después de la interacción o al final.

Fuentes

Varias familias y pesos cargados desde otro dominio retrasan el texto. Lo que mejor funciona: alojar las fuentes en tu propio dominio, en formato WOFF2, solo los pesos que usas, y precargar la principal.

El constructor

Algunos constructores visuales y temas cargan en cada página el código de todas sus funciones, uses las que uses. Ahí el margen de mejora es limitado, y es uno de los motivos por los que se migra a código propio.

Cosas que se mueven

El CLS sube cuando algo aparece y empuja el contenido: un banner de cookies que entra arriba, una imagen sin dimensiones, un anuncio que se carga tarde. Reserva el espacio desde el principio.

Cuánto importa para el posicionamiento

Google usa estas métricas como una señal más dentro de la experiencia de página. Pesa más que el contenido responda bien a la búsqueda. Donde más se nota una web lenta es en la conversión: la gente se va antes de leer.

Cómo lo trabajamos en Lente

Construimos con código propio, imágenes optimizadas, fuentes alojadas en el dominio del cliente y sin dependencias que no hagan falta. Es más fácil hacer una web rápida desde el principio que acelerar una lenta después.

Preguntas frecuentes

¿Con qué herramienta mido la velocidad de mi web?

PageSpeed Insights para revisar una URL concreta y el informe de Core Web Vitals de Google Search Console para ver la web entera con datos de usuarios reales.

¿Por qué PageSpeed me da una nota distinta cada vez?

La nota sale de una prueba de laboratorio que depende de la red y del servidor en ese momento. Fíjate en las métricas concretas y en los datos de usuarios reales, no en el número redondo.

¿Sacar un 100 en PageSpeed garantiza buen posicionamiento?

No. Es una señal más. Sin contenido útil y bien enlazado, una web rápida tampoco posiciona.

¿Tienes un proyecto entre manos?

Te decimos qué necesitas de verdad y cuánto cuesta, con presupuesto y fecha cerrados.