Los grandes matemáticos griegos, como Pitágoras, Arquímedes o Euclides, conocían perfectamente el valor de las mediciones. Y es que la medición nos permite comprender, lo que a su vez nos posibilita optimizar. En marketing digital estas verdades son muy evidentes. Gracias a las métricas, los especialistas podemos darle nuevos impulsos a las estrategias de posicionamiento. Entre todas esas métricas, existen unas específicas de enorme importancia llamadas core web vitals. ¿Pero qué son las core web vitals exactamente?
Definición y origen de las Core Web Vitals
Las Core Web Vitals son una serie de métricas específicas que Google ha identificado y resaltado como esenciales para proporcionar una excelente experiencia de usuario en la web. Forman parte de la iniciativa Web Vitals de Google, un proyecto que busca proporcionar pautas unificadas para la calidad de la experiencia del usuario en la web.
El término «Core Web Vitals» fue introducido por primera vez por Google en mayo de 2020. El objetivo era simplificar el panorama de las métricas de rendimiento web, proporcionando una lista clara y reducida de métricas que son esenciales para todos los sitios web y deben ser monitorizadas por todos los propietarios de sitios web.
Las Core Web Vitals se centran en tres aspectos clave de la experiencia del usuario: la carga, la interactividad y la estabilidad visual. Estos tres aspectos están representados por tres métricas respectivamente: Largest Contentful Paint (LCP), First Input Delay (FID) y Cumulative Layout Shift (CLS).
Estas métricas complementan las ya existentes, como el First Contentful Paint (FCP) y el Time to Interactive (TTI), pero están diseñadas para ser más fáciles de entender y aplicar. Google espera que, al centrarse en estas métricas, los propietarios de sitios web puedan mejorar la calidad general de la experiencia del usuario en sus páginas.
Cabe destacar que las Core Web Vitals no son una lista estática. Google ha indicado que la lista de métricas se revisará y actualizará anualmente para reflejar las cambiantes expectativas de los usuarios y las nuevas capacidades de la web.
Los Tres Pilares de las Core Web Vitals
Las Core Web Vitals se componen de tres métricas específicas: Largest Contentful Paint (LCP), First Input Delay (FID) y Cumulative Layout Shift (CLS). Cada una de estas métricas representa un aspecto único y crítico de la experiencia del usuario en la web.
Largest Contentful Paint (LCP)
El LCP mide el tiempo que tarda en cargarse el mayor elemento de contenido visible desde el punto de vista del usuario. Esta métrica es importante porque indica cuánto tiempo tiene que esperar un usuario para ver el contenido principal de la página. Según Google, un buen LCP se encuentra dentro de los 2.5 segundos desde que la página comienza a cargarse.
Para mejorar el LCP, puedes optimizar el tiempo de respuesta del servidor, el tiempo que tarda tu página en renderizar el primer pixel; utilizar una Red de Distribución de Contenidos (CDN); optimizar las imágenes y eliminar cualquier bloqueo de renderizado de JavaScript y CSS.
First Input Delay (FID)
El FID mide el tiempo que tarda la página en responder después de que un usuario interactúa con ella por primera vez, como hacer clic en un enlace o pulsar un botón. Google considera que un buen FID es menos de 100 milisegundos.
La forma más efectiva de mejorar el FID es minimizar (o posponer) el JavaScript. También es útil dividir el código y utilizar solo lo necesario, y eliminar cualquier JavaScript no esencial de tu página.
Cumulative Layout Shift (CLS)
El CLS mide cuánto se mueve una página inesperadamente durante la carga. Las cargas inesperadas pueden ser frustrantes para los usuarios, por ejemplo, si están leyendo y el texto se mueve, o si intentan hacer clic en un botón y su posición cambia.
Según Google, un buen CLS es menos de 0.1. Para mejorar tu CLS, debes asegurarte de asignar siempre dimensiones a tus imágenes y vídeos, evitar la inserción de contenido por encima del contenido existente, a menos que sea en respuesta a una interacción del usuario, y preferir transformaciones de CSS a cambios de propiedad que desencadenen el reflujo de la página.
La Importancia de las Core Web Vitals
Las Core Web Vitals son fundamentales por varias razones, pero destacan principalmente por su papel en la experiencia del usuario y su impacto en el SEO.
Su papel en el SEO
Desde el anuncio de Google en mayo de 2020, las Core Web Vitals se convirtieron en un factor de clasificación para el motor de búsqueda. Es decir, la forma en que tu sitio web se desempeña en LCP, FID y CLS puede influir en dónde aparece tu sitio en los resultados de búsqueda de Google.
A partir de 2021, Google comenzó a utilizar las Core Web Vitals como parte de su «page experience signal», que incluye otras consideraciones de experiencia del usuario, como la navegación segura, la compatibilidad con dispositivos móviles, y la presencia de HTTPS.
En resumen, un mejor rendimiento en las Core Web Vitals puede resultar en una mayor visibilidad en los resultados de búsqueda de Google, lo que a su vez puede llevar a más tráfico a tu sitio.
La influencia de las Core Web Vitals en la experiencia del usuario
Las Core Web Vitals también son importantes debido a su impacto directo en la experiencia del usuario. Cada una de las métricas – LCP, FID, CLS – refleja una parte de la experiencia del usuario con tu página web.
Un LCP rápido significa que los usuarios pueden ver y consumir el contenido principal de tu página rápidamente. Un FID bajo significa que tu página es interactiva y responde rápidamente a las entradas del usuario. Y un CLS bajo significa que los elementos de tu página no saltan alrededor durante la carga, lo que puede ser frustrante y desorientador para los usuarios.
Mejorar estos aspectos de la experiencia del usuario puede resultar en un aumento en las conversiones, la retención del usuario y, en última instancia, el éxito de tu sitio web.
Herramientas para Medir las Core Web Vitals
Afortunadamente, hay varias herramientas disponibles que puedes utilizar para medir y monitorear las Core Web Vitals. Algunas de las más populares y efectivas:
Google Search Console
Google Search Console es una herramienta gratuita de Google que ayuda a los propietarios de sitios web a monitorear y resolver problemas en su sitio web. En 2020, Google añadió un nuevo informe de «Core Web Vitals» a la Search Console que muestra cómo se desempeña tu sitio web en términos de LCP, FID y CLS.
PageSpeed Insights
PageSpeed Insights es otra herramienta gratuita de Google que proporciona información sobre el rendimiento de tu página en computadoras de escritorio y dispositivos móviles. Esta herramienta utiliza datos tanto del laboratorio como de campo, y proporciona sugerencias detalladas sobre cómo mejorar tu rendimiento en las Core Web Vitals.
Lighthouse
Lighthouse es una herramienta automatizada para mejorar la calidad de las páginas web. Proporciona una serie de auditorías, incluyendo las Core Web Vitals. Puedes ejecutar Lighthouse en Chrome DevTools, desde la línea de comandos, o como un módulo de Node.
Chrome UX Report (CrUX)
El Chrome UX Report es un conjunto de datos públicos de Google que proporciona experiencias de usuario con sitios web de origen público. Incluye medidas de distribución de las Core Web Vitals, lo que permite a los desarrolladores y propietarios de sitios web comprender rápidamente cómo se desempeña su sitio web con los usuarios reales.
Web Vitals JavaScript Library
La librería Web Vitals JavaScript de Google te permite medir las Core Web Vitals en tu propio sitio web. Puedes utilizarla para recopilar y analizar datos de rendimiento de tus usuarios.
Consejos para Mejorar las Core Web Vitals
La optimización de las Core Web Vitals puede ser un proceso complejo que requiere un conocimiento técnico profundo. Algunos consejos generales que pueden ayudarte a empezar:
-
Optimiza tus imágenes: Las imágenes a menudo son el mayor contenido visible en una página, por lo que optimizarlas puede mejorar significativamente tu LCP. Esto puede incluir cosas como comprimir imágenes, utilizar formatos modernos de imagen como WebP, y cargar imágenes con técnicas de carga diferida (lazy loading).
-
Minimiza o difiere el JavaScript: El JavaScript es a menudo el mayor contribuyente al FID. Puedes mejorar tu FID minimizando o difiriendo el JavaScript, es decir, retrasando la carga y la ejecución del JavaScript hasta que sea realmente necesario.
-
Utiliza dimensiones estáticas para las imágenes y los anuncios: Un gran contribuyente al CLS son las imágenes y los anuncios sin dimensiones. Al utilizar dimensiones estáticas, el navegador sabe exactamente cuánto espacio ocupará un elemento, evitando cualquier movimiento inesperado de la página.
-
Prioriza la carga de los elementos más importantes: Algunos elementos de la página son más importantes para los usuarios que otros. Al priorizar la carga de estos elementos (por ejemplo, el contenido principal sobre las imágenes de fondo), puedes mejorar tu LCP.
-
Limita el uso de fuentes web personalizadas: Las fuentes web personalizadas suelen ser grandes y pueden bloquear la renderización de la página, lo que afecta a tu LCP. Si usas fuentes web personalizadas, asegúrate de utilizarlas de forma óptima.
-
Evita las animaciones grandes: Las animaciones grandes pueden causar CLS, especialmente si se insertan después de que la página haya comenzado a renderizarse. Si debes usar animaciones, asegúrate de que no causen movimientos inesperados en tu página.
En resumen, las Core Web Vitals son métricas fundamentales que reflejan la calidad de la experiencia del usuario en tu sitio web. Optimizar tu sitio en función de estas métricas puede mejorar significativamente la experiencia del usuario y, a su vez, potenciar tu SEO.
El rendimiento en la web es un viaje, no un destino. Siempre habrá nuevas técnicas para aprender, nuevas métricas para seguir, y nuevas formas de mejorar. Así que sigue aprendiendo, sigue experimentando y sigue trabajando para hacer de la web un lugar mejor para todos.
Y recuerda, la web está siempre en constante evolución, y nosotros, como desarrolladores, diseñadores, y creadores de contenido, debemos continuar aprendiendo y adaptándonos. ¡Juntos, podemos hacer de la web un lugar mejor para todos!
¡Gracias por leer y hasta la próxima!
