Los Core Web Vitals son métricas que evalúan aspectos de la experiencia de una página: carga del contenido principal, respuesta a las interacciones y estabilidad visual. Las métricas actuales son LCP, INP y CLS. INP sustituyó a FID en 2024, por lo que una auditoría basada únicamente en FID está desactualizada.
Sirven para localizar problemas que pueden dificultar la navegación. Obtener buenos valores no garantiza una posición en Google ni sustituye un contenido útil y relevante.
Cuáles son los Core Web Vitals y sus umbrales
- LCP, Largest Contentful Paint: mide cuándo se muestra el elemento de contenido más grande dentro del área visible. El umbral bueno es de 2,5 segundos o menos.
- INP, Interaction to Next Paint: evalúa la capacidad de respuesta a las interacciones a lo largo de la visita. El umbral bueno es de 200 milisegundos o menos.
- CLS, Cumulative Layout Shift: mide los desplazamientos inesperados del contenido. El umbral bueno es de 0,1 o menos; no se expresa en segundos.
La evaluación utiliza el percentil 75, separando móvil y escritorio. Para superar la evaluación, las tres métricas deben cumplir sus umbrales. La documentación de Web Vitals recoge las definiciones y herramientas de medición.
Datos de campo y pruebas de laboratorio
Los datos de campo reflejan experiencias reales. PageSpeed Insights puede mostrar información de Chrome UX Report recopilada durante los últimos 28 días, cuando existe una muestra suficiente. Comprueba si los datos corresponden a la URL o al conjunto del origen: no son lo mismo.
Los datos de laboratorio simulan una visita bajo condiciones concretas y permiten investigar causas. Una prueba aislada puede variar por carga del servidor, dispositivo y red. Repite mediciones comparables antes de atribuir una mejora a un cambio.
La nota de rendimiento de Lighthouse no equivale al resultado de Core Web Vitals. Una prueba de carga sin interacciones no mide INP de campo; TBT puede orientar el diagnóstico de bloqueos, pero no es la misma métrica.
Consulta la documentación de PageSpeed Insights para interpretar ambos grupos de datos. Que falten datos reales no significa que la página apruebe o suspenda.
Cómo mejorar el Largest Contentful Paint
- Identifica el elemento LCP. Puede ser una imagen o un bloque de texto, y puede cambiar según el tamaño de pantalla.
- Revisa la respuesta inicial del servidor. Investiga alojamiento, caché y trabajo necesario para generar la página.
- Optimiza el recurso principal. Ajusta dimensiones, peso y formato de la imagen cuando sea el elemento relevante.
- Evita retrasar su descubrimiento. No apliques carga diferida a una imagen principal necesaria desde el inicio. Valora su prioridad de carga tras comprobar el diagnóstico.
- Reduce bloqueos de renderizado. Revisa hojas de estilo, fuentes y scripts que impiden mostrar el contenido.
No hace falta dar prioridad alta a todas las imágenes: competirían entre sí. La guía para optimizar imágenes web complementa estas tareas. Para un diagnóstico técnico, consulta la guía de optimización de LCP.
Cómo mejorar INP y CLS
INP: botones y menús que responden
Prueba interacciones reales: abrir el menú, filtrar productos o enviar un formulario. Investiga tareas largas de JavaScript, controladores de eventos y actualizaciones de interfaz costosas. Reducir código innecesario o dividir trabajo puede ayudar, pero hay que comprobar que las funciones siguen funcionando.
La guía de INP distingue las fases de una interacción para localizar el cuello de botella. Un menú lento no se corrige necesariamente comprimiendo la imagen de portada.
CLS: contenido que mantiene su lugar
Reserva espacio para imágenes, vídeos, anuncios y módulos que cargan después. Revisa cambios de tipografía y elementos insertados por encima de lo que se está leyendo. Observa la página durante el uso, no únicamente al terminar de cargar.
La guía de CLS ayuda a investigar las causas habituales. Reservar espacio no implica fijar alturas que corten el contenido en móvil: el diseño debe seguir adaptándose.
Cómo organizar una mejora en WordPress
Empieza por páginas representativas de cada plantilla y registra dispositivo, fecha y problema. Prioriza lo que afecta a más visitas o dificulta acciones importantes. Prueba cambios en un entorno controlado y valida formularios, menús y contenidos antes de publicarlos.
Tras implementar una mejora, el laboratorio puede mostrar el efecto antes que la ventana acumulada de datos reales. Sigue la evolución en Search Console y evita añadir varios plugins de optimización sin revisar sus solapamientos.
Si necesitas abordar rendimiento y navegación como parte de un proyecto, consulta nuestro servicio de diseño web.
