El impacto empresarial de las Métricas web esenciales

En este artículo, exploraremos ejemplos de empresas que ya vieron un impacto positivo en sus usuarios y empresas para comprender cómo se correlacionan las métricas web esenciales con las métricas empresariales clave.

Saurabh Rajpal
Saurabh Rajpal
Swetha Gopalakrishnan
Swetha Gopalakrishnan

LCP, FID y CLS

¿Te cuesta convencer a las partes interesadas de que adopten las Métricas web esenciales? ¿O te preguntas si realmente ayuda a tu empresa? En este artículo, se analizarán ejemplos de empresas que ya vieron un impacto positivo en sus usuarios y empresas para comprender cómo las métricas web esenciales se correlacionan con las métricas comerciales clave.

Si prefieres un video, mira esta charla de Google I/O:

Por qué las Métricas web esenciales son importantes para tus usuarios y tu empresa

Las diferentes partes interesadas de una organización pueden tener prioridades diferentes. Las Métricas web esenciales pueden reunirlas a todas en la misma página si te enfocas en optimizar las métricas centradas en el usuario y el crecimiento empresarial resultante.

Piensa en las Métricas web esenciales.

La ruta para obtener buenas Métricas web esenciales puede variar de un sitio a otro, según en qué etapa del recorrido de rendimiento se encuentre y qué tan complejo sea el diseño del sitio. Puede ir desde aprovechar las oportunidades más fáciles y obtener resultados significativos hasta implementar soluciones complejas que solucionen problemas difíciles. Independientemente de la cantidad de tiempo que se dedique, los responsables de la toma de decisiones deben considerar esto como una inversión a largo plazo en el crecimiento de su empresa. Ofrecer una experiencia de navegación rápida y fluida deleita a los usuarios y ayuda a convertirlos en clientes leales y recurrentes. Para los administradores de productos, el rendimiento debe ser un criterio importante que defina la calidad y el éxito de las nuevas funciones del producto. Además, la excelencia del producto y el trabajo en desafíos interesantes también mejoran la satisfacción de los desarrolladores.

Si bien las Métricas web esenciales como indicador de clasificación brindan motivación adicional para invertir tiempo en el rendimiento, la adopción de las Métricas web esenciales tiene muchos otros beneficios a corto y largo plazo más allá de la clasificación. Exploremos varios casos de éxito de marcas globales y locales que adoptaron las Métricas web esenciales (antes de que tuvieran un impacto en la clasificación) debido a su enfoque en la experiencia del usuario.

Casos de éxito

Vodafone

Vodafone (Italia) mejoró el LCP en un 31% para obtener un 8% más de ventas.

Un 8% más de ventas

Técnicas

  • Procesamiento del servidor Renderiza el código HTML importante.
  • Reduce el código JavaScript que bloquea el procesamiento.
  • Técnicas de optimización de imágenes
  • Cambia el tamaño de la imagen hero y aplaza los recursos no críticos.

Conocimientos clave

  • Las pruebas A/B son la mejor manera de medir el impacto significativo.
  • El A/B debe ser del servidor.

iCook

iCook mejoró el CLS en un 15% para obtener un 10% más de ingresos publicitarios.

Gráfico que muestra el aumento de los ingresos publicitarios.

Técnicas

  • Menos variabilidad en el tamaño de la unidad de anuncios y los espacios publicitarios de tamaño fijo preasignados en la IU.
  • Se optimizó la lógica de carga de la secuencia de comandos del anuncio para priorizar las ofertas de encabezado y posponer el código JS que no es crítico.

Conocimientos clave

Es posible que se vea afectada la tasa de relleno, pero, con el tiempo, se producirá un aumento de los ingresos con la mejora de la visibilidad de los anuncios.

Tokopedia

Tokopedia mejoró el LCP en un 55% y obtuvo un 23% más de duración promedio de la sesión.

Antes: 3.78 s, después: 1.72 s.

Técnicas

  • Elemento LCP de renderización del servidor (SSR).
  • Precarga el elemento de LCP.
  • Optimización de imágenes (compresión, WebP, carga diferida de imágenes no críticas)

Conocimientos clave

  • Crear un panel de supervisión de rendimiento para supervisar el progreso y el impacto en todos los equipos
  • Experimentaste con diferentes técnicas de renderización (por ejemplo, elemento LCP de SSR en comparación con el contenido de SSR en la mitad superior de la página en comparación con la renderización completa del cliente).

Redbus

