Para hacer nuestro contenido accesible a más usuarios, hemos traducido este artículo del inglés al español mediante traducción automática. Haz clic aquí para leer el artículo original. Si detectas algún problema en el contenido, no dudes en escribirnos a report-osteam@semrush.com.
¿Qué son las Vitales Web Básicas?
Las Core Web Vitals de Google son una colección de métricas que indican lo fácil de usar que es un sitio web basándose en su tiempo de carga, estabilidad visual e interactividad.
Los Google Core Web Vitals incluyen:
- Pintura de mayor contenido (LCP): Mide cuánto tarda en cargarse el elemento de contenido más grande de la página
- Desplazamiento acumulativo del diseño (CLS): Mide cuánto se desplaza inesperadamente el diseño de la página mientras se carga. Como imágenes o botones cambiantes.
- Interacción hasta la siguiente pintura (INP): Mide el tiempo que transcurre desde que un usuario inicia cualquier interacción hasta que se muestra la siguiente actualización visual
Cuanto mejor funcione una página según estas métricas, mejor será la experiencia que ofrezca.
En este artículo, explicaremos la relación entre las Core Web Vitals y el SEO, los umbrales recomendados de cada una de las métricas y cómo comprobar el rendimiento de tu sitio.
Después, te mostraremos cómo mejorar tus resultados.
¿Por qué son importantes las Vitales Web Básicas?
El buen rendimiento de Core Web Vitals garantiza una experiencia de usuario fluida, rápida y estable. Y también mejora tu SEO.
Es más probable que la gente se quede (y potencialmente se convierta en cliente) en un sitio que funciona bien y responde a sus peticiones con rapidez. Por eso los sitios que cargan más rápido suelen tener tasas de rebote más bajas.
Google también tiene en cuenta las Core Web Vitals en sus factores de clasificación.
Por tanto, optimizar estas métricas puede mejorar el rendimiento de tu sitio en las clasificaciones de búsqueda. Y dirige más tráfico a tu sitio web
¿Cuáles son los umbrales recomendados para las principales métricas de Web Vitals?
Veamos qué umbrales recomienda Google para cada métrica:
Pintura de mayor contenido (LCP
LCP refleja la rapidez con la que los usuarios pueden ver el contenido de tu página. Y se mide en segundos.
Un buen LCP tarda 2,5 segundos o menos. Esto significa que la imagen principal, el vídeo o el gran bloque de texto se cargan casi inmediatamente cuando alguien entra en la página.
Un LCP de entre 2,6 y 4 segundos significa que la velocidad de tu sitio web necesita mejorar.
Y un pobre LCP es cualquier cosa de más de 4 segundos. Porque puede frustrar a los visitantes, haciendo más probable que abandonen tu sitio.
Otras lecturas: La Pintura de Mayor Contenido (LCP): Qué es & Cómo mejorarla
Desplazamiento de disposición acumulativo (CLS
CLS revela cuánto se mueven inesperadamente los elementos de la página mientras ésta se carga. La métrica se expresa en forma de puntuación.
Una buena puntuación CLS es de 0,1 o menos y significa que el diseño de tu página es muy estable. Esto facilita que los usuarios vean tu contenido sin interrupciones.
Una puntuación CLS entre 0,1 y 0,25 significa que la estabilidad visual de tu sitio web necesita mejorar. Hay suficiente desplazamiento como para que los usuarios lo noten.
Una puntuación CLS baja es superior a 0,25 y significa que los elementos de tu página se mueven mucho. Los usuarios podían ver grandes saltos, como texto o botones que se movían inesperadamente. Lo que perturba su experiencia.
Otras lecturas: ¿Qué es el CLS? Cómo (y por qué) medirlo
Interacción con la siguiente pintura (INP)
INP es la nueva métrica de Core Web Vitals que sustituyó al Retraso en la Primera Entrada (FID) el 12 de marzo de 2024. Transmite la rapidez con la que una página responde a las interacciones y se mide en milisegundos.
Vale la pena señalar que la INP evalúa la rapidez de respuesta de una página web durante todo el tiempo que el usuario interactúa con ella.
FID sólo midió el tiempo de respuesta de la primera interacción del usuario con cualquier elemento del sitio.
Así, si un usuario estaba en una página y hacía zoom en un mapa, pulsaba un botón y también abría un acordeón, INP considera el tiempo transcurrido desde el inicio hasta que aparece el cambio visual para todas esas interacciones. Y se basa en la que tarda más en darte una imagen más precisa de la capacidad de respuesta general de tu página.
Un buen INP es de 200 milisegundos o menos.
Un INP de entre 200 y 500 milisegundos significa que la interactividad de tu sitio necesita mejorar.
Un INP de más de 500 milisegundos refleja una mala experiencia interactiva para tus usuarios. Esto significa retrasos y demoras notables en la respuesta a las acciones del usuario.
Cómo Comprobar el Rendimiento de las Vitales Web Básicas de tu Sitio
A continuación te explicamos cómo puedes realizar una prueba de Core Web Vitals con cuatro herramientas diferentes:
1. Auditoría del sitio Semrush
La herramienta Semrush Site Audit realiza una comprobación técnica completa de tu sitio y destaca los problemas que podrían afectar a su salud.
Para medir el rendimiento de tu Core Web Vitals, abre Auditoría del sitio, introduce tu dominio en la barra de búsqueda y haz clic en "Iniciar auditoría".
A continuación, se te pedirá que personalices la configuración de la auditoría.
Por ejemplo, haz clic en la sección "Configuración del rastreador" para elegir si la herramienta debe analizar la versión móvil o de escritorio de tu sitio.
Cuando hayas terminado, haz clic en "Iniciar auditoría del sitio".
Una vez que tu auditoría esté lista, verás un informe "Resumen" como éste.
En "Informes temáticos", encontrarás la sección "Core Web Vitals". Haz clic en "Ver detalles" para una revisión completa.
Verás el estado de tus páginas junto con datos sobre tu rendimiento histórico.
Desplázate hasta la sección "Métricas" para ver tus puntuaciones en LCP y CLS, junto con una lista de recomendaciones sobre cómo mejorarlas.
También verás una métrica llamada Tiempo Total de Bloqueo (TBT). Que puede utilizarse para evaluar la INP.
Haz clic en un problema bajo una de las columnas "Principales mejoras" para saber más sobre cómo abordarlo. Y selecciona el número bajo la columna correspondiente a "Páginas afectadas" para ver una lista completa de las páginas con el problema.
2. Informe sobre la experiencia del usuario de Chrome
El Informe sobre la experiencia del usuario de Chrome (CrUX) es un conjunto de datos públicos que te ofrece información sobre cómo interactúan los usuarios reales de Chrome con los sitios web.
Una de las formas más sencillas de acceder a CrUX es a través del Panel CrUX para Looker Studio.
Una vez que hayas abierto la herramienta, introduce la URL del sitio que quieres analizar en la barra de búsqueda. Después, haz clic en "AÑADIR".
Verás tus resultados para las Vitales Web Básicas. Pero también puedes examinar otros datos si lo deseas.
En el panel de control, verás un resumen del rendimiento de tus páginas para cada Core Web Vital. Tanto para usuarios de móvil como de ordenador.
Veamos el resumen de LCP como ejemplo.
Puedes ver que el 85,51% de las experiencias de escritorio se consideraron buenas. Y que el 63,1% de las experiencias móviles fueron buenas.
Para un análisis más granular, selecciona los informes individuales de la métrica que quieras revisar en el menú de la izquierda.
Por ejemplo, echemos un vistazo al informe "Mayor pintura de contenido".
Aquí verás un desglose detallado del LCP de tu sitio por meses.
Esto te ayuda a comprender cómo ha cambiado la métrica a lo largo del tiempo. Así podrás señalar periodos concretos de mejora o declive.
Ten en cuenta que estos datos representan tu rendimiento en todos los dispositivos. Puedes elegir ver tus puntuaciones sólo para móvil o para ordenador de sobremesa haciendo clic en el filtro "Dispositivo" de la esquina superior derecha y seleccionando tu tipo de dispositivo.
3. Google PageSpeed Insights
Google PageSpeed Insights (PSI) es una herramienta gratuita que evalúa el rendimiento de una sola página web tanto para dispositivos móviles como de escritorio.
También ofrece ideas sobre cómo hacer que tu página sea más rápida y fácil de usar.
Para medir el rendimiento de Core Web Vitals de una página, abre PageSpeed Insights, introduce la URL que quieras comprobar y haz clic en "Analizar".
Una vez que tu informe esté listo, verás un desglose detallado de tu rendimiento en una serie de métricas.
Hay una puntuación de "Rendimiento" que va de 0 a 100 y se basa en estas métricas:
- Primera Pintura de Contenido (FCP
- Índice de velocidad
- Pintura de mayor contenido (LCP
- Tiempo total de bloqueo
- Desplazamiento de disposición acumulativo (CLS
Tus resultados de Core Web Vitals tendrán este aspecto:
Desplázate hasta la sección "Diagnóstico" para ver listas de cosas que puedes hacer para mejorar el rendimiento de tu sitio.
PSI también proporciona información sobre la accesibilidad de tu sitio, el rendimiento SEO y el cumplimiento de las mejores prácticas. Desplázate hacia abajo para ver los resultados.
4. Informe Core Web Vitals en Google Search Console
El informe "Core Web Vitals" de Google Search Console (GSC) utiliza datos del mundo real para ofrecerte una imagen precisa de cómo los usuarios experimentan tu sitio.
Y GSC agrupa las páginas de tu sitio con problemas similares, lo que facilita la identificación y resolución de problemas comunes en todo tu sitio.
Para utilizar este informe, inicia sesión en GSC y selecciona "Core Web Vitals" en el menú.
Aquí verás un resumen de alto nivel de cuántas URL considera Google "Deficiente", "Necesita mejorar" y "Buena".
El informe está disponible tanto para móvil como para ordenador.
Para obtener un desglose más detallado del rendimiento de tu sitio, haz clic en "Abrir informe" en cualquiera de los gráficos.
Tras abrir el informe, verás un gráfico de barras que muestra cuántas de tus páginas no cumplen los umbrales de Core Web Vitals.
Para ver qué problemas existen y cuántas páginas se ven afectadas en cada caso, desplázate hasta el panel "Por qué las URL no se consideran buenas".
Haz clic en un tema para obtener más detalles.
Ten en cuenta que el informe Core Web Vitals no está diseñado para ayudarte a averiguar el estado de una página concreta. En cambio, te permite medir la salud de tu sitio en su conjunto.
Cómo mejorar el rendimiento de tu Core Web Vitals
Mejorar tus puntuaciones en Core Web Vitals no tiene por qué ser desalentador.
Vamos a repasar algunos pasos que puedes dar por tu cuenta o con la ayuda de un desarrollador.
Mejorar LCP
Impulsar tu LCP puede hacerse introduciendo pequeños y grandes cambios.
Una de las más sencillas es optimizar tus imágenes comprimiéndolas y utilizando formatos de imagen aptos para la web, como WebP, que son hasta un 34% más pequeños que los formatos tradicionales.
También puedes activar el almacenamiento en caché de las páginas. Que permite almacenar la página en el servidor después de cargarla la primera vez. Así se recuperará más rápido en el futuro.
Otra forma de mejorar tu puntuación LCP es actualizar tu alojamiento web.
El alojamiento compartido (cuando varios sitios se alojan en el mismo servidor) puede ser más lento porque todos comparten recursos como la memoria y la potencia de procesamiento. Por tanto, tu sitio puede ralentizarse cuando esos otros sitios experimenten picos de tráfico.
Para solucionarlo, puedes cambiar a un plan de alojamiento mejor o a otro tipo de alojamiento. Como el alojamiento dedicado (cuando tu sitio tiene su propio servidor) o el alojamiento en la nube (cuando se utilizan varios servidores para ofrecer un rendimiento más fiable).
Mejorar el CLS
Los problemas con CLS suelen producirse cuando elementos como imágenes, banners o anuncios sin dimensiones empujan otros contenidos hacia abajo o hacia un lado mientras se cargan.
Una de las formas más sencillas de mejorar tu puntuación CLS es añadir atributos de tamaño de anchura y altura a las imágenes y vídeos.
De esta forma, el navegador reserva el espacio para cosas como imágenes o vídeos mientras se carga la página. Para que todo encaje perfectamente y no se mueva mientras la gente ve el sitio.
Como alternativa, puedes utilizar cuadros de relación de aspecto en tu código CSS. Esta opción de diseño adaptativo funciona creando un contenedor para tu contenido que mantiene la misma relación entre anchura y altura en todas las pantallas.
El tipo de fuente que utilices también puede influir en tu puntuación CLS.
Es mejor evitar el uso de fuentes web, ya que deben descargarse antes de que el navegador pueda mostrarlas. Y quédate con las fuentes del sistema que existen en la mayoría de los dispositivos, como Arial, Helvetica y Verdana.
Si utilizas fuentes web con fines de marca o diseño, limita cuántas utilizas y el número de lugares donde aparecen.
Por ejemplo, podrías elegir sólo una fuente web para utilizarla en los encabezamientos y secciones especiales.
Mejorar el INP
Uno de los principales factores que pueden perjudicar tu Interacción con Next Paint es si tu sitio tiene muchos scripts grandes o demasiado código JavaScript en ejecución.
JavaScript es un lenguaje de programación que se utiliza para crear funciones dinámicas de sitios web como
menús, formularios y animaciones. Pero un código JavaScript extenso o complejo puede ralentizar la rapidez con que tu sitio web responde a las acciones del usuario.
Tu desarrollador puede mejorar tu INP minimizando JavaScript y otro código no esencial.
También es una buena idea separar las tareas largas que el navegador realiza entre bastidores y que estorban la interacción con el usuario.
Al dividir estas tareas en segmentos más cortos (lo que tu desarrollador puede hacer mediante tácticas como aplazar la ejecución del código), el navegador puede gestionar las interacciones del usuario con mayor rapidez.
Puedes identificar las tareas largas de una página utilizando la herramienta Auditoría del Sitio.
En tu informe "Core Web Vitals", desplázate hasta "Páginas analizadas". Y haz clic en el signo desplegable situado junto a una URL con una puntuación TBT baja.
Desplázate hasta la sección TBT del informe para ver una lista de las tareas más largas que están obstaculizando tu rendimiento en esa página concreta.
También puedes obtener información sobre correcciones concretas que puedes aplicar haciendo clic en el botón "Cómo mejorar".
Pasa esta información a tu desarrollador para que pueda empezar a mejorar el rendimiento de tu INP.
Otras lecturas: Los problemas más comunes de Core Web Vitals y cómo superarlos
Consejos para priorizar las correcciones de Core Web Vitals
La clave para abordar con éxito cualquier problema de Core Web Vitals es priorizarlo. Así podrás mejorar gradualmente el rendimiento de tu sitio sin agobiarte.
Aquí tienes algunas sugerencias que puedes utilizar para determinar tus próximos pasos:
- Considera la facilidad de aplicación: A veces, un problema puede ser más rápido de solucionar que otro. Por ejemplo, optimizar las imágenes para mejorar el LCP puede ser más sencillo que ajustar disposiciones complejas para mejorar el CLS.
- Recuerda el propósito de tu sitio web: Si tienes un sitio con mucho contenido, como un blog o una publicación de noticias, mejorar primero el LCP puede ser más impactante porque tus usuarios van a valorar más el contenido de carga rápida. Pero si tienes un sitio de comercio electrónico que depende en gran medida de la interacción del usuario, entonces priorizar el CLS probablemente tenga más sentido.
- Observa los datos: Si algunas páginas son significativamente peores que las demás, quizá quieras empezar por ellas. Puedes utilizar la Auditoría del Sitio como ayuda. En el informe "Core Web Vitals", desplázate hasta la sección "Páginas analizadas" para ver una lista de URL con estados "Deficiente" y "A mejorar".
Mejora la experiencia de usuario de tu sitio web
El rendimiento de Core Web Vitals de tu sitio desempeña un papel importante en cómo los usuarios experimentan tu sitio.
Unas buenas puntuaciones pueden contribuir a reducir las tasas de rebote, mejorar el compromiso e incluso aumentar las conversiones. Por no hablar de una mejor clasificación en las búsquedas.
Y hay herramientas disponibles para guiarte en la dirección correcta.
Como Auditoría del Sitio. Que proporciona información sobre mucho más que tus métricas de Core Web Vitals.