¿Qué son las Core Web Vitals y cómo mejorarlas?

¡El mundo del SEO está cambiando! En mayo del año pasado Google, en su blog oficial, anunció la introducción de nuevos parámetros para evaluar la experiencia de usuario de un sitio web. Estos parámetros se denominan Core Web Vitals que se convertirán en un factor de ranking oficial en este 2021 y reforzarán el mantra de Google: hacer que la experiencia de navegación de los usuarios sea cada vez más satisfactoria y dar respuesta a sus solicitudes de forma rápida y clara.

Cómo medir el rendimiento de un sitio en 2021

En 2021 el rendimiento de un sitio se puede medir a través de estas herramientas que enumeramos a continuación:

  • PageSpeed ​​Insights
  • Consola de búsqueda
  • DevTools de Chrome
  • Informe UX de Chrome
  • Extensión Web Vitals

Todos estos datos se refieren a la experiencia del usuario de Chrome, que es un centro de datos recopilado de los usuarios que usan Chrome. Sin embargo, son datos parciales, ya que incluyen solo la información (estadísticas de uso, historial, etc.) para la que los usuarios han dado su aprobación para su recopilación.

Que son Web Vitals

Los Web Vitals son los puntos de referencia para medir la calidad de un sitio web y su experiencia de navegación. Los tres más importantes se denominan Core Web Vitals, ya que son factores de clasificación fundamentales para Google y se refieren a la velocidad, el tiempo de respuesta y la estabilidad del diseño de un sitio web:

Los 3 principales elementos vitales web en detalle:

  • LCP: la pintura con contenido más grande: es la velocidad de carga del sitio y el diseño (carga)
  • FID: Retraso de la primera entrada – Interactividad de la página
  • CLS: Cambio de diseño acumulativo – Visualización estable de carga

LCP (pintura con mayor contenido)

El parámetro LCP identifica el tiempo de carga del elemento más grande del diseño cuando se carga el sitio. Por lo general, el elemento “más grande” se incluye en uno de los elementos de código img, image, svg, video o image que se cargan a través de la función url en el CSS. Esta métrica establece que el elemento más grande que aparece en pantalla es también el más importante y tiende a penalizar contenidos o elementos fuera de escala como: títulos enormes, imágenes de apertura que desfasen el diseño, banners publicitarios invasivos, etc.

Por lo tanto, es esencial para el ranking de un sitio web no insertar videos o imágenes “en la mitad superior de la página” de más de 250 píxeles de ancho. Imágenes de 300 píxeles o banners publicitarios que superen este formato ya suponen una penalización importante.

¿Qué entendemos por mitad superior de la página?

Significa que no se considera el tiempo de descarga sino el espacio total que utiliza el objeto en la pantalla del usuario. Si los elementos se representan tanto por encima como por debajo del límite de la página, pero obviamente solo la parte visible se considera relevante.

En términos de tiempo, los sitios deben cargar el contenido más grande en 2.5 segundos para brindar una buena experiencia de usuario, mientras que se consideran lentos y ya están penalizados por encima de los 4 segundos.

Retardo de la primera entrada

El segundo parámetro es el retardo de la primera entrada, que es una medida de interactividad. Representa el tiempo transcurrido entre la primera interacción de un usuario con una página del sitio (como hacer clic en un enlace, botón o alguna función JavaScript) y cuando el navegador realmente responde a esa acción. Ten en cuenta que el desplazamiento y el zoom del mouse se consideran acciones continuas y no forman parte de la medición.

Google considera solo el retraso de la primera entrada porque será la señal que tendrá el usuario sobre las capacidades de interactividad del sitio y será fundamental para tener una impresión general de la calidad de la navegación (y de hecho un usuario decide seguir navegando en base a en la primera respuesta de un sitio web). Para una buena calidad de navegación y una buena puntuación en este parámetro, un sitio web debe garantizar una interacción completa con la página en 100 milisegundos.

ClS (cambio de diseño acumulativo)

Cambio de diseño acumulativo es un parámetro que mide el desplazamiento de los elementos visibles y los cambios de diseño que se producen en la página durante toda la duración de la navegación. El cálculo depende de dos valores: componente de impacto y componente de distancia. El componente de impacto indica el espacio que ocupa un elemento en la pantalla y lo que ocupa después de moverlo.

El componente de distancia es la distancia más grande que un elemento ha cubierto en el cuadro mientras se mueve (horizontal o verticalmente) dividido por el tamaño más grande de la ventana (ancho o alto, el que sea mayor) y siempre se mide en porcentaje. Un cálculo bastante complicado, pero basta con decir que para una buena UX el resultado debería ser inferior a 0,1.

Otros factores de posicionamiento:

Google ha enumerado una serie de elementos y métricas que cada vez tienen más peso en la evaluación de un sitio web y en su ranking y son:

  • Optimización para dispositivos móviles
  • Carga reducida de páginas web
  • El protocolo de seguridad HTTPS
  • estructuración de anuncios

Cómo mejorar Core Web Vitals

Google recomienda mejorar todas las métricas críticas y tenemos entre las correcciones más comunes:

  • Restringir el tamaño de la página a menos de 500 KB.
  • Reduce el número de recursos de la página a 50.
  • Usar AMP

Suscríbete a mi canal de YouTube 👇🏼

Core Web Vitals sus

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *