Saltar al contenido

Cómo usar GTMetrix para probar la velocidad de un sitio web – ¡Efectivamente!

Cómo usar GTMetrix para probar la velocidad de un sitio web - ¡Efectivamente!

Ofertas ganadoras de WordPress

La velocidad del sitio es posiblemente una de las métricas más importantes para cualquier sitio web: para algunos sitios, la diferencia de un solo segundo puede sumar miles de dólares de ingresos perdidos (o ganados). Esto hace que medir con precisión la velocidad del sitio sea crucial. Desafortunadamente, la velocidad del sitio no es una medida particularmente fácil de medir. En este artículo, le mostraré cómo usar una de las herramientas más populares disponibles, GTmetrix, para medir de manera efectiva la velocidad de un sitio web.

Cuatro consideraciones importantes sobre la prueba de velocidad

Muchas herramientas, incluida GTmetrix, son geniales, pero bastante inútiles si todo lo que hace es una comprobación de velocidad única. En su lugar, deberá ejecutar varias pruebas y experimentar con otros factores para obtener resultados precisos.

Estos son algunos de los factores más importantes a considerar …

1. Número de pruebas

Para obtener un conjunto completo de datos realmente bueno, debe realizar muchas pruebas de velocidad, preferiblemente en diferentes momentos durante el día. Lo ideal sería programar una prueba por hora y dejarla funcionando durante aproximadamente una semana más o menos.

La razón de esto es que el rendimiento de su sitio web cambiará a lo largo del día, dependiendo del recuento de visitantes o incluso del uso de su servidor si está en un host compartido.

Un buen efecto secundario de esta prueba es que verá sus horas pico, lo que podría indicar el mejor momento para publicar nuevo contenido o orientar anuncios o ventanas emergentes a sus visitantes.

Dicho esto, todavía hay mucho que aprender haciendo solo cinco o diez pruebas en el transcurso de una hora más o menos. Aunque la velocidad de carga real dada en segundos puede cambiar en el transcurso de un día (o incluso una semana), algunas de las cosas que GTmetrix puede revelar, como muchas de las recomendaciones que dará sobre cómo acelerar su sitio web, no cambiar con el tiempo en absoluto.

2. Lugares de prueba

La proximidad de su sitio a la ubicación de la prueba (o un visitante humano real) juega un papel importante en los resultados de su prueba debido a la física (¡todavía no hemos descubierto cómo cambiar la velocidad de la luz!).

Por eso, la ubicación desde la que prueba su sitio hace una gran diferencia.

En general, desea elegir una ubicación de prueba que esté lo más cerca posible de sus visitantes objetivo (que también debe estar cerca de la ubicación física de su servidor de alojamiento).

Si su sitio web solo se dirige a una ubicación, todo lo que realmente necesita es preocuparse por los resultados de las pruebas para esa ubicación.

Sin embargo, si se dirige a una audiencia global, debe elija cuatro o cinco servidores de prueba en ubicaciones clave de todo el mundo. Intente extenderlos si es posible, p. Ej. elija al menos un servidor de EE. UU., uno de Europa, uno de Australia y uno de Asia.

Para poder elegir la ubicación desde la cual probar su sitio usando GTMetrix, deberá registrarse para obtener una cuenta gratuita.

Si se dirige a un público global y observa tiempos de carga de página por debajo del promedio para ciertas regiones, puede ser una señal de que necesita comenzar a usar una red de entrega de contenido (CDN).

3. Objetivos de prueba

A menudo veo personas probando SOLO su página de inicio. Este es un gran error que puede sesgar las cosas mucho más de lo que piensas. En primer lugar, su página de inicio puede ser la página menos intensiva en datos de su sitio, por lo que, naturalmente, es la más rápida.

Además, su página de inicio puede no ser tan importante como le gustaría pensar. Trabajé en un sitio que adquirió el 97% de su tráfico orgánicamente a través de motores de búsqueda, casi todos los cuales fueron a publicaciones / páginas individuales. Por lo tanto, asegúrese de centrarse en algo más que su página de inicio.

