fbpx

¿Qué son las core web vitals?

cabecera-que-son-core-web-vitals

El pasado 11 de noviembre de 2020, Google anunció que un nuevo factor de clasificación, la experiencia de usuario, se pondría en marcha en mayo de 2021. La experiencia del usuario siempre ha sido una parte esencial a la hora de diseñar una web, pero ahora, jugará cada vez un papel más importante.

En general, las métricas de la velocidad suelen ser difíciles y confusas además de inestables. No siempre se obtienen las mismas puntuaciones. Por ello, ahora, Google identificará las tres métricas vitales de tu web y en ellas se centrará para determinar la buena usabilidad de un sitio centrándose en la experiencia del usuario que lo visita.

Contenido

✅Los tres pilares de la experiencia de usuario

Por ahora, los tres pilares de la experiencia son:

*Rendimiento de carga (¿con qué rapidez aparecen los elementos en la pantalla?)

*Capacidad de respuesta (¿Cómo de rápido reacciona la página a las entradas del usuario?)

*Estabilidad visual (Cambio de disposición de los elementos de la página durante la carga)

Para medir estos aspectos esenciales de la experiencia del usuario, Google eligió tres métricas correspondientes, también conocidas como «Core Web Vitals» y son las siguientes.

➡️LCP, Largest Contentful Paint

Mide el tiempo que tarda la mayor parte del contenido en aparecer en la pantalla. Podría tratarse de una imagen o de un bloque de texto. Una buena calificación le da a los usuarios la sensación de que el sitio se carga rápido. Un sitio lento puede llevar a la frustración y por lo tanto aumentar el porcentaje de rebote.

Esta métrica mide el punto en el que el mayor elemento de contenido aparece en la pantalla. Ten en cuenta que no mide el tiempo que tarda la página en cargarse completamente, sino que simplemente mira cuando se carga la parte más importante (la parte superior de la página).

Si tienes una landing simple con un poco de texto y una imagen de slider, esa imagen grande se considerará el LCP. Dado que es el elemento más grande de contenido a cargar en el navegador, está destinado a causar una impresión. Al hacer que se cargue más rápido, tu sitio puede parecer mucho más rápido. Por ello, algunas veces, puede ser tan simple como optimizar la propia imagen.

De acuerdo con Google, deberías apuntar a que el LCP transcurra dentro de los primeros 2.5 segundos de la carga de la página. Todo lo que esté por debajo de los 4 segundos necesita ser mejorado y puedes considerar que todo lo que esté por encima es muy nocivo.

core-web-vitals

➡️FID, First Input Delay

Mide el tiempo que tarda el sitio en reaccionar a la primera interacción de un usuario. Esto podría ser un clic en un botón, por ejemplo. Cuanto más rápido reaccione el navegador, más sensible será la página. Si quieres ofrecer a tus usuarios una experiencia positiva, entonces deberías trabajar en la capacidad de respuesta de tus páginas.

Los retrasos se producen cuando el navegador sigue haciendo otro trabajo en segundo plano y por ejemplo ha cargado una página pero al hacer clic en un botón de la misma éste no responde.

Un navegador, a veces, necesita aparcar ciertas peticiones y volver más tarde a ellas ya que no puede hacerlo todo a la vez. Además, a medida que construimos sitios cada vez más complejos y a menudo con Javascript se dificulta la situación. Para acelerar el proceso entre la obtención de contenido en la pantalla y hacerlo interactivo, tenemos que centrarnos en el FID.

El FID mide toda interacción que ocurre durante la carga de la página. Las nuevas métricas de Google requieren un FID de menos de 100ms para que parezca que responde. Todo lo que esté entre 100ms y 300ms necesita ser mejorado y todo lo que esté por encima tiene un rendimiento deficiente.

core-web-vitals

➡️CLS, Cumulative Layout Shift

Mide la estabilidad visual de su sitio. En otras palabras, ¿las cosas se mueven en la pantalla mientras se cargan o cambian de disposición? Te resultará familiar en páginas antiguas con exceso de banners o pop ups que dificultan el hacer clic en botones cuando aparece un anuncio en un pop up de carga lenta.

Estos cambios de disposición son muy habituales con los anuncios ya que su proceso de carga es mucho más lento que el del resto de la página.

Podemos poner como ejemplo las web de noticias que son un clásico en acabar con la paciencia de cualquier usuario con el salto de los anuncios que impiden leer el contenido.

El cambio de disposición acumulativo compara los marcos para determinar el movimiento de los elementos. Toma todos los puntos en los que se producen cambios de diseño y calcula la gravedad de esos movimientos. Google considera que cualquier cosa por debajo de 0,1 es buena, mientras que cualquier cosa de 0,1 a 0,25 necesita trabajo. Todo lo que esté por encima de 0,25 es pobre.

core-web-vitals

🔨Herramientas para medir los signos vitales de la web

Hay un montón de herramientas que nos ayudarán a monitorear los signos vitales de la web y a mejorar el rendimiento de un sitio. Las más importantes son:

PageSpeed Insights: Eta herramienta de Google además ofrece consejos sobre lo que hay que mejorar.

Lighthouse: Google construyó Lighthouse como una herramienta para auditar PWAs, pero ahora es una gran herramienta para auditar performance de una web. Tiene varias auditorías que PageSpeed Insights no tiene e incluso tiene algunos medidores de SEO.

El informe de Core Web Vitals de Search Console : Ahora puedes obtener información de tu sitio directamente desde search console sin usar nada más.

Conclusión

Esperamos que te haya quedado claro qué son las Core Web Vitals y cómo van a influir en la calificación de tu sitio web por parte de Google. Te recomendamos que te pongas ya manos a la obra para mejorar aquellos aspectos que te puedan influir negativamente.

Si tienes dudas estamos encantados de atenderte en los comentarios. Muchas gracias por haber llegado hasta aquí.

Si te ha gustado este post te interesa:

5/5 - (2 votos)

Comparte esta entrada

Deja un comentario

RESPONSABLE: DESAFIO INTERNET SL.
FINALIDAD PRINCIPAL: Atender solicitudes de información, ejecución de la contratación de servicios y remisión de comunicaciones comerciales.
LEGITIMACIÓN: Consentimiento del interesado.
DESTINATARIOS: No se cederán datos a terceros, salvo autorización expresa u obligación legal.
DERECHOS: Acceder, rectificar y suprimir los datos, portabilidad de los datos, limitación u oposición a su tratamiento, transparencia y derecho a no ser objeto de decisiones automatizadas.
INFORMACIÓN ADICIONAL: Puede consultar la información adicional y detallada sobre nuestra Política de Privacidad y Aviso Legal.
ADICIONAL: Puede consultar la información adicional y detallada sobre nuestra Política de Privacidad y Aviso Legal.