Las correcciones de las métricas web esenciales contribuyeron a un aumento del 80% al 100% en los porcentajes de conversiones móviles (mCVR) y a un aumento significativo en la clasificación de dominios en las propiedades de mercado globales de Redbus.

Aumento del 192% en el ranking de dominios en Colombia

Técnicas

Conocimientos clave

  • Reducir el CLS de 1.65 a 0 mejoró significativamente la clasificación de los dominios a nivel mundial.
  • La reducción de la TTI de alrededor de 8 s a alrededor de 4 s y del TBT de alrededor de 1,200 ms a alrededor de 700 ms contribuyó a un aumento del 80% al 100% en el mCVR en las propiedades globales.
  • El uso de herramientas de RUM ayudó a capturar las métricas de rendimiento reales en mercados de nivel inferior.
  • Adoptar una cultura de rendimiento es muy importante para evitar la regresión. Esto también mejora la productividad del equipo gracias a un código optimizado, lanzamientos más rápidos y menos problemas de producción.

Los casos de éxito anteriores demuestran que puedes lograr mucho si adoptas las prácticas recomendadas y aplicas medidas rápidas. Estos son algunos ejemplos más del mundo real sobre este punto.

Netzwelt obtuvo un aumento del 18% en los ingresos publicitarios, Lazada obtuvo un aumento de 3 veces en la LCP y un aumento del 16.9% en el porcentaje de conversiones en dispositivos móviles, y GYAO obtuvo un aumento de 3.1 veces en la LCP y una mejora del 108% en la tasa de clics.

Los resultados anteriores se lograron aprovechando las oportunidades más fáciles, como las siguientes:

Optimización de imágenes Optimización de JavaScript Anuncios y contenido dinámico
Usa el formato de imagen WebP Aplaza el JS de terceros Reserva espacio para los anuncios en la mitad superior de la página
Usa CDN de imágenes Cómo quitar el código JS que bloquea la renderización y el que no se usa Cómo configurar la altura del contenido dinámico
Compresión Carga diferida de JS no crítico
Diferir imágenes no críticas Precarga de JS crítico
Cómo precargar imágenes hero
Especifica la relación de aspecto

Para obtener más prácticas recomendadas, consulta la guía de Web Vitals. Usa PageSpeed Insights para auditar tu sitio web y obtener recomendaciones prácticas de inmediato.

Hay varias marcas globales más que también se beneficiaron de invertir en las Métricas web esenciales.

¿Cómo puedes comenzar ahora?

Paso 1: Comienza a medir

Comienza por medir los datos de campo de tu sitio con las herramientas de supervisión de usuarios reales (RUM). Ya hay varias herramientas de RUM de Google y de terceros disponibles.

Herramientas de RUM

Herramientas de RUM de Google

  • Search Console
  • PageSpeed Insights
  • Biblioteca de JavaScript de web-vitals
  • Informe sobre la experiencia del usuario en Chrome (CrUX)

Herramientas de RUM de terceros

  • Cloudflare
  • New Relic
  • Akamai
  • Calibre
  • Triángulo azul
  • Sentry
  • SpeedCurve
  • Raygun

Elige la herramienta que mejor se adapte a tus necesidades. Puedes ir un paso más allá y integrar Google Analytics 4 para correlacionar las métricas web principales con tus métricas comerciales.

Paso 2: Convence a las partes interesadas

  • Informa a las partes interesadas sobre la importancia de adoptar las Métricas web esenciales para mejorar la experiencia del usuario y su correlación con las métricas comerciales de la empresa.
  • Obtén un patrocinador interno para iniciar un pequeño experimento.
  • Crea un objetivo compartido entre las partes interesadas para mejorar las métricas web esenciales en todos los equipos.

Paso 3: Realiza una implementación exitosa con estas sugerencias

  • Establece prioridades: Elige una página con mucho tráfico o importancia en las conversiones para obtener resultados significativos (por ejemplo, la página de destino de los anuncios, la página de conversión o las páginas populares).
  • Prueba A/B: Usa pruebas del servidor para evitar cualquier costo de renderización. Comparar los resultados entre las versiones optimizadas y no optimizadas
  • Supervisa: Usa la supervisión continua para evitar regresiones.

Por último, creemos que el rendimiento es un viaje, no un destino. En ese sentido, planeamos mantener este artículo actualizado con los aspectos más destacados de los casos de éxito más recientes. Si también tienes un logro comercial convincente y te gustaría que se publique en este artículo, envía una propuesta de contenido.