En resumen: la velocidad de su página de inicio es importante, pero puede ser secundaria a muchas de sus otras páginas, así que asegúrese de probar también otras, como páginas de publicación única, páginas de tiendas y páginas de productos para obtener un buen resultado. conjunto redondeado de resultados.

4. Dispositivos de prueba / velocidades de conexión

Cuando la mayoría de las personas prueban la velocidad de su sitio, solo prueban la experiencia de escritorio e ignoran la experiencia móvil.

Este es un gran error, ya que el tráfico móvil representa más de la mitad de todo el tráfico de Internet.

Además, la velocidad de su sitio puede ser significativamente diferente en dispositivos móviles que en dispositivos de escritorio. Por ejemplo, la mayoría de los dispositivos móviles, especialmente los de baja potencia, tardarán más en procesar JavaScript que las computadoras de escritorio. Entonces, si tiene un sitio con mucho JavaScript, sus tiempos de carga móvil podrían ser mucho más lentos que los tiempos de carga de su escritorio.

La velocidad de conexión es otra consideración importante. No todos sus visitantes utilizarán conexiones por cable ultrarrápidas. Por ejemplo, podrían estar navegando desde su teléfono en 4G, lo que también conducirá a tiempos de carga de página más lentos.

Si desea obtener una imagen precisa de cómo estos visitantes experimentan su sitio, es útil experimentar con diferentes dispositivos y velocidades de conexión.

GTmetrix le permitirá probar diferentes velocidades de conexión de forma gratuita, pero deberá pagar una cuenta premium si desea realizar la prueba con un dispositivo móvil.

Cómo usar y comprender la prueba básica de velocidad GTmetrix

El uso básico de GTMetrix es gratuito. Si bien puede ir a la página principal y comenzar a analizar su sitio de inmediato, le recomiendo que primero se registre para obtener una cuenta gratuita porque le dará mucha más flexibilidad.

Cuando utiliza la prueba de velocidad básica como invitado anónimo, se ve obligado a utilizar la siguiente configuración:

  1. Prueba de Vancouver, Canadá.
  2. Use un navegador Chrome de escritorio.
  3. Utilice una conexión no acelerada ultrarrápida.

Si se dirige a un público canadiense, puede estar bien, pero si no, querrá realizar una prueba desde una ubicación diferente.

Cuando te registras para un gratis Cuenta GTmetrix, abre un montón de nuevas opciones de configuración que lo ayudarán a abordar las consideraciones que discutimos anteriormente.

  • Localizaciones – Dallas (EE. UU.), Hong Kong (China), Londres (Reino Unido), Mumbai (India), Sydney (Australia), Sao Paulo (Brasil), Vancouver (Canadá).
  • Dispositivos de prueba – Chrome (Escritorio) y Firefox (Escritorio) de forma gratuita. Con un plan pago, también puedes probar Chrome en un dispositivo Android Galaxy Nexus.
  • Velocidades de conexión – varias opciones de banda ancha hasta 56k (acceso telefónico – ¿Recuerdas esos días?)

La cuenta gratuita también le da acceso a más herramientas de análisis, más sobre ellas más adelante.

Una vez que haya creado su cuenta gratuita, puede:

  1. Ingrese la URL de su sitio en el cuadro.
  2. Haga clic en el Opciones de analisis botón de acordeón para ampliar las opciones adicionales.

Para obtener una imagen precisa de los tiempos de carga de su sitio, debe hacer al menos dos opciones:

  1. Seleccione la ubicación más cercana a su público objetivo utilizando el Probar URL en desplegable.
  2. Seleccione Banda ancha (rápida) en la conexión desplegable. Esto usará una velocidad de conexión que es aproximadamente el promedio para los EE. UU. En su conjunto: puede elegir una velocidad de conexión diferente si se ajusta a sus necesidades.

