Core Web Vitals: optimiza tu sitio

Core Web Vitals: optimiza tu sitio para el update del algoritmo de Google (2021)

martes, 8 de junio de 2021 | Comentarios

Escrito por

A partir de junio, entra en vigor la actualización del algoritmo de experiencia de la página y el tan esperado Core Web Vitals. A pesar de ser tratado como una novedad, desde mediados de 2011 Google (el principal motor de búsqueda del mundo) viene reforzando la importancia de la experiencia del usuario al acceder a cualquier página web.

En resumen, esto puede entenderse como tener un sitio con buena navegación para los usuarios, con mayor velocidad de carga de la página y sin interrupciones innecesarias. Obtén más información sobre la nueva actualización de Google y cómo prepararte para los cambios.

¿Qué es Core Web Vitals (CWV)?

Core Web Vitals también conocido popularmente por la sigla CWV, es un subconjunto de Web Vitals centrado en métricas esenciales para el buen desempeño de un sitio web, evaluado desde el punto de vista de la experiencia del usuario. Se consideran “core”, ya que son la principal forma de medir la experiencia (User Experience) en la práctica.

Como se trata de pautas básicas, todos los propietarios de sitios web deben implementar las recomendaciones y seguir las métricas que se muestran en las herramientas de análisis de Google.

Core Web

Web Vitals fue una iniciativa creada por Google para proporcionar una visión y orientación unificada de los indicadores de calificación de un sitio, centrada en la experiencia del usuario en la web. En este conjunto de métricas también se incluyen: optimización de páginas web para mobile (basadas en el concepto de Mobile Friendly), navegación segura, uso de HTTPS y reducción del uso de pop.ups o recursos intrusivos.

Indicadores de calificación de un sitio
Fuente: Google Search Central Blog

 

Los 3 pilares de Core Web Vitals

En este update de algoritmo, que se combina con Core Web Vitals, Google mantiene su enfoque en tres pilares:

  1. Largest Contentful Paint (LCP)
  2. First Input Delay (FID)
  3. Cumulative Layout Shift (CLS)

Para simplificar la comprensión: las recomendaciones de Core Web Vitals Google abordan el tiempo de carga, de interactividad y estabilidad visual de las páginas online. A continuación, entiende con detalle cada uno de ellos.

1. Largest Contentful Paint (LCP)

Esta métrica monitorea la velocidad de carga del contenido principal en la página. Idealmente, para garantizar a los visitantes una buena experiencia, el LCP debe durar un máximo de 2,5 segundos, contados desde el momento de la apertura inicial de la página hasta que el contenido se muestre en la pantalla.

Por lo tanto, es necesario optimizar el tiempo de carga de la página o del sitio en su conjunto.

2. First Input Delay (FID)

FID o First Input Delay, mide el tiempo desde la primera interacción del usuario con el sitio hasta el momento en que el elemento procesa la respuesta para esta acción, la cual debe ocurrir en hasta 100 milisegundos. Ejemplo: al hacer clic en un botón o un link redirigido, ¿cuánto tiempo tarda en completarse la acción?

Recuerda, que en este caso la métrica no se considera el scroll y tampoco mide el tiempo que tarda el navegador en procesar el evento en sí o en volver a cargar la interfaz después de eso.
3. Cumulative Layout Shift (CLS)
El tercer indicador de Core Web Vitals, o Cumulative Layout Shift, o CLS, evalúa la estabilidad visual y recomienda que las páginas tengan un CLS por debajo de 0,1.

Normalmente, lo que sucede es que los objetos y elementos de una página “se mueven”, es decir, “cambian de lugar” incluso cuando la página todavía se está procesando o cargando para el usuario. En este caso, lo que Google propone es que los cambios de layout interfieran menos en esta experiencia, siendo más estables.

A diferencia de otras métricas, CLS no se calcula en términos de tiempo (segundos), sino según el tamaño del elemento dispuesto en la página y el número de movimientos.

Para recapitular y ayudarte a comprender Core Web Vitals, consulta el puntaje y el resultado de la evaluación de cada factor de clasificación:

Factor de clasificación de Core Web Vitals
Fuente: Google

¿Cómo optimizar tu sitio web para Core Web Vitals, la nueva actualización de algoritmo de Google en 2021?

Entiende cuáles son los problemas comunes en cada aspecto y cómo optimizar tu sitio web para los nuevos factores de Core Web Vitals:

