Optimizando para Core Web Vitals

Google anunció que esta actualización se lanzaría a mediados de junio y entraría en vigor en agosto de 2021. Esta actualización combinará nuevas señales, Core Web Vitals y señales anteriores relacionadas con la experiencia de usuario.

Si echamos un vistazo, la experiencia de la página siempre ha sido importante para Google para asegurarse de que los usuarios logran sus propósitos interactuando con un sitio web. En 2015, Google comenzó a tener en cuenta la facilidad de uso móvil de los sitios web. Además de esto, Google ya ha estado utilizando la velocidad de página como un factor de clasificación en las búsquedas móviles desde 2018.

En 2020, salieron con Core Web Vitals, que es el conjunto de métricas que estiman la experiencia de la página que la mayoría de los usuarios obtienen al aterrizar en su sitio. A partir de junio de 2021, estas métricas formarán parte de su algoritmo de clasificación de búsqueda.

No esperamos que esta actualización cause enormes fluctuaciones en la clasificación de sitios web. Otras señales de clasificación seguirán siendo la relevancia contextual y los factores hipotéticos no revelados, por ejemplo, enlaces traseros, intención de búsqueda, etc. El contenido del sitio web sigue siendo la señal de clasificación más fuerte para Google, pero la experiencia de la página ahora se convierte en un factor decisivo cuando dos o más sitios web muestran la misma relevancia contextual. Por lo tanto, lo que está en juego puede ser mucho mayor en nichos competitivos.

Creemos que esta iniciativa tiene como objetivo recompensar a los sitios web que ofrecen mejores experiencias de página para los usuarios. También aporta mucha más transparencia a las actividades de optimización de SEO porque estas métricas se divulgan públicamente como un factor de clasificación.

Las páginas que demuestran un rendimiento estable y rápido también hacen que los visitantes permanezcan más tiempo en el sitio web, les ayudan a alcanzar sus objetivos e incluso los convierten en compradores con más frecuencia. Según el propio estudio de Google, los visitantes tienen un 24% menos de probabilidades de abandonar las páginas que cumplen con los umbrales de Core Web Vitals.

Google también planea implementar el sistema de insignias dedicado, que calificará el rendimiento del sitio web en términos de Core Web Vitals y los marcará con indicadores visuales en los resultados de búsqueda. Cabe esperar que los presupuestos publicitarios se alejen de los editores con barras de progreso rojas.

Core Web Vitals son el conjunto de métricas en evolución desarrolladas por Google para capturar las partes más importantes de la experiencia de página que los usuarios obtienen en un sitio web. Actualmente, el conjunto incluye tres variables enfocadas en la carga (Largest Contentful Paint), interactividad (First Input Delay) y estabilidad visual (Cumulative Layout Shift).

En términos muy simples, el Largest Contentful Paint (LCP) estima cuánto tiempo tarda el elemento más grande en cargarse en una página, por ejemplo, podría ser un anuncio de banner grande en la parte inferior de la página. Los elementos grandes considerados para esta medición incluyen:

• elementos img
• elementos de imagen dentro de un elemento svg
• elementos de video
• elementos con imágenes de fondo
• elementos a nivel de bloque

Idealmente, usted querrá mantener la puntuación LCP por debajo de 2.5 seg.

First Input Delay (FID) mide la rapidez con la que un usuario puede interactuar con el sitio web. Esta métrica explica el tiempo necesario para que el explorador comience a procesar controladores de eventos en respuesta a las interacciones del usuario, como clics, toques o usar controles personalizados alimentados por JavaScript. Una buena puntuación FID es de 100 ms o menos. Es la métrica vital web con la que un editor más raramente tiene problemas. Sin embargo, todavía puede entrar en el área roja si usted tiene una gran cantidad de procesamiento en segundo plano, por ejemplo, si utiliza una gran cantidad de plugins de WordPress que funcionan sin ninguna pausa.