Cómo configurar una prueba GTmetrix

Una vez que ejecute su prueba, GTmetrix le mostrará un cuadro de resumen que se ve así:

Resumen de prueba GTmetrix

El cuadro de resumen contiene cinco piezas de información:

  1. Tiempo completamente cargado – cuánto tiempo tarda su sitio en cargarse por completo (este es el número más importante).
  2. Tamaño total de página – Qué tan grande es su sitio. Más pequeño es mejor.
  3. Peticiones – cuántas solicitudes HTTP requiere su sitio. Menos es mejor.
  4. PageSpeed ​​Score – una aproximación rápida de qué tan optimizado se basa su sitio front-end en Google PageSpeed.
  5. Puntuación YSlow – una aproximación rápida de qué tan optimizado se basa su sitio front-end en un conjunto diferente de métricas de YSlow.

¡No se preocupe demasiado por los puntajes de PageSpeed ​​y YSlow! Estas puntuaciones pueden ser una guía útil, pero el único número que realmente importa es el tiempo de carga de la página.

Cómo usar las opciones de análisis avanzado

La instantánea anterior le brinda un buen ejemplo de las métricas actuales de su sitio, pero, si desea mejorar su sitio, GTmetrix también incluye herramientas de análisis avanzadas para ayudarlo a profundizar en el rendimiento de su sitio. Los divide en seis pestañas debajo del cuadro de resumen:

  1. Velocidad de página – marca su sitio contra las 23 recomendaciones de Google PageSpeed.
  2. Lento – marca su sitio contra las 19 recomendaciones de YSlow.
  3. Cascada – le ayuda a ver cómo se carga cada solicitud HTTP individual en su sitio.
  4. Tiempos – requiere una cuenta gratuita; le permite ver diferentes métricas de tiempo para sus tiempos de carga (explicaremos esto a continuación)
  5. Vídeo – requiere una cuenta gratuita; le permite filmar un video de cómo se carga visiblemente su sitio.
  6. Historia – le permite realizar un seguimiento del rendimiento de su sitio a lo largo del tiempo.

PageSpeed ​​y YSlow

PageSpeed ​​e YSlow ofrecen dos metodologías ligeramente diferentes para medir cómo la estructura y la mecánica de un sitio web afectan su velocidad. Los resultados de estos contienen sus propias recomendaciones para acelerar las cosas, como el almacenamiento en caché, agregar encabezados caducados, minimizar activos, habilitar la compresión gzip y similares.

Sus puntajes generales de PageSpeed ​​y YSlow se basan en el promedio ponderado de los puntajes que recibe para recomendaciones individuales. Algunas de las sugerencias son más importantes que otras, que puede ver en el Prioridad columna.

Para obtener más información sobre lo que significa cada recomendación y cómo se aplica a su sitio, puede hacer clic en la flecha para expandir cada sección.

Resultados de GTmetrix PageSpeed ​​y YSlow

Una vez más: No persiga los puntajes porcentuales. Estos pueden ser engañosos y no necesariamente tienen en cuenta absolutamente todo lo importante, como el tamaño total en megabytes de la página (que, por cierto, a menudo está muy influenciado por imágenes mal optimizadas).

En lugar, enfatizar la velocidad real de carga de la página dada en segundos – ¡con el objetivo de afeitarse segundos este debería ser el verdadero objetivo!

Puede tener un sitio de carga rápida al 100% sin obtener puntajes perfectos y eso está muy bien.

La cascada

La cascada es una de las herramientas más útiles para detectar cuellos de botella en la velocidad de su sitio web. Le da una idea de cada solicitud HTTP en su sitio y dónde / qué tan rápido se carga.

Sin entrar en demasiados detalles, cada activo en su sitio es una solicitud HTTP separada. Un activo podría ser un archivo de imagen, una hoja de estilo CSS, un script, etc.

