Core Web Vitals era una forma que tenía Google de medir la carga de una página web y la experiencia del usuario, mide el tiempo de carga a través de ciertas métricas claves.
Pero desde el famoso anuncio de Google, se supo que a partir de mayo de 2021 las métricas que componen el Core Web Vitals serán más que simples métricas, ahora formarán parte de los factores de ranking de este motor de búsqueda.
Esto implica que además de tus esfuerzos SEO en toda tu estrategia, debes tomar en cuenta un WPO que priorice el Core Web Vitals para un buen posicionamiento web.
Aún estás a tiempo de mejorar y Los Creativos te llevará de la mano en todo lo que debes saber para preparar tu web de la mejor manera posible.
¿Qué es el Core Web Vitals?
El Core Web Vitals o “Métricas Vitales de Web”, tal como indica el nombre, son una serie de métricas (3 específicamente) que miden la experiencia de usuario en cuanto a la velocidad en la cual este encuentra la información que ha buscado y es la base actual de cualquier desarrollo web.
Estas métricas van dirigidas a medir las principales características que hacen que una web esté completamente funcional (aunque no esté completamente cargada).
Aunque estas mediciones apuntan a impulsar la rapidez de carga web y la experiencia de usuario, no son las únicas iniciativas que ha tomado Google en este aspecto.
Con ello te queremos decir que Core Web Vitals no es la única herramienta que se integra a todas estas métricas, ya que ellas pasan a juntarse con:
- Pagespeed Insights.
- Mobile-Friendly test.
- Lighthouse.
- El formato AMP.
- Chrome UX Report.
- Web.dev
Aunque no son todas las herramientas, son las más importantes que debes tomar en cuenta cuando quieras optimizar tu experiencia de usuario para mejorar tu posicionamiento web.
Elementos del Core Web Vitals, la trinidad del UX
El trabajo de posicionamiento de un sitio web va dirigido a la experiencia del usuario y su intención de búsqueda, algo que debemos brindar al menor tiempo posible para mantener al usuario dentro de la web.
Para saber esto, trabajamos con 3 métricas base, que acorde los estudios de Google son los que inciden directamente en la carga web y experiencia del usuario por igual.
En líneas generales, tenemos que el Core Web Vitals se compone de:
Aunque todas las métricas suman al ranking de posicionamiento de una página, las tres primeras son las que forman parte del Core Web Vitals.
Cada una de estas métricas va de la siguiente manera:
-
LCP (Largest Contentful Paint)
El LCP (Largest Contentful Paint) o la Carga del “Contenido más grande”, es el tiempo que se tarda en cargar el above the fold (todo lo que vemos sin necesidad de bajar en la página).
Normalmente, este contenido es de tipo imágenes o bloque de texto. Lo ideal es que este tiempo de carga lo mantengas óptimo, así debe verse:
Como puedes ver en la imagen, Google te indica que la carga del contenido más grande debe estar por debajo de los 2,5 segundos para considerarse completamente optimizado.
Esto lo anuncia con las siguientes mediciones:
- Nivel óptimo: Toda carga que esté por debajo de los 2,5 segundos.
- Necesita mejorar: todo valor entre los 2,5 y los 4 segundos.
- Sin optimización: Todo valor que esté por encima de los 4 segundos.
Los problemas que se relacionan con el LCP, comúnmente son:
- Respuesta del servidor lenta.
- Carga de recursos (como imágenes, vídeos, texto grande)
- Procesos de CSS y Java bloqueados.
Este elemento del Core Web Vitals es un poco complicado de optimizar pero es de los más esenciales para ello.
-
FID (First Input Delay)
El FID (First Input Delay) o el “Retraso en la primera entrada”, es una métrica que indica el tiempo de respuesta que hay entre la primera interacción del usuario y la web.
En otras palabras, el FID nos ayuda a ver cuánto tarda la página web en responder a la interacción que tenga el usuario con ella.
Por ejemplo, el FID mide lo que tarda una web en responder cuando haces un clic en un menú o link, cuando quieres ampliar una imagen o en caso de que quieras llenar un formulario.
De cara a Google, la interacción se mide en milisegundos, tal como vemos aquí:
En este caso vemos que nuestros valores se traducen en:
- Nivel óptimo: Toda carga que esté por debajo de los 100 milisegundos o el equivalente en 0,1 segundos.
- Necesita mejorar: todo valor entre los 100 milisegundos y los 300 milisegundos, lo que es equivalente a 0,1 y 0,3 segundos.
- Sin optimización: Todo valor que esté por encima de los 300 milisegundos o lo que es lo mismo, 0,3 segundos.
Los problemas que se relacionan con el FID, comúnmente son:
- Peso de JavaScript considerablemente altos.
- Long task bloqueadas.
- Interfaz mal configurada o sin optimización.
- No procurar scripts en segundo plano que no bloqueen la interfaz de página.
La solución para cada una de estos problemas también radica en un buen plan de optimización que ataque estos elementos antes de que representen un problema.
-
CLS (Cumulative Layout Shift)
El CLS (Cumulative Layout Shift) o el “Cambio de diseño acumulado”, es una métrica que cuantifica la estabilidad visual de la página web.
¿Alguna vez has querido hacer clic en una web mientras carga y el botón que quisiste tocar ya no está en en el mismo sitio? Pues esa interacción es lo que mide el CLS.
Para una vista un poco más técnica, el CLS mide la frecuencia de cambios que ocurren en el diseño y la visualización de una página web. Cada cambio suma puntos y mientras más puntos, más optimización necesita tu web.
Google nos indica que los valores de esta métrica deberían estar así:
En el caso del CLS, debes procurar hacer el menor cambio posible para no acumular puntaje en esta métrica.
Para Google, lo ideal sería que las páginas web se manejaran así:
- Nivel óptimo: menos de 0.1 de puntaje o lo que es lo mismo, con cambios casi inexistentes.
- Necesita mejorar: todo valor entre los 0.1 y 0.25 con pocos o diminutos cambios.
- Sin optimización: Todo valor que esté por encima de los 0.25 o, muchos cambios o cambios que son significativamente grandes.
Lo ideal es tener un plan de desarrollo y diseño que desde el principio merme todo cambio que pueda haber en el CLS de tu web.
Los problemas que pueden incidir en un mal CLS suelen ser:
- Pop-ups invasivos o mal configurados.
- Imágenes muy grandes.
- Animaciones que alteren el diseño de página.
- Anuncios mal configurados e invasivos.
En el caso de nuevas páginas, la planificación y optimización oportuna, son la clave a un buen Core Web Vitals,
Para las páginas que están en espera de la nueva actualización del algoritmo de Google, identificar los problemas que afectan tu web y ofrecer la mejor experiencia de usuario debe ser el horizonte.