Core Web Vitals para WordPress
Las Core Web Vitals miden la carga, la capacidad de respuesta y la estabilidad visual. Las métricas actuales son LCP, INP y CLS. Para los equipos que mantienen webs de WordPress, permiten detectar si los visitantes esperan demasiado para ver el contenido principal, encuentran controles que responden con lentitud o sufren desplazamientos inesperados de los elementos.
INP sustituyó a FID el 12 de marzo de 2024. Si tu lista de comprobaciones de rendimiento todavía utiliza FID, actualízala antes de evaluar tus webs.
Tabla de contenidos
Las tres Core Web Vitals
| Métrica | Qué mide | Bueno | Necesita mejorar | Deficiente |
|---|---|---|---|---|
| LCP | Carga de la imagen o bloque de texto visible de mayor tamaño | 2,5 segundos o menos | Más de 2,5 y hasta 4 segundos | Más de 4 segundos |
| INP | Respuesta a las interacciones | 200 milisegundos o menos | Más de 200 y hasta 500 milisegundos | Más de 500 milisegundos |
| CLS | Movimiento visual inesperado | 0,1 o menos | Más de 0,1 y hasta 0,25 | Más de 0,25 |
Google evalúa estos objetivos en el percentil 75, por separado para móviles y ordenadores. Para superar la evaluación, las tres métricas deben alcanzar sus umbrales de nivel bueno. Consulta las definiciones de Core Web Vitals de Google.
LCP mide la carga
Largest Contentful Paint registra cuándo aparece la imagen o el bloque de texto más grande dentro del área visible. En una página de WordPress puede ser la imagen de cabecera, la de un producto o el título principal. Identifica el elemento LCP real antes de decidir qué optimizar.
INP mide la capacidad de respuesta
Interaction to Next Paint tiene en cuenta los clics, los toques y las interacciones con el teclado durante una visita. Mide el tiempo hasta la siguiente actualización visual, incluidos el retraso de entrada, el procesamiento y la presentación. FID solo medía el retraso anterior al procesamiento de la primera interacción, por lo que ambas métricas no son intercambiables.
Un menú móvil lento o un filtro de productos que tarda en responder son buenas interacciones para investigar. INP no mide todo el tiempo necesario para completar una petición asíncrona, y el desplazamiento por la página no es una interacción incluida en la métrica. La documentación de INP de Google explica cómo se calcula.
CLS mide la estabilidad visual
Cumulative Layout Shift recoge los movimientos inesperados del contenido visible. Las imágenes sin espacio reservado, los banners que se expanden y las fuentes que cargan tarde pueden desplazar textos o controles. CLS es una puntuación, no una duración.
Herramientas para medir las Core Web Vitals
Google PageSpeed Insights
Empieza por PageSpeed Insights. Su sección de datos de campo utiliza información de visitantes reales del Chrome User Experience Report durante un periodo móvil de 28 días. Comprueba si estás viendo datos de la URL o del origen completo y revisa móviles y ordenadores por separado.
Lighthouse
La sección de Lighthouse es una prueba de laboratorio controlada. Utiliza sus diagnósticos para investigar problemas, pero no confundas su puntuación de rendimiento con una evaluación favorable de Core Web Vitals. Una prueba estándar de navegación de Lighthouse no reproduce las interacciones de una visita completa; Total Blocking Time puede ayudar a diagnosticar la capacidad de respuesta, pero no es INP.
Si no hay datos de campo, el informe no dispone de suficientes datos válidos; eso no significa que la página apruebe ni que suspenda. Utiliza pruebas de laboratorio y, cuando proceda, tu propia monitorización de usuarios reales. La documentación de PageSpeed Insights de Google explica esta diferencia.
Google Search Console
Utiliza el informe de Core Web Vitals para identificar grupos de URLs afectados e investiga páginas representativas, sin asumir que todas tienen la misma causa. Mantén separados los resultados de móviles y ordenadores. Una plantilla, fuente o plugin compartido puede afectar a muchas páginas, así que los patrones del grupo ayudan a priorizar la siguiente investigación.
Chrome DevTools
Abre Chrome DevTools y selecciona el panel Performance. Graba una visita mientras abres el menú móvil, cambias un filtro de productos o utilizas otro control lento. Examina la interacción y el trabajo que la rodea para localizar retrasos en la ejecución de JavaScript o en el renderizado. La documentación oficial del panel Performance explica el proceso de grabación.
Esta captura muestra la interfaz de DevTools con Elements seleccionado. Cambia a Performance para investigar la carga y las interacciones; la disposición puede variar según la versión de Chrome.
WebPageTest
WebPageTest permite investigar la carga mediante diagramas de peticiones y secuencias visuales. Mantén la misma ubicación, dispositivo y conexión al comparar un cambio. Una prueba controlada complementa los datos de usuarios reales, pero no los sustituye.
GTmetrix
GTmetrix ofrece informes basados en Lighthouse, diagramas de peticiones y opciones de monitorización. Comprueba la configuración de la prueba y las funciones disponibles en tu plan antes de comparar resultados. No interpretes un valor de TBT de laboratorio como una medición de INP ni des por hecho que todos los informes representan a tus visitantes móviles.
web.dev
Utiliza web.dev como biblioteca de referencia de Google para las definiciones de las métricas y las técnicas de optimización. Realiza las mediciones con la herramienta de pruebas o monitorización adecuada y consulta después la documentación para entender los resultados.
Nuestra comparativa de herramientas para analizar el rendimiento web recoge otras opciones.
Cómo mejorar las Core Web Vitals en WordPress
Mejorar LCP
- Identifica el elemento visible de mayor tamaño y comprueba qué retrasa su aparición.
- Si el elemento LCP es una imagen, sirve un archivo comprimido y de dimensiones adecuadas, y facilita que el navegador lo descubra pronto. No apliques carga diferida a la imagen LCP. Reserva esta técnica para el contenido adecuado situado más abajo en la página.
- Investiga las respuestas lentas del servidor, los recursos que bloquean el renderizado y los que se cargan tarde. Utiliza caché o una CDN cuando resuelvan el cuello de botella que has medido.
Las recomendaciones de optimización de LCP de Google explican cómo separar estos retrasos.
Mejorar INP
- Graba las interacciones lentas en Chrome DevTools, incluidos menús, filtros y controles de formularios.
- Reduce el JavaScript innecesario y revisa los widgets o plugins de terceros que ejecutan tareas costosas.
- Divide las tareas largas en partes más pequeñas y reduce el trabajo de renderizado costoso. Prueba con cuidado los cambios en la carga de scripts para que el proceso de compra y las demás funciones esenciales sigan funcionando.
Sigue el proceso de optimización de INP de Google para identificar si el retraso se produce antes, durante o después del procesamiento del evento.
Mejorar CLS
- Reserva espacio para imágenes, vídeos, contenido incrustado y bloques de publicidad.
- Evita insertar banners u otros elementos por encima del contenido existente de forma inesperada.
- Revisa la carga de fuentes y los cambios de disposición que se producen después de la carga inicial.
La documentación de optimización de CLS recoge causas y soluciones habituales.
Revisa la caché, las imágenes y el alojamiento
En las imágenes, reduce las dimensiones y el peso innecesarios conservando la calidad, y reserva su espacio en el diseño. Aplica carga diferida al contenido adecuado que quede fuera del área visible, no a la imagen responsable de LCP.
La caché de página puede reducir el trabajo repetido del servidor, mientras que una CDN puede acortar el recorrido de entrega a los visitantes. Revisa las exclusiones de caché de las páginas personalizadas y del proceso de compra antes de cambiar los ajustes. Ninguna de estas medidas resuelve por sí sola todos los retrasos de interacción.
Revisa las familias y los grosores tipográficos, el tamaño de descarga y el comportamiento de las fuentes alternativas, en lugar de aplicar un límite arbitrario de fuentes. Si el tiempo de respuesta del servidor sigue siendo un cuello de botella, investiga los recursos del alojamiento y el trabajo de la aplicación antes de decidir si necesitas cambiar de proveedor.
Una rutina de mantenimiento para agencias
Elige plantillas representativas, como la portada, una página de servicios, un artículo y una ficha de producto. Anota la métrica que falla, el tipo de dispositivo y la fuente de los datos, y prioriza los problemas que afectan a recorridos importantes o a plantillas compartidas.
Haz una copia de seguridad, prueba un cambio concreto en un entorno de pruebas y compara los resultados en condiciones similares. Comprueba los formularios, la navegación y el proceso de compra antes de publicarlo. Después, supervisa los datos de campo teniendo en cuenta el periodo móvil del informe, sin esperar que la evaluación cambie de inmediato.
Modular DS ayuda a centralizar las copias de seguridad, las actualizaciones y la monitorización de WordPress dentro de esta rutina. Utilízalo junto con tus herramientas de diagnóstico de rendimiento; las herramientas de mantenimiento no sustituyen la investigación de la causa de una mala métrica. Consulta nuestra lista de tareas y proceso de mantenimiento de WordPress para completar el flujo de trabajo.
Preguntas frecuentes
¿FID sigue siendo una Core Web Vital?
No. INP sustituyó a FID en marzo de 2024. Utiliza LCP, INP y CLS para evaluar las Core Web Vitals actuales.
¿Una puntuación de 100 en Lighthouse significa que apruebo?
No. La puntuación de laboratorio y la evaluación de campo miden cosas diferentes. Comprueba las métricas de usuarios reales y su ámbito de dispositivo y URL.
¿Superar las Core Web Vitals garantiza mejores posiciones?
No. Google utiliza las Core Web Vitals en sus sistemas de posicionamiento, pero unos buenos resultados no garantizan las primeras posiciones. La relevancia del contenido y otras señales siguen contando, como explica Google Search Central.
¿Por qué no cambia el informe de campo tras una mejora?
Su periodo móvil todavía incluye visitas anteriores al cambio. Confirma primero la corrección con las herramientas de diagnóstico y observa después la evolución a medida que se incorporan nuevas visitas al informe.
