Core Web Vitals: ¿por qué son tan im­po­r­ta­n­tes las métricas de Google?

El motor de búsqueda más famoso del mundo intenta mejorar co­n­s­ta­n­te­me­n­te sus re­su­l­ta­dos, entre otras cosas, con ac­tua­li­za­cio­nes de Google. La in­fo­r­ma­ción que se ofrece a los usuarios debe obtenerse de forma rápida y generar una ex­pe­rie­n­cia positiva. Por eso, Google re­co­m­pe­n­sa a los ad­mi­ni­s­tra­do­res y creadores de contenido que optimizan sus páginas. Una de las medidas de Google para mejorar el contenido es Web Vitals: métricas estándar que permiten descubrir si la calidad técnica de un sitio es buena. Si tienes una página web y no quieres perderte entre las SERP, los Core Web Vitals deben formar parte de tu es­tra­te­gia SEO.

Ya puedes ver los Core Web Vitals de tu página web y op­ti­mi­zar­los. A partir de agosto de 2021 se dará mucha im­po­r­ta­n­cia a estas métricas. Google ha anunciado una ac­tua­li­za­ción llamada Page Ex­pe­rie­n­ce Update, de la que Core Web Vitals será una parte im­po­r­ta­n­te, que se lanzará a partir de mediados de junio. El impacto de la ac­tua­li­za­ción podrá empezar a verse pasados dos meses. Descubre qué puedes hacer para estar preparado.

Con los Core Web Vitals, Google introduce métricas que pro­po­r­cio­nan a los ad­mi­ni­s­tra­do­res de las páginas web in­fo­r­ma­ción sobre la calidad de las mismas. Este análisis no se enfoca en el contenido, sino que sirve para medir aspectos técnicos que pueden afectar a la ex­pe­rie­n­cia del usuario. Más co­n­cre­ta­me­n­te, las métricas ponen el foco en los primeros segundos de la ex­pe­rie­n­cia de los vi­si­ta­n­tes. Para ello, Google ha es­ta­ble­ci­do tres valores:

• Largest Co­n­te­n­t­ful Paint (LCP): ¿cuánto tarda en cargarse el elemento de mayor peso de la página?
• First Input Delay (FID): ¿cuándo pueden los usuarios empezar a in­ter­ac­tuar con la página?
• Cu­mu­la­ti­ve Layout Shift (CLS): ¿cuánto se desplaza el diseño durante la carga?

Google registra la ex­pe­rie­n­cia de los vi­si­ta­n­tes de una página web con los Core Web Vitals. Para medirlos, Google evalúa los datos del navegador Chrome y crea un informe de ex­pe­rie­n­cia de usuario. Los datos de di­s­po­si­ti­vos móviles y los de or­de­na­do­res se evalúan por separado. En el informe se muestra una pu­n­tua­ción agregada (es decir, un valor resumido) que incluye el 75 % de las visitas a la página. Esto es im­po­r­ta­n­te, ya que cada usuario puede tener una ex­pe­rie­n­cia diferente y, con toda pro­ba­bi­li­dad, quieras que el diseño de tu página web permita que la ex­pe­rie­n­cia de todos los usuarios sea positiva.

Hasta ahora, Google ha pre­se­n­ta­do tres métricas di­fe­re­n­tes, aunque puede ser que se añadan más en el futuro. Los Core Web Vitals, tal y como hemos explicado, hacen re­fe­re­n­cia a la in­ter­ac­ti­vi­dad en la página web.

Los si­guie­n­tes consejos te pueden ayudar a mejorar el valor LPC:

• Utiliza un framework en lugar de una página HTML de gran tamaño. Así podrás controlar mejor la re­pro­du­c­ción de los elementos.
• Utiliza una Content Delivery Network para que la ubicación del usuario no afecte al acceso del servidor.
• Ten cuidado con CSS y Ja­va­S­cri­pt para no so­bre­ca­r­gar el navegador.
• Reduce el tamaño de las imágenes para que los archivos pesen menos y el tiempo de carga se reduzca.
• En el caso de las páginas web estáticas, puedes utilizar los cachés del servidor para permitir tiempos de acceso más rápidos.
• Establece la conexión con fuentes externas con an­te­la­ción para evitar cuellos de botella.

Si quieres mejorar el First Input Delay y dar a tus vi­si­ta­n­tes una mejor ex­pe­rie­n­cia en tu página, considera las si­guie­n­tes formas de op­ti­mi­za­ción:

• Intenta dividir las tareas de gran tamaño en partes pequeñas. Mientras se esté eje­cu­ta­n­do un Ja­va­S­cri­pt, el navegador no puede procesar ningún otro trabajo. Google considera los tiempos de pro­ce­sa­mie­n­to de más de 50 mi­li­se­gu­n­dos como long tasks, por lo que es re­co­me­n­da­ble evitarlos.
• Carga primero los elementos de in­ter­ac­ción más im­po­r­ta­n­tes. De esta manera, los usuarios podrán in­ter­ac­tuar más rápido y no tendrás que esperar más tiempo de carga.
• Utiliza un Web Worker. Estos procesos permiten ejecutar tareas más complejas en un segundo plano.

Las si­guie­n­tes opciones pueden ayudarte:

• Es­pe­ci­fi­ca siempre las di­me­n­sio­nes de las imágenes in­co­r­po­ra­das en el texto fuente de la página web. De esta manera, el navegador podrá reservar el espacio co­rre­s­po­n­die­n­te para el diseño.
• Los anuncios pu­bli­ci­ta­rios dinámicos externos también afectan al diseño. Es re­co­me­n­da­ble es­ta­ble­cer un marcador de posición su­fi­cie­n­te­me­n­te grande de forma estática para los anuncios, de manera que los elementos no se muevan.
• Si se intentan cargar fuentes desde la web, el diseño puede de­s­pla­zar­se de forma im­pre­vi­s­ta. Se re­co­mie­n­da precargar las fuentes (preload).

Google intenta formar parte del diseño de las páginas web. Para ello aprovecha su poder de mercado: mucha menos gente llega a las páginas web que no aparecen en las primeras páginas del motor de búsqueda. Por ello, los we­b­ma­s­te­rs y los expertos en SEO se esfuerzan por preparar un contenido positivo para Google. Sin embargo, no se conocen ofi­cia­l­me­n­te todos los factores que influyen en el ranking de Google. Aun así, con los Core Web Vitals, Google ha pre­se­n­ta­do valores concretos que los de­sa­rro­lla­do­res web pueden poner en práctica.

Puedes ver los valores Core Web Vital de tu página web, por ejemplo, a través de la Google Search Console, que ofrece análisis in­de­pe­n­die­n­tes tanto de di­s­po­si­ti­vos móviles como de or­de­na­do­res. Es im­po­r­ta­n­te saber que, dado que los valores Core Web Vitals se derivan de los datos reales de los usuarios, es posible que tengas que esperar a que Google reúna su­fi­cie­n­te in­fo­r­ma­ción para realizar un análisis si­g­ni­fi­ca­ti­vo. Estas métricas también se muestran en otras he­rra­mie­n­tas de Google, como Google Li­gh­thou­se, Page Speed Insights y el informe de ex­pe­rie­n­cia de usuario de Chrome.