Si el cuadro de resumen de la prueba dice que su sitio tiene 26 solicitudes, eso significa que necesita cargar 26 activos diferentes. También significa que tendrá 26 entradas diferentes en el análisis de cascada.

Cada activo en su sitio debe buscarse, transferirse y mostrarse. Cada barra en la cascada muestra todos los pasos involucrados para cada activo y cuánto tiempo tomaron.

La carta de la cascada

Los pasos que puede seguir cada activo son los siguientes, con una pequeña explicación agregada:

  • Búsqueda de DNS: Hora de resolver el DNS
  • Conectando: Tiempo necesario para crear una conexión
  • Bloqueo: Tiempo pasado en la cola del navegador esperando una conexión
  • Enviando: Tiempo necesario para enviar la solicitud
  • Esperando: Tiempo empleado esperando la respuesta (tiempo hasta el primer byte)
  • Recepción: Tiempo necesario para descargar contenido

Con base en esta información, puede hacer algunas suposiciones sobre lo que está sucediendo con su sitio web.

En primer lugar, eche un vistazo a esa pequeña línea azul vertical en la cascada de arriba (en el lado derecho) Representa el punto en el que se cargó el DOM. La línea roja representa la hora en que se cargó la página.

El tiempo hasta el primer byte (TTFB) también se considera un indicador importante de la velocidad de su servidor, y se muestra en la información de espera en la cascada. Si constantemente ve un TTFB alto (incluso después de revisar y mejorar las recomendaciones principales para mejorar la velocidad del sitio), ¡es posible que su servidor host sea lo que lo decepciona!

El análisis en cascada es una de las partes más técnicas de GTmetrix, pero también es una de las más útiles. Si todavía no está seguro de cómo usarlo de manera efectiva, GTmetrix ofrece una guía detallada sobre cómo leer y analizar cada parte de la cascada.

Tiempos

los Tiempos La pestaña le brinda información sobre hitos específicos sobre cómo / cuándo se carga su página.

Mira, cuando la mayoría de la gente piensa en el «tiempo de carga de la página», piensan en una sola métrica. Pero en realidad hay diferentes definiciones de cuándo una página puede considerarse «cargada».

Por ejemplo, ¿se carga una página cuando todo el contenido de la mitad superior de la página es visible para los visitantes humanos? ¿O solo se carga una vez que todos los scripts de back-end finalizan la descarga, incluso si sus visitantes humanos no interactúan con esos scripts (p.ej. guiones de seguimiento)?

Cuando se trata de la experiencia para visitantes humanos reales en su sitio, estas son distinciones importantes. La mayoría de los humanos solo se preocupan por cuánto tiempo les lleva comenzar a ver contenido visible en la página; no necesariamente se preocupan por todo ese material de fondo. Su sitio puede demorar un tiempo en «cargarse completamente», pero si puede cargar el contenido visible rápidamente, sus visitantes seguirán pensando que su sitio se está cargando rápidamente.

Por eso, en su nuevo proyecto Core Web Vitals (que será un factor de clasificación SEO a partir de 2021), Google empuja una métrica llamada «La pintura con mayor contenido» en lugar de «tiempo de carga de la página».

los Tiempos La pestaña le ayuda a investigar todas estas métricas diferentes. Podrá ver las siguientes métricas:

  • Tiempo hasta el primer byte (TTFB)
  • Primera pintura
  • Primera pintura contenta
  • DOM interactivo
  • DOM cargado
  • En carga

La pestaña Tiempos

Otra cosa buena de esta pestaña es que también le dará explicaciones detalladas para cada métrica cuando pase el mouse sobre la métrica en cuestión:

Nota: este informe solo está disponible si se registra para obtener una cuenta GTmetrix gratuita.

Vídeo