Largest Contentful Paint (LCP)

¿Qué puede causar problemas?

  • Respuestas lentas del servidor
  • Rendir blocking de Javascript o CSS
  • Tiempos de carga lenta (causados por archivos multimedia como imágenes y videos)
  • Dificultad de renderizado

¿Cómo optimizar?

  • Optimizar imágenes (formatos más eficientes y modernos)
  • Usar lazy loading en las páginas
  • Minificar y aplazar CSS y Javascript no críticos (critical CSS – cargar CSS de la primera página por separado, primero)
  • Optimizar el servidor
  • Activar el caché de la página
  • Usar Service Worker

First Input Delay (FID)

¿Qué puede causar problemas?

  • Tareas largas, que consumen más tiempo y ancho de banda para ejecutarse
  • Ejecución prolongada de JavaScript
  • Grandes bloques de JavaScript
  • Rendir blocking JavaScript

¿Cómo optimizar?

  • Dividir JavaScripts pesados en tareas menores y asincrónicas
  • Reducir el impacto del código de terceros
  • Reducir el tiempo de ejecución de JavaScript
  • Usar Web Worker

Cumulative Layout Shift (CLS)

¿Qué puede causar problemas?

  • Imágenes sin dimensiones o demasiado pesadas
  • Ads (anuncios), contenido incrustado e iframes sin dimensión
  • Banners y aviso de cookies
  • Contenido inyectado dinámicamente en el sitio web
  • Web fonts que causan FOIT/FOUT

¿Cómo optimizar?

  • Reservar un espacio con dimensiones definidas (height y width) para imágenes y elementos (imágenes, ads, iframes) en la página
  • Dar preferencia al contenido estático
  • Reservar espacio para anuncios y contenido dinámico
  • Usar la API de carga de fuentes para reducir el tiempo de carga

Diagnóstico y seguimiento: herramientas para realizar un seguimiento de las métricas fundamentales de Core Web Vitals

Ahora puedes diagnosticar tu sitio y averiguar qué puntos deben actuar utilizando cualquiera de las herramientas básicas a continuación:

Web.dev

Google proporciona una herramienta de diagnóstico online que evalúa tu dominio. Para hacer esto, debes tener una cuenta @google e iniciar sesión en tu perfil.

Measure: herramienta de diagnóstico online
Fuente: web.dev

Google Search Console

Si tu sitio ya está integrado con Google Search Console, puede utilizar el nuevo informe “Experiencia en la página” disponible en la sección “Experiencia”.

Chrome User Experience Report

El Informe de experiencia del usuario de Chrome proporciona métricas de experiencia del usuario de uno de los navegadores más utilizados en la actualidad a nivel mundial.

Chrome user experience report

Comprende los impactos y la relación entre CWV, SEO y ranking

Pensar en la experiencia del usuario al crear un sitio web, es una premisa básica: desde la elección del alojamiento, hasta la planificación y estructura (layout), así como el contenido en sí.

Si bien se dice mucho sobre las estrategias de SEO y cómo obtener nuevas posiciones en el ranking de Google y escribir “pensando en algoritmos”, nada de esto se mantendrá por mucho tiempo si no tienes un sitio con un rendimiento aceptable. Solo piensa que un usuario que nunca ha visitado tu sitio, puede ingresar una vez y no regresar más debido a una mala experiencia.

Por eso, implementar las buenas prácticas de rendimiento y design del sitio web desde el inicio del proyecto es indiscutible. Y, como propone Google, no solo será un requisito previo, sino también unas de las mayores prioridades en el futuro.

La lucha por aparecer en las primeras posiciones de la página de resultados será cada vez mayor. Los factores de clasificación detrás de los algoritmos son numerosos. Pero, es más probable a “ganar” quien:

  • Ofrecer la mejor experiencia del usuario
  • Tener contenido de gran relevancia
  • Coincidir con las intenciones de búsqueda

Entonces, piensa que Core Web Vitals es una forma didáctica de brindar valores a los usuarios de la web.

Si estás enfocado en el usuario y en generar experiencias valiosas, los otros logros, directos o indirectos, ya sea la posición en Google, el aumento de tráfico o la conversión, serán consecuencias.

¿Te gustó el contenido? ¡Sigue acompañando nuestro blog para obtener más temas sobre tecnología, negocios y marketing!


Comentarios
Presiona Enter para buscar o ESC para cerrar