Cumulative Layout Shift (CLS) realiza un seguimiento si el diseño de página cambia por su propia voluntad o si los elementos del sitio web se mueven inesperadamente a medida que se carga la página. Por ejemplo, cuando un anuncio de banner finalmente se carga y el texto y los titulares del artículo cambian, por lo que el usuario tiene que ajustar dónde estaba leyendo. Por lo tanto, la métrica CLS estima la suma de todas las mediciones de cambio de diseño individuales, es decir, puede ser sólo un cambio masivo o varios cambios diminutos.

El objetivo de la métrica CLS es tener un cambio de diseño acumulativo de 0,1. Además, se mide en términos de porcentajes en lugar de píxeles para ajustarse para diferentes tamaños de pantalla. En abril, Google actualizó cómo se realiza un seguimiento de la puntuación cls y la hizo más justa para las páginas web que están abiertas durante mucho tiempo (de larga duración) o emplean un desplazamiento infinito.

Una cosa importante para saber es que estas métricas estiman los datos de campo en lugar de los datos de laboratorio del rendimiento de la página. Esto significa que recopilan datos de medición de usuarios reales y anonimizados durante un período de tiempo en lugar de estimaciones de experimentos puntuales o estimaciones de laboratorio. Normalmente, los informes de análisis de Core Web Vitals estiman el percentil 75 de todas las cargas de página reales. Los datos del experimento de laboratorio para esas métricas también se pueden usar para evaluar previamente el rendimiento de la página durante el desarrollo.

Core Web Vitals muestra la instantánea actual del rendimiento real de tu sitio web en el pasado reciente: la ventana de retroceso de Google es de 28 días. Por lo tanto, debe tener en cuenta que tomará tiempo para que las optimizaciones tengan un impacto en esas métricas.

Google ahora es compatible con la medición de Core Web Vitals en una serie de herramientas, incluyendo Lighthouse, PageSpeed Insights y Chrome DevTools. Core Web Vitals también se puede medir mediante herramientas de terceros usando API web estándar, por lo que puede encontrar sistemas analíticos de terceros que tienen en cuenta estas métricas.

Hasta ahora, una de las maneras más sencillas de probar su sitio web y averiguar las puntuaciones reales es mirando la herramienta de informes PageSpeed Insights impulsada por Lighthouse. En abril, Google también añadió un nuevo informe de Page Experience en Search Console, que realiza un seguimiento de todas las señales de experiencia de página.

Las herramientas de generación de informes le mostrarán las puntuaciones de escritorio y móviles por separado, y las puntuaciones móviles generalmente mostrarán un peor rendimiento. Idealmente, usted deseará mantener cada métrica en el verde para escritorio y móvil.

Las puntuaciones bajas en el móvil se pueden explicar por conexiones móviles más lentas, imágenes con el tamaño modificado, etc. Recomendamos optimizar para dispositivos móviles primero en caso de que haya una diferencia drástica entre Core Web Vitals móvil y de escritorio.

Desafortunadamente, elementos del sitio web como formatos de anuncios pesados, formularios de clientes potenciales o inscripciones en boletines informativos pueden afectar a Core Web Vitals.

En MGID, invertimos recursos significativos y optimizamos nuestras soluciones publicitarias para la velocidad de carga de página y el rendimiento del navegador. Otras plataformas publicitarias, sin embargo, pueden quedarse atrás en la implementación de los nuevos desarrollos, por lo que debe trabajar estrechamente con ellos y asegurarse de que están lo suficientemente optimizados como para traerle buenas puntuaciones.

Para prepararnos para la actualización de Core Web Vitals, ya hemos lanzado una serie de características y mejoras en nuestros widgets:

Uno de los obstáculos más comunes que afectan a Core Web Vitals, y precisamente el puntaje del LCP, son las imágenes y los archivos de grandes tamaños. Para ordenarlo, puede cambiar el tamaño de las imágenes al tamaño de píxel correcto antes de cargarlas en la plataforma CMS. Como alternativa, también puede servir imágenes en formato WebP, que utiliza la codificación de luz predictiva para comprimir imágenes. Esta última opción es preferible, ya que le permite ajustar sin problemas los valores de píxeles a diferentes tamaños de pantalla y tiene mejores tasas de compresión en comparación con otros formatos.

