Diseño de paginas web

noviembre 3, 2020

Cómo mejorar elementos vitales web en WordPress

Presentamos los pasos sobre cómo mejorar elementos vitales web en WordPress para que un sitio web proporcione una sólida experiencia de usuario (UX).

Para esta tarea, se requiere evaluar y medir el rendimiento de la página lo cual, puede ser un desafío, especialmente cuando no se tiene muy seguro cuáles son las métricas que deben captar más atención.

Sin embargo, Core Web Vitals de Google, también conocido como Web Vitals, facilita esta tarea. Esta colección de indicadores clave y métricas de rendimiento es una iniciativa de Google para evaluar y puntuar la experiencia proporcionada por cualquier sitio web.

 Web Vitals
Herramienta Web Vitals

Elementos vitales de Google Core Web

Los Web Vitals ‘Core’ son un subconjunto de los ‘Web Vitals’, una iniciativa de Google que tiene como objetivo facilitar a los propietarios de sitios la categorización y clasificación de las métricas más importantes.

Cada Core Web Vital es medible y juega un papel en las señales de clasificación de Google, existen una gran variedad de éstos y se centran principalmente en tres aspectos clave de UX: carga, interactividad y estabilidad visual.

Cada uno de estos aspectos tiene su propia métrica respectiva, por ejemplo, la carga del contenido debería ocurrir dentro de los 2.5 segundos después de que la página comience a cargarse inicialmente.

El retraso de la primera entrada es una métrica para la interactividad. Las páginas que ofrecen una experiencia de usuario sólida suelen tener una puntuación de no más de 100 milisegundos.

Respecto a la estabilidad visual, los usuarios experimentan cambios inesperados en el diseño de su sitio. Para obtener el mejor rendimiento, esta métrica debe ser inferior a 0.1.

Una UX deficiente, como la carga lenta de la página o una navegación compleja, puede generar un aumento de las tasas de rebote y un mayor abandono del carrito de compras.

Los Core Web Vitals son importantes porque ayudan a medir el rendimiento del sitio de WordPress. Proporcionan métricas concretas que se pueden rastrear y probar para evaluar la UX del sitio y luego realizar las mejoras necesarias.

Herramientas eficientes para medir las principales métricas de un sitio web

Hay varias herramientas que puede usar para medir, probar e informar los aspectos principales de las páginas. Esto incluye Google PageSpeed ​​Insights, Google Search Console, la extensión Web Vitals, entre otras.

Los datos de PageSpeed ​​Insights y Google Search Console se recopilan del informe de experiencia de usuario de Chrome (CrUX). Sin embargo, una ventaja de usar Google Search Console es que permite verificar los datos de LCP en todo el sitio, en lugar de analizar páginas individuales al azar.

PageSpeed ​​Insights
Herramienta PageSpeed ​​Insights

Por otro lado, la extensión Web Vitals, es de uso gratuito y facilita la resolución de problemas que pueda encontrar con respecto a la carga del contenido y la interactividad, se puede usarlo en el propio sitio web y mientras navega por Internet.

Esta extensión liviana mide cada métrica mediante el uso de la biblioteca web-vitals y las muestra en el navegador. Proporciona una forma rápida y sencilla de ver el rendimiento del sitio, así como los sitios web de los competidores.

Para obtener una visión más detallada de estas métricas, se puede usar Chrome DevTools (específicamente Lighthouse) que sirve para medir Core Web Vitals en un entorno de laboratorio, sin embargo, este método debe usarse principalmente para medir la carga y nivel de interactividad.

Teniendo en cuenta que esta herramienta carga las páginas en un entorno simulado sin entrada de usuario real, no puede proporcionar medidas para interactividad. En su lugar, se utiliza una métrica similar llamada tiempo total de bloqueo.

WebPageTest
Herramienta WebPageTest

Una última herramienta que puede utilizar para medir y recopilar información sobre sus Web Vitals es WebPageTest. Esta plataforma independiente ofrece informes para varios aspectos de un sitio de WordPress, incluido Web Vitals. Puede ser particularmente útil para obtener información sobre el rendimiento y la UX del sitio en ciertos dispositivos y condiciones de red.

Una vez que ingrese la URL de su sitio web, se puede hacer clic en el botón iniciar prueba para comenzar. También se puede seleccionar una ubicación para ejecutar la prueba, así como el navegador que se desea utilizar.

Leíste: Cómo mejorar elementos vitales web en WordPress, te recomendamos: Herramientas de prueba de usabilidad web útiles

Te invitamos a que nos sigas en nuestras redes sociales: Facebook, Twitter, Instagram y Youtube con el perfil: @tortugacode