PageSpeed: Guía Completa para Mejorar la Velocidad de Tu Web
Todo lo que necesitas saber sobre PageSpeed Insights, Core Web Vitals y cómo conseguir un score de 90+ en tu web.
En resumen
- Core Web Vitals: LCP menos de 2,5s, INP menos de 100ms y CLS menos de 0,1; Google los evalúa con datos de campo desde 2021.
- Mide bien: prioriza los datos de campo de los últimos 28 días sobre el score de laboratorio: un 85 con buen LCP real puede superar a un 98 simulado.
- Mejoras clave: precarga la imagen del LCP, sirve WebP o AVIF con srcset, difiere el JavaScript no crítico y activa Brotli.
- Errores frecuentes: varios optimizadores a la vez se pisan entre sí; audita también las páginas que venden, no solo la portada.
¿Qué es PageSpeed Insights?
PageSpeed Insights (PSI) es una herramienta gratuita de Google que analiza el rendimiento de tu web tanto en dispositivos móviles como en escritorio. Proporciona un score del 0 al 100 y consejos específicos para mejorar la velocidad de carga.
A diferencia de otras herramientas, PSI combina datos reales de usuarios (Campo Data) con simulaciones de laboratorio (Lab Data). Esto significa que no solo te dice cómo se comporta tu web en condiciones controladas, sino cómo la experimentan tus visitantes reales.
Puedes usarla gratuitamente en pagespeed.web.dev. Solo necesitas introducir la URL de tu web y en segundos tendrás un informe completo.
¿Por qué importa la velocidad?
53%
de visitantes cierran una web que tarda más de 3 segundos en cargar
-7%
de conversiones por cada segundo de retardo en la carga
1-3s
es el rango aceptable para Google. Más de 3s es crítico
Google usa la velocidad como factor de posicionamiento desde 2021 (Core Web Vitals). Una web lenta no solo pierde visitantes, sino que también pierde posiciones en los resultados de búsqueda. Según estudios, el 1er resultado de Google recibe el 31.7% de los clics, mientras que el 10° solo recibe el 2.4%.
Core Web Vitals: Las 3 métricas que importan
Google ha simplificado las métricas de rendimiento en 3 indicadores clave llamados Core Web Vitals. Estos son los que realmente afectan a tu posicionamiento:
LCP (Largest Contentful Paint)
Qué mide: Cuánto tarda en cargar el contenido principal de la página (típicamente una imagen o bloque de texto grande).
Objetivo: Menos de 2.5 segundos.
Cómo mejorarlo: Optimiza imágenes (WebP, compresión), usa CDN, mejora el tiempo de respuesta del servidor, elimina render-blocking resources.
FID (First Input Delay) → INP (Interaction to Next Paint)
Qué mide: Cuánto tarda la web en responder cuando un usuario hace clic por primera vez. Desde 2024, Google usa INP que mide la interactividad general.
Objetivo: Menos de 100 milisegundos.
Cómo mejorarlo: Minifica JavaScript, divide el código en chunks, usa defer/async para scripts no críticos, reduce el trabajo del hilo principal.
CLS (Cumulative Layout Shift)
Qué mide: Cuánto se mueve el contenido de la página mientras se carga. Un CLS alto significa que los elementos se desplazan inesperadamente.
Objetivo: Menos de 0.1.
Cómo mejorarlo: Define dimensiones explícitas en imágenes y videos, usa CSS para reservar espacio, evita inyectar contenido dinámico sobre el contenido existente.
Cómo medir la velocidad de tu web
Existen varias herramientas gratuitas para medir la velocidad de tu web. Te recomiendo usar al menos dos para obtener una visión completa:
Google PageSpeed Insights
La herramienta oficial de Google. Combina datos de campo y laboratorio. Gratis en pagespeed.web.dev
GTmetrix
Análisis detallado con waterfall, screenshots y recomendaciones específicas. Versión gratuita disponible.
Lighthouse (Chrome DevTools)
Integrado en Chrome. Puedes ejecutarlo desde las DevTools (F12 → Lighthouse).
WebPageTest
Análisis profundo desde múltiples ubicaciones y dispositivos. Ideal para diagnóstico avanzado.
10 Mejoras que puedes hacer hoy
Estas son las optimizaciones más efectivas que puedes implementar sin ser programador experto:
Optimiza tus imágenes
Convierte imágenes a WebP, comprimelas (TinyPNG), y usa lazy loading. Las imágenes pesadas son la causa #1 de webs lentas.
Habilita la caché del navegador
Configura headers de caché para que los visitantes no descarguen los mismos recursos cada vez que visitan tu web.
Minifica CSS y JavaScript
Elimina espacios, comentarios y código innecesario. Plugins como Autoptimize lo hacen automáticamente.
Usa una CDN
Una Red de Distribución de Contenido sirve tu web desde el servidor más cercano al visitante. Cloudflare tiene plan gratuito.
Reduce redirects
Cada redirección añade tiempo de carga. Minimiza las redirecciones 301/302.
Optimiza el servidor
Usa hosting de calidad. El hosting compartido barato suele ser el cuello de botella.
Elimina plugins innecesarios
Cada plugin de WordPress añade código. Desactiva los que no uses.
Usa lazy loading
Carga las imágenes solo cuando el usuario las necesita (scroll). WordPress lo incluye por defecto desde la versión 5.5.
Optimiza la base de datos
Limpia revisiones, transients y datos huérfanos. Plugins como WP-Optimize lo hacen automático.
Implementa AMP (si aplica)
Accelerated Mobile Pages carga casi instantáneamente en dispositivos móviles. Ideal para blogs y noticias.
Errores comunes que debes evitar
Imágenes sin optimizar
Subir fotos de 5MB desde la cámara sin comprimirlas. Convierte siempre a WebP y comprime.
Demasiados plugins de WordPress
Cada plugin añade CSS y JavaScript. Usa solo los esenciales y desactiva los que no necesites.
Hosting compartido barato
El hosting compartido comparte recursos con cientos de webs. Si una recibe mucho tráfico, todas sufren.
No usar CDN
Si tu servidor está en España y tu cliente en México, la web tardará más en cargar. Una CDN resuelve esto.
¿Cuándo necesitas ayuda profesional?
Si después de implementar las mejoras básicas tu web sigue teniendo un score bajo, es momento de buscar ayuda profesional. Un ingeniero web puede:
- Realizar una auditoría técnica profunda
- Optimizar el código a nivel de servidor
- Implementar CDN y caché avanzada
- Configurar el hosting óptimo
- Monitorizar y mantener la velocidad a largo plazo
Qué es PageSpeed Insights y cómo funciona
PageSpeed Insights (PSI) no se limita a darte un número: ejecuta Lighthouse, una batería de pruebas estandarizadas, sobre tu URL y devuelve un informe con dos tipos de información que conviene separar.
Datos de laboratorio: se obtienen en un entorno controlado, con un dispositivo y una conexión simulados. Son ideales para depurar porque el resultado es reproducible, pero no representan el móvil real de tu visitante.
Datos de campo: proceden del Chrome User Experience Report, es decir, de cómo se ha comportado tu web en Chrome real durante los últimos 28 días. Esta es la información que Google utiliza para evaluar tus Core Web Vitals.
El informe se estructura en tres bloques: la puntuación del 0 al 100, donde el LCP, el CLS y el bloqueo del hilo principal pesan mucho más que el resto; las oportunidades, mejoras concretas con el tiempo que ahorrarías al aplicarlas; y los diagnósticos, que revelan recursos que bloquean la renderización, el peso del HTML o la falta de caché. Cuanto más tráfico tenga tu web, más representativos serán los datos de campo. Si acabas de lanzarla, PSI trabajará casi en modo laboratorio.
Los 3 Core Web Vitals explicados
Detrás de cada métrica hay una experiencia de usuario concreta. Estos son los tres indicadores que Google vigila, explicados en cristiano:
LCP: ¿cuándo veo algo en pantalla?
Imagina que entras en una tienda física y la luz tarda tres segundos en encenderse. Eso es un LCP alto: el tiempo que transcurre desde que pides la página hasta que ves el contenido principal, normalmente la imagen de portada, el titular o el bloque de texto grande.
Para el usuario, el reloj no arranca cuando termina la descarga, sino cuando deja de ver una pantalla en blanco. Por eso Google exige menos de 2.5 segundos: a partir de ahí, la sensación de web lenta ya es evidente y el visitante empieza a marcharse.
En el informe de PSI encontrarás el LCP junto al elemento concreto que lo dispara. Corrige ese elemento primero: casi siempre es el mayor cuello de botella de la página.
CLS: ¿se mueve todo mientras leo?
Estás leyendo un párrafo y de repente el texto salta porque arriba ha aparecido un banner, una imagen sin dimensiones o una fuente que tardó en cargar. Ese salto de diseño es el CLS, y la molestia es doble: no solo esperas, sino que pierdes el lugar que estabas leyendo y puedes acabar pulsando algo sin querer.
El objetivo es menos de 0.1, algo prácticamente imperceptible. Por debajo de 0.25 Google ya lo considera deficiente.
Las causas más habituales son el banner de cookies sin espacio reservado, los anuncios o iframes que se insertan por encima del contenido y las imágenes sin width y height declarados. Reserva el espacio desde el CSS y el salto desaparece.
TTFB: ¿cuánto tarda el servidor en contestar?
El TTFB no es un Core Web Vital oficial, pero es el cimiento de los otros dos: los milisegundos que pasan desde que el navegador envía la petición hasta que recibe el primer byte de respuesta del servidor. Si tu servidor tarda un segundo en empezar a contestar, el LCP arranca tarde por mucho que optimices el front-end.
El objetivo es menos de 800 ms y lo ideal es quedarse por debajo de 500 ms.
Cuando el TTFB es alto, el problema casi nunca está en el código de la página: está en el hosting, en la ausencia de caché de objetos, en consultas lentas a la base de datos o en la falta de una CDN que acorte la distancia física hasta el servidor.
10 consejos para mejorar tu PageSpeed
Más allá de las mejoras básicas, estos son los ajustes que más puntos suelen mover en un informe de PageSpeed Insights:
- 1
Precarga la imagen del LCP
Añade un link rel=preload a la imagen de portada para que el navegador la descargue sin esperar a descubrirla al interpretar el CSS. Es la mejor relación esfuerzo/resultado cuando el LCP es una imagen.
- 2
Entrega imágenes en formatos modernos
Convierte a WebP o AVIF y sirve tamaños alternativos con srcset para que el móvil no descargue la versión de escritorio. Un hero de 300KB pasa a pesar 60KB sin pérdida de calidad visible.
- 3
Diferre el JavaScript no crítico
Marca con defer o async los scripts que no intervienen en la primera pantalla, como menús, animaciones o widgets, y divide el código en bloques para que el navegador pinte antes el contenido.
- 4
Elimina el CSS sin usar
Las plantillas modernas arrastran estilos de decenas de páginas que tu home nunca utiliza. Purga el CSS y deja solo lo que se ve en cada plantilla: menos peticiones y menos trabajo de renderizado.
- 5
Optimiza las fuentes web
Precarga la fuente principal, limita los pesos (con normal y bold suele bastar), usa font-display swap para mostrar el texto con la fuente de sistema y subconjunta los caracteres que no usas.
- 6
Reduce los scripts de terceros
Chats, mapas, heatmaps y píxeles publicitarios ocupan el hilo principal en segundo plano. Carga los que no son vitales tras la interacción del usuario y vigila su impacto tras cada campaña.
- 7
Activa HTTP/2 o HTTP/3 y compresión Brotli
Los protocolos modernos envían varias peticiones por la misma conexión y Brotli reduce el tamaño de HTML, CSS y JS entre un 15% y un 20%. Casi todos los hostings actuales lo activan con un clic.
- 8
Configura la caché con versionado
Guarda los recursos estáticos en caché durante semanas y cambia el nombre del archivo cuando lo modifiques. Así el visitante que vuelve solo descarga lo que realmente ha cambiado.
- 9
Carga los vídeos bajo demanda
Un vídeo de YouTube incrustado descarga cientos de KB antes de que nadie lo reproduzca. Sustitúyelo por una miniatura que arranque el reproductor solo al hacer clic.
- 10
Mide cada mes y fija un presupuesto de rendimiento
Establece un límite claro (ninguna página supera 1,5 s de LCP ni 200KB de JavaScript) y revisa PSI y los informes de Search Console tras cada cambio para detectar regresiones a tiempo.
Errores comunes de PageSpeed
1. Mirar solo la puntuación
El número del 0 al 100 es una guía, no una meta. Google valora los Core Web Vitals con datos de campo: una web con score 85 pero buen LCP real puede superar a una con 98 de laboratorio.
2. Instalar varios optimizadores a la vez
Dos plugins de caché o de minificación se pisan entre sí, duplican recursos y generan errores difíciles de rastrear. Un solo plugin bien configurado rinde más que tres a medias.
3. Medir una sola vez y en condiciones irreales
Lanzar pruebas desde una red corporativa o con el ordenador saturado falsea el resultado. Repite las mediciones a distintas horas y contrasta siempre con los datos de campo.
4. Optimizar únicamente la home
Las fichas de producto y las landing pages de campaña son las que suelen vender y muchas veces las más pesadas. Audita las páginas que generan ingresos, no solo la portada.
5. Cambiar código sin medir ni respaldar
Aplicar optimizaciones sin copia de seguridad previa y sin registrar el antes y el después hace imposible saber qué mejora funcionó y qué acabó rompiendo.
Cuándo contratar a un profesional
Hay momentos en los que seguir tocando ajustes solo consume tiempo sin mover la aguja. Estas son las señales de que toca delegar:
- Tu score lleva estancado por debajo de 70 pese a aplicar todas las mejoras básicas: el problema está en el código o en el servidor, no en la configuración.
- Search Console marca los Core Web Vitals como deficientes con datos de campo aunque el front-end esté optimizado: apunta a un TTFB alto, falta de caché de objetos o una base de datos sobrecargada.
- Tu web tiene tráfico real y genera ingresos. Cada segundo de más se traduce en carritos abandonados, y el coste de una auditoría profesional se recupera en pocas conversiones.
- Vas a migrar de hosting o de plataforma: es el momento más fácil para romper la velocidad y el mejor para dejar la base bien montada.
Puedes empezar por nuestra auditoría gratuita, conocer el servicio de SEO técnico o ver qué analizamos exactamente en la página de webs lentas.
Artículos relacionados
Preguntas Frecuentes
¿Necesitas mejorar la velocidad de tu web?
Auditoría de velocidad gratuita. En 24 horas sabrás qué mejorar.