Una vez que suba las imágenes, también hay diferentes herramientas que pueden ayudarle a comprimirlas aún más. Algunos de ellos vienen en forma de plugins para WordPress, por ejemplo, reSmush.it, EWWW Image Optimizer, ShortPixel Image Optimizer y WP Smush. También puede comprimir imágenes en su sitio retrospectivamente para mejorar la experiencia del usuario en las páginas existentes.

Para acelerar su sitio web, considere la posibilidad de eliminar scripts o plugins innecesarios. Para scripts de terceros que no puede abandonar, puedes usar Google Tag Manager y configurar el disparador Windows Loaded, que aplazará la carga de scripts no críticos hasta que los elementos principales estén completamente cargados.

Ciertos temas y layouts de diseño pueden ralentizar su sitio web y empeorar considerablemente la puntuación CLS. Puede probar previamente diferentes temas en el entorno de laboratorio y elegir el que tenga las mejores puntuaciones, normalmente este sería el que tiene menos imágenes de fondo.

Para algunos elementos de carga más lenta, puede utilizar la reserva de espacio preventivo. Dependiendo del dispositivo que utilice un visitante del sitio web, el marcador de posición (o contenedor) tiene un cierto tamaño conocido de antemano y reserva el espacio necesario, por lo que el elemento lento no tiene que cargarse completamente desde el principio ni crea cambios de diseño innecesarios. También puede pre-dimensionar bloques de contenido de terceros y anuncios.

Considere la posibilidad de eliminar vídeos de reproducción automática, presentaciones de diapositivas e imágenes pesadas en la versión móvil. Para mejorar la experiencia de la página en dispositivos de bajos recursos, puede agregar vídeos a través de un marcador de posición, es decir, como imágenes estáticas que cargan vídeos cuando un usuario hace clic en ellos.

La carga diferida también se puede implementar para cualquier elemento grande del sitio web, no solo para anuncios. Esta característica de optimización se utiliza para aplazar la carga de elementos hasta que un usuario alcanza un determinado umbral. La carga diferida puede mejorar significativamente el First Input Delay (interactividad) en su sitio web. Los widgets de MGID también funcionan con esta característica.

El rendimiento del hosting y el tiempo de respuesta lento del servidor son otras razones comunes para obtener puntuaciones deficientes en Core Web Vitals. Para sitios web más pequeños con problemas de carga de páginas, podría ser suficiente empezar a usar plugins de almacenamiento en caché, por ejemplo, WP Cache o WP Rocket. Para proyectos de publicación más grandes con audiencias que provienen de diferentes regiones, se puede recomendar asociarse con proveedores de CDN, que mantienen sus propias redes de servidores y pueden localizar copias de contenido web más cerca de los usuarios finales.

Con esta nueva actualización, la experiencia de la página será más importante para los editores para lograr altos rankings SEO y obtener más tráfico orgánico. Google definió claramente nuevas señales de clasificación, es decir, Core Web Vitals, por lo que los editores ahora pueden priorizar estas métricas en sus esfuerzos de optimización de la búsqueda.

En la mayoría de los casos, al optimizar para Core Web Vitals, los editores deben encontrar el equilibrio adecuado entre algunas características avanzadas, opciones de diseño y rendimiento de página. Tener imágenes de fondo grandes y de alta calidad, videos o formularios de registro dinámicos definitivamente puede ralentizar su sitio web.

En MGID, la experiencia del usuario que los lectores obtienen al interactuar con nuestros anuncios siempre ha sido la máxima prioridad. Siempre supervisamos las últimas sugerencias y tecnologías que están en aumento e implementamos las mejores soluciones que ofrecen los navegadores para mejorar el rendimiento de HTML, JavaScript y CSS.