los Vídeo La pestaña es otra herramienta útil que lo ayuda a medir cómo su sitio se carga a los humanos. Como con el Tiempos pestaña, puede ayudarlo a ir más allá del número de la línea superior y descubrir algunos de los siguientes:

  • ¿Cuándo es visible el contenido?
  • ¿Hay algún destello de contenido sin estilo? Por ejemplo, a veces la carga de una fuente personalizada tarda un tiempo, por lo que su texto «saltará» cuando cambie de una fuente del sistema a una fuente personalizada.
  • ¿Hay algún contenido grande «cambios»? A veces, el contenido «saltará» o «cambiará» a medida que se carguen activos adicionales. Probablemente haya experimentado esto en sitios de contenido donde el texto «salta» cuando el sitio carga un anuncio.

El último elemento es otra parte de los Vitales web centrales de Google: se llama ‘Cambio de diseño acumulativo (CLS)‘.

los Videos La pestaña le permite ver una grabación de pantalla de su sitio cargando con dos mejoras:

  • Puede ralentizar la grabación a 1/4 de velocidad, lo que le ayuda a ver más fácilmente cualquier cambio de contenido o destellos de contenido sin estilo.
  • Puede saltar a los principales hitos de sincronización, como First Contentful Paint.

Por ejemplo, así es como se ve el momento exacto de First Contentful Paint en WordPress.org:

Una grabación de video GTmetrix

Interesante, ¿verdad?

Debido a que Google está poniendo más énfasis en este tipo de métricas de carga de «experiencia del usuario», es una buena idea aprovechar esta función para que pueda detectar problemas.

Para tomar una grabación de video, deberá hacer dos cosas:

  1. Regístrese para obtener una cuenta GTmetrix gratuita.
  2. Enciende el Crear video establecer cuando ejecuta una prueba.

Cómo habilitar la grabación de video en GTmetrix

Historia

los Historia La pestaña le permite ver los resultados de múltiples pruebas en una página en un gráfico fácil de entender. Es útil para ver cómo cambian los tiempos de carga de la página con el tiempo.

La pestaña Historial de GTmetrix

También puede agregar notas, que es otra herramienta útil. Por ejemplo, si cambió a un nuevo host o plugin de almacenamiento en caché, podría agregar una nota en GTmetrix para ver cómo ese cambio afectó sus tiempos de carga.

Cómo configurar el monitoreo automático y las alertas con GTmetrix

Otra característica útil que obtiene con su cuenta GTmetrix es la capacidad de configurar un monitoreo automático del rendimiento. Puede usar la supervisión con una cuenta gratuita, pero es muy limitada y solo puede configurar pruebas automáticas desde el servidor de Vancouver, Canadá; no puede elegir las otras ubicaciones de prueba.

Puede elegir entre las siguientes frecuencias para hasta tres URL:

Para habilitar el monitoreo, haga clic en el Monitor botón en la parte superior de la página de resultados de la prueba para abrir una diapositiva y configurar cómo monitorear su sitio:

Cómo configurar la supervisión de GTmetrix

GTmetrix le enviará un resumen por correo electrónico de sus resultados, y también podrá verlos desde Historia lengüeta.

Si paga GTmetrix Pro, desbloqueará la capacidad de monitorear desde diferentes ubicaciones de prueba, así como las pruebas de monitoreo por hora y la capacidad de monitorear sitios web adicionales.

Una vez que habilite la supervisión, también podrá configurar alertas personalizadas; por ejemplo, puede recibir una alerta si el tiempo de carga de su página supera un cierto número, si su TTFB aumenta y muchas otras condiciones.

Puede configurarlos haciendo clic en el Configurar alertas botón en la interfaz de resultados de la prueba:

Cómo configurar alertas de GTmetrix

Razones para considerar los planes pagos de GTmetrix

Hasta ahora, todo lo que has visto está disponible con la versión gratuita de GTmetrix (aunque deberá registrarse para obtener una cuenta gratuita)

Sin embargo, GTmetrix también ofrece un plan premium. ¿Cuáles son algunas de las razones para ser profesional?

Ya viste una: más opciones para el monitoreo automático.

