Se conoce como Core Web Vitals al conjunto de indicadores para analizar y medir la experiencia del usuario al visitar un sitio web. Como parte de las herramientas de Google, están incorporados en varias extensiones y aplicaciones. Permitiendo una visión general del proceso de optimización y facilitando la tarea de posicionamiento.
Al igual que las necesidades de los usuarios, las tendencias en cuanto a rendimiento están en constante cambio. Así, los umbrales de aceptación pueden sufrir ligeras modificaciones, pero en suma ofrecen una guía sólida para evaluar la usabilidad de una página web.
Presentándose como elementos útiles y de fácil comprensión los Core Web Vitals son similares a los indicadores de gestión. Conocer su significado, aprender a medirlos y optimizarlos pondrá a tu web en lo más alto.
¿Qué miden los Core Web Vitals?
A nivel de usabilidad, la navegación debe cumplir con tres parámetros principales: la carga de contenido, la interacción en la página y la estabilidad visual. Aunque hay otros aspectos a considerar, estos bastarán para categorizar las diferentes entradas como buenas, pobres o con necesidad de mejoras.
Carga de Contenido (Largest Contentful Paint)
Permite conocer el tiempo requerido para cargar el contenido de mayor tamaño, este puede corresponder a una imagen o al texto más largo o importante. Se inicia el conteo desde que la página comienza a cargar, teniendo como valor aceptable hasta 2,5 segundos para que aparezca el contenido más pesado.
Cualquier registro por encima del valor aceptable indicará que la página necesita ser mejorada. Teniendo un límite de 4,0 segundos o superior para considerar que la misma tiene un rendimiento realmente pobre en cuanto a carga de contenido se refiere.
Rapidez de interactividad (First Input Delay)
Como indicador de Core Web Vitals, el First Input Delay mide, por decirlo de algún modo, el tiempo de reacción de la página. Es decir, cuánto tiempo se demora un elemento interactivo (botón, enlace, formulario, campo,…) en responder al ser activado o cliqueado.
A diferencia de la carga de contenido, se espera que este parámetro sea mucho más rápido. Teniendo un valor máximo aceptado de hasta 100 milisegundos. Es uno de los factores más importantes de la experiencia de usuario, disminuyendo la selección de múltiples elementos o la introducción de datos de forma errónea.
Estabilidad visual (Cumulative Layout Shift)
Se refiere al cambio de diseño acumulado; es decir, la manera en la que se ubican los elementos a medida que carga la página web. Mientras menor sea el cambio percibido, mucho mejor será la experiencia de navegación. Principalmente porque permite al usuario acceder al contenido de forma precisa.
Los altos índices de CLS SEO se encuentran entre los inconvenientes más frecuentes y evidentes. Pero afortunadamente son fáciles de solucionar con algunas opciones de estilo a la hora de diseñar el sitio web. Procurando siempre mantenerse por debajo del 0,1 y evitar valores que sobrepasen el 0,25 de variación.
¿Cómo medir los Core Web Vitals?
Es claro que para mejorar los Core Web Vitals primero es necesario conocer su valor inicial. De este modo, es posible tener una visión clara del rendimiento del sitio web, y tomar las acciones que hagan falta para optimizar la navegación.
Para ello, es posible utilizar algunas herramientas como:
Las anteriores son consideradas como herramientas de campo, ya que utilizan los reportes de navegación de usuarios y totalmente anónimos recopilados por Chrome User Experience Report. Posteriormente pueden ser analizados con Google Search Console o bien PageSpeed Insights para obtener las métricas deseadas.
Otra forma de medir los Core Web Vitals es incorporar las APIs estándar de la biblioteca de JavaScript (web-vital). Pudiendo seleccionar cada métrica por separado, se extrae el reporte de de la página web para luego enviar los datos necesarios al procesador de analíticas y obtener un informe detallado.
A nivel profesional, se estila utilizar herramientas especializadas para medir los Core Web Vitals antes del lanzamiento de la página. Estas utilizan entornos simulados de navegación, recibiendo el nombre de medición en laboratorio. Tienen algunas limitaciones debido a la carencia de usuarios reales, pero son efectivas y confiables en otros aspectos.
Lighthouse o DevTool son buenas alternativas para medir en laboratorio. Aunque será necesario incorporar otra herramienta como Total Blocking Time para obtener valores estimados de FID.
¿Cómo optimizar los Core Web Vitals?
Una vez obtenidas las mediciones para cada parámetro será posible determinar las acciones necesarias para optimizar cada uno de ellos. Una ventaja importante es que cada indicador puede atenderse de forma independiente. Pero se requiere determinar en cada caso, las razones que produjeron un índice fuera del rango esperado.
Optimizar Largest Contentful Paint (LCP)
La lentitud en la carga de contenido principal afecta de forma significativa la experiencia de navegación. Más ahora, cuando la percepción y el uso del tiempo es un recurso de altísimo valor para la mayoría de los negocios en línea. Sin embargo, para solucionar este problema será necesario saber el origen del mismo.
Un LCP deficiente puede ser causado por:
- Largos tiempos de respuesta del servidor: en este caso debe monitorear los procesos que se realizan, preferir las opciones de enrutamiento de usuarios a CDN cercanas. También será recomendable aprovechar los activos de caché para servir las páginas HTML con mayor velocidad, e incluso usar las funciones de conexiones anticipadas.
- Bloqueos por renderizado de CSS y JavaScript: su ejecución puede generar bloqueos en la carga de contenido y afectar el LCP. Se recomienda entonces diferir aquellos scripts u hojas de estilo no críticos para optimizar la carga de contenido.
Optimizar First Input Delay (FIP)
La capacidad de respuesta e interactividad que ofrece una página con un FID optimizado, da al usuario una percepción ideal de su funcionamiento. Una respuesta lenta, por lo general está asociada a procesos de JavaScript que absorben la mayor cantidad de recursos. Por lo tanto, será necesario enfocarse en aligerarlos.
Entre las opciones para optimizar el First Input Delay está la posibilidad de evitar largos procesos de JavaScript. Sustituyéndolos por tareas más sencillas y que se ejecuten de forma asíncrona. Disminuir las solicitudes de recursos en línea o scripts de terceros y disponer de recursos precargados.
Optimizar Cumulative Layout Shift (CLS)
Este aspecto está entre los más necesarios entre los Core Web Vitals. Los índices adecuados de CLS dejan claro que la página web ha sido correctamente planificada y diseñada para brindar una grata experiencia al usuario. Por lo tanto, su optimización está enfocada en crear áreas de diseño para objetos.
Esto quiere decir que para optimizar el CLS será necesario evitar imágenes, anuncios y otros objetos sin especificar sus dimensiones. Al asignarle un tamaño específico, el navegador reserva el espacio para ese elemento sin necesidad de desplazamientos inesperados. Al mismo tiempo, es recomendable precargar las fuentes personalizadas para evitar cambios.
¿Por qué es importante optimizar los Core Web Vitals?
Google considerará una página optimizada o con rendimiento aceptable aquella que cumpla con los parámetros de Core Web Vitals en el 75% de las cargas realizadas. Teniendo en cuenta la navegación tanto en dispositivos móviles como en computadores. En caso contrario, serán candidatas a un proceso de optimización o mejora.
Alcanzar estos umbrales de éxito permite que la página web sea considerada por motores de búsqueda, y por lo tanto posicionada dentro de las primeras opciones presentadas. Como iniciativa de Google, al optimizar los Core Web Vitals se busca establecer un estándar de rendimiento en cuanto a experiencia de navegación.
Teniendo a disposición millones de páginas de web, es necesario que una vez captada la atención del usuario, se eviten interrupciones o demoras que lo inciten a abandonar la navegación. Los tiempos de carga, respuesta y estabilidad marcan una notoria diferencia en cuanto a permanencia en línea.
Conocer y respetar los parámetros estándar en cuanto a usabilidad y navegación web, asegura un mejor posicionamiento. Además de incidir en el número de visitas y conversiones que se pueden alcanzar en un sitio web. Aunque siempre será necesario revisar las actualizaciones y las tendencias que irán surgiendo con el uso.
La posibilidad de monitorear estos parámetros de rendimiento marca un hito en cuanto al uso de los recursos de navegación. Conduciendo a los desarrolladores a pensar en una experiencia positiva e interactiva. Así, los Core Web Vitals se perfilan como los estándares del futuro para SEO y UX.
En resumen, desde Dumio sabemos gracias a nuestro día a día con nuestros clientes que el usuario quiere resolver esa intención de búsqueda de una manera inmediata por eso tener los core vitals optimizados según marca el algoritmo de Google será fundamental para aparecer mejor posicionado.
Para más información, contáctanos:
[email protected]
