Desde 2021, Google utiliza los Core Web Vitals como factor de ranking. En términos simples: si tu web carga lenta, se mueve al cargar o tarda en responder al tocar un botón, Google te empuja hacia abajo en los resultados de búsqueda. Y no es solo un capricho del algoritmo. Los usuarios abandonan una web si tarda más de tres segundos en cargar. Una web lenta es menos visitas, menos clientes y menos ingresos.
Qué son LCP, FID, CLS (explicado para no técnicos)
Google condensa la experiencia de velocidad en tres métricas. No hace falta ser desarrollador para entenderlas:
- LCP (Largest Contentful Paint): Mide qué tan rápido aparece el contenido principal de la página. Imagina que entras a una tienda online y la imagen del producto tarda en verse. Eso es LCP. Objetivo: menos de 2.5 segundos.
- FID (First Input Delay): Mide el tiempo que pasa desde que el usuario toca un botón o un enlace hasta que la web responde. Si pulsas "Añadir al carrito" y nada pasa durante medio segundo, la experiencia es frustrante. Objetivo: menos de 100 milisegundos.
- CLS (Cumulative Layout Shift): Mide cuánto se mueven los elementos de la página mientras carga. ¿Te ha pasado que vas a pulsar un botón y de repente salta un anuncio y das donde no querías? Eso es CLS. Objetivo: menos de 0.1.
Cumplir con estos tres umbrales no solo mejora tu posicionamiento: reduce el porcentaje de rebote y aumenta las conversiones.
Cómo medir (PageSpeed Insights, Lighthouse)
Antes de arreglar nada, hay que saber qué está roto. Existen dos herramientas gratuitas imprescindibles:
- PageSpeed Insights: Introduces tu URL y te da una puntuación del 0 al 100 junto con los valores reales de LCP, FID (ahora INP) y CLS. Lo más valioso es que distingue entre Field Data (datos reales de usuarios de Chrome) y Lab Data (simulación controlada). Si tienes tráfico suficiente, confía en los datos de campo.
- Lighthouse: Integrado en las herramientas de desarrollo de Chrome (F12 → Lighthouse). Permite auditar en condiciones simuladas de móvil y escritorio, y te da un informe detallado de qué optimizar.
Presta especial atención a la versión móvil. Google indexa primero la versión móvil de tu web, y los móviles suelen tener peores métricas que los ordenadores por culpa de conexiones más lentas y procesadores menos potentes.
Optimizaciones rápidas que funcionan
No hace falta rehacer toda la web. Estas cinco optimizaciones suelen mover la aguja de forma inmediata:
Imágenes WebP + lazy loading
Las imágenes suelen ser el recurso más pesado. Convertirlas a WebP reduce su tamaño entre un 25% y un 35% sin pérdida visible de calidad. Además, añade loading="lazy" a las imágenes que están fuera de la pantalla inicial para que solo se descarguen cuando el usuario hace scroll.
CSS crítico inline + carga diferida del resto
El CSS que renderiza la parte visible de la página (above the fold) debe estar directamente en el HTML, dentro de una etiqueta <style>. El resto del CSS se carga de forma asíncrona. Esto evita que el navegador espere a descargar un fichero CSS grande antes de pintar nada.
Preconnect a dominios externos (fuentes, analytics)
Si usas Google Fonts, Analytics o cualquier script de terceros, añade <link rel="preconnect"> a esos dominios. Le dice al navegador que abra la conexión cuanto antes, reduciendo el tiempo de espera.
Compresión Brotli/Gzip en el servidor
Activar Brotli (o Gzip como fallback) en tu servidor web (Nginx, Apache, Caddy) reduce el tamaño de transferencia de HTML, CSS y JavaScript hasta en un 70%. Es una configuración de cinco minutos que mejora todos los tiempos de carga.
Minificar CSS y JS
Eliminar espacios, comentarios y saltos de línea de los ficheros CSS y JavaScript reduce su tamaño sin cambiar su funcionalidad. Herramientas como Terser para JavaScript y cssnano para CSS hacen esto automáticamente en el proceso de build.
Caso real: antes y después
Estas son las métricas reales de una landing page de una pyme tras aplicar las optimizaciones descritas:
| Métrica | Antes | Después |
|---|---|---|
| LCP | 4.2 s | 1.8 s |
| FID | 280 ms | 45 ms |
| CLS | 0.25 | 0.03 |
| PageSpeed móvil | 42 | 92 |
La diferencia no es solo técnica: el tiempo medio de sesión subió un 18% y la tasa de rebote bajó del 68% al 41%. Google empezó a posicionar la página en primera página para dos de sus keywords principales a las seis semanas.
Optimizar Core Web Vitals no es una tarea única: es un hábito. Cada vez que añades un nuevo plugin, un banner o un script de chat, revisa el impacto en las métricas. Una web rápida es una web que vende mejor, y Google lo sabe.