Otra característica útil es Developer Toolkit, que le brinda acceso a una serie de nuevas características:

  1. Pruebe los tiempos de carga en un dispositivo móvil físico: un Galaxy Nexus con Android.
  2. Simule otros dispositivos móviles como iPhones, iPads, etc. Nota: Esta función es solo una simulación, no podrá probar el rendimiento real del hardware como la prueba de Android.
  3. Elija diferentes resoluciones de pantalla o agentes de usuario.
  4. Guarde las configuraciones de prueba como preajustes.

Si está trabajando con clientes, también obtiene una función que le permite etiquetar informes PDF, lo que le brinda una manera fácil de proporcionar un producto de marca para los clientes.

GTmetrix Pro comienza en $ 14.95 al mes, con precios que aumentan a partir de ahí dependiendo de su uso.

Consejos de velocidad para usuarios de WordPress

Si usa WordPress, hay muchas estrategias que puede implementar para aumentar sus puntajes de GTmetrix y, lo que es más importante, reducir los tiempos de carga de la página.

Aquí hay algunas soluciones que puede implementar:

  1. Asegúrese de que el host web que esté utilizando use servidores que estén optimizados específicamente para WordPress, y, si todavía está utilizando un alojamiento compartido genérico no optimizado para WordPress, cambie a algo mucho, mucho más rápido, como un plan de alojamiento web de Motor WP, volante o Kinsta.
  2. Si aún no lo ha hecho, comience a utilizar un complemento de almacenamiento en caché de páginas, como W3 Total Cache, WP Super Cache o WP Rocket. Lea nuestra comparación de estos tres complementos para elegir la mejor opción para sus necesidades.
  3. Tómese un tiempo para revisar las imágenes de su sitio y asegurarse de que estén tan optimizadas como sea posible (vuelva a optimizarlas en un programa como Photoshop o considere usar un servicio / complemento especializado como WP Smush, ShortPixel o Imagify )
  4. Asegúrese de que su sitio no tenga JavaScript que bloquee el procesamiento. Los complementos gratuitos como Async JavaScript y Autoptimize pueden ayudarlo a optimizar el JavaScript de su sitio (ambos son del mismo desarrollador y se emparejan bien juntos)
  5. Por más doloroso que sea, elimine los perfiles innecesarios de redes sociales de la carga en su página (como Facebook, Twitter y LinkedIn, todo lo cual, literalmente, puede agregar segundos a los tiempos de carga de su página).
  6. Habilite la compresión gzip, minimice todos los scripts y aproveche el almacenamiento en caché del navegador siempre que sea posible.
  7. Quizás lo más importante de todo es que elimine todos los complementos innecesarios que puedan estar cargando todo tipo de archivos CSS y JavaScript dentro de sus páginas. Aunque técnicamente no hay límite para la cantidad de complementos que puede instalar en un sitio web con WordPress, una regla general muy general es: ¡cuantos más complementos, más lento será el sitio!

¿Alguna otra solución rápida súper efectiva? ¡Siéntete libre de dejarlos en los comentarios a continuación! 😉

Para un enfoque más profundo de la optimización de velocidad de WordPress, consulte estas dos guías detalladas:

Conclusión

Si desea un sitio web rápido, necesitará una herramienta integral para probarlo en varias circunstancias. GTmetrix te permite hacer exactamente eso. Al configurar el monitoreo y las pruebas automáticas desde diferentes ubicaciones, le dará una imagen completa del rendimiento de su sitio web.

Utilizado adecuadamente en la batalla contra las velocidades lentas del sitio, GTMetrix también le proporciona información más que suficiente para defenderse al analizar el rendimiento de su sitio y realizar mejoras.

¡Solo recuerde probar más que solo su página de inicio, probar cada página más de una vez y desde múltiples ubicaciones, y concentrarse en reducir esos tiempos de carga en lugar de maximizar los puntajes porcentuales de PageSpeed ​​y YSlow!

¿Conoce alguna otra / mejor forma de medir la velocidad de un sitio web? Pensamientos?