Web performance, una herramienta para impulsar el e-commerce

POR ALEXIS BARBA / FRONTEND ENGINEER EN HTECH
Brindar una experiencia rápida y fluida gusta a los usuarios y los ayuda a convertirse en clientes leales y recurrentes. Por tanto, el rendimiento debe ser un criterio importante que defina la calidad y el éxito de los nuevos productos y/o sus características. De hecho, la excelencia del producto y trabajar en desafíos también interesa a los desarrolladores.

Existe suficiente evidencia y casos de éxito de compañías que optimizan las velocidades de carga de sus sitios y observan mejoras importantes en sus ventas. Según un estudio realizado por Amazon en 2012, un segundo adicional de tiempo de carga podría costarle a la empresa 1,600 millones de dólares. Estudios como éste demuestran la importancia de tener una gran experiencia de usuario (UX, por sus siglas en inglés) y un sitio web rápido.

Encontrar la correlación entre el rendimiento de tu web y las métricas comerciales es la clave para poder enfocar los esfuerzos de manera satisfactoria. A continuación, hablaremos de algunos de los puntos más importantes que estas empresas miden a la hora de implementar mejoras.

Web Vitals

Web Vitals es una iniciativa creada por Google para proporcionar orientación y métricas unificadas que miden la experiencia de la página del usuario final en la web.

Actualmente cuenta con tres métricas que cuantifican el tiempo de carga, de interactividad y de estabilidad visual. Éstas son: Largest Contentful Paint (LCP), First Input Delay (FID) y Cumulative Layout Shift (CLS). Lograr una excelente puntuación en estas tres métricas creará una experiencia de sitio web más fluida para los usuarios. Por el contrario, Web Vitals deficientes pueden tener un impacto negativo en el tráfico web y el negocio, ya que también afectan en la clasificación de los motores de búsqueda.

LCP. Mide el tiempo requerido para que el elemento más grande de la página sea visible dentro de la ventana gráfica. Un buen tiempo para este indicador debe ser menor a 2.5 segundos.

FID. Es el tiempo que le toma al sitio realizar la primera acción que solicita el usuario; por ejemplo, escribir en un input o accionar un botón. Una medida óptima para este indicador es inferior a 100 milésimas de segundo.

CLS. Es una medida de la estabilidad general del diseño del sitio. Un sitio que cambia inesperadamente el diseño a medida que se carga la página puede generar errores accidentales y distracciones para el usuario. Este indicador se considera óptimo cuando es inferior a 100 milésimas de segundo.

La experiencia de usuario

Además de las Web Vitals, existen otras métricas que debemos tener en cuenta para garantizar una buena UX, las cuales afectan directamente en el SEO (optimización de motores de búsqueda) y en la tasa de conversión, pues se puede tener la web más optimizada y al mismo tiempo ser una pesadilla en usabilidad. Algunas de las más importantes son:

Mobile Friendly. No es fácil de cuantificar, pero tiene una gran relación con la Tasa de Conversión Móvil Relativa (Rel mCvR, en inglés), que se calcula dividiendo los ingresos provenientes de dispositivos móviles sobre los dispositivos de escritorio. La media de los 10 e-commerce más grandes de Estados Unidos es del 50%. Una mala Rel mCvR va muy relacionada con qué tan amigable es nuestro sitio con los dispositivos móviles. En este sentido, los enfoques de diseño como el First Mobile son excelentes aliados para hacer sitios diseñados y optimizados para móviles.

Safe Browsing. Hacer que nuestro e-commerce sea seguro para todos no es tarea fácil y requiere de muchas disciplinas, pero lo menos que nuestros usuarios esperan al confiar en nosotros es que sus datos se encuentren bien resguardados. Para lograrlo, debemos garantizar la calidad del código, buenas prácticas de seguridad, el uso de estándares, certificaciones y protocolos seguros, como HTTPS, y apoyarnos de herramientas de monitoreo de errores, entre otras.

Accesibilidad. Se trata de hacer la web más inclusiva para todos. Por ende, herramientas como Lighthouse nos pueden dar una clara idea de qué tan buenas prácticas en temas de accesibilidad estamos siguiendo, pero no son tan profundas como la inmersión misma. Las principales prácticas implican hacer el sitio accesible a teclado, soporte para lectores de pantalla y crear diseños y estilos que se adapten a las diferentes necesidades de los usuarios, como unidades relativas, contraste entre textos y fondos, diseño responsivo, entre otros.

Construyamos una mejor web para todos

En la web moderna es importante medir, optimizar y monitorear, pues el rendimiento juega un papel importante en el éxito de cualquier compañía, sin embargo, el rendimiento es un viaje, no el objetivo. Por eso, hay que hacer énfasis en que los usuarios nos dan el mejor indicador de que vamos por el buen camino. Entonces, iterar sobre los resultados y comentarios que obtenemos de ellos, así como saber escucharlos y entender sus necesidades nos lleva al camino correcto de la mejora continua.