¿A qué velocidad se carga mi sitio web? Esta es una de las cuestiones centrales del rendimiento, la UX y la optimización de los motores de búsqueda. Para responder a esta pregunta, debes apoyarte en las herramientas adecuadas, porque sólo unas pocas herramientas proporcionan datos realmente buenos.
En la red hay artículos muy completos sobre herramientas que pueden utilizarse para medir el rendimiento y el tiempo de carga del propio sitio web de forma sencilla y, sobre todo, gratuita. Estas descripciones generales son muy útiles, pero a menudo cometen un error que puede provocar más confusión que claridad. Comparan entre sí dos o tres tipos de herramientas completamente diferentes y, a veces, no profundizan lo suficiente en las diferencias.
Esto puede llevar a intentar hacer comparaciones de rendimiento con datos totalmente inadecuados. Es una pena, porque quienes miden con las herramientas adecuadas se ahorran mucho tiempo y problemas.
Hay una diferencia que debes conocer al medir el rendimiento de un sitio web: la diferencia entre los análisis de potencial y las herramientas que miden el tiempo de carga de un sitio web. El primer grupo incluye pruebas como Google PageSpeed Insights y YSlow de Yahoo. Estas herramientas indican hasta qué punto el sitio web probado cumple los requisitos para una carga rápida de la página. Por tanto, ambos proporcionan una información excelente para la optimización onpage. Sin embargo, estas pruebas no miden el tiempo de carga de tu sitio web.
Pero sobre todo eso es lo que quieres saber: ¿cuánto tiempo tarda en construirse mi sitio web, en que la gente interactúe con él, en que yo gane dinero? Y aquí está el problema: por lo que sabemos, en realidad sólo hay dos herramientas gratuitas que proporcionen datos realmente buenos:
Por eso, a continuación te mostraré qué pueden hacer las herramientas de medición, cómo utilizarlas y cómo interpretar los datos para que puedas sacar el máximo partido de las mediciones.
Hay tres características que hacen que una herramienta de medición sea especialmente valiosa
Las herramientas que he mencionado son tan buenas porque proporcionan datos especialmente valiosos. Esto significa que los resultados de la medición:
- Consiste en los resultados de varios métodos de medición que se pueden comparar.
- Salir con un alto nivel de detalle.
- Se puede ajustar a través de varias opciones de configuración.
En la práctica, esto significa que con una buena herramienta de medición puedes establecer cómo mide el tiempo de carga del sitio web. Se trata principalmente de la elección del servidor de pruebas y su ubicación y, a veces, también de la elección del navegador de pruebas.
El nivel de detalle de los datos significa que no solo se da información sobre el tiempo, sino también una descripción detallada de lo que se midió realmente. Dos herramientas pueden perfectamente entender algo diferente por "tiempo de carga". Por supuesto, es aún mejor si se utilizan términos normalizados, como tiempo hasta el primer byte.
Y, por último, es bueno que no solo se mida el tiempo de carga de tu sitio web, sino que también se emita al mismo tiempo información sobre el número de peticiones HTTP, el tamaño de los paquetes de datos cargados o los resultados de posibles análisis. Así podrás ver rápidamente qué ajustes puedes hacer para optimizar el tiempo de carga.
Otras herramientas que conocemos solo ofrecen esas posibilidades de forma limitada o no las ofrecen en absoluto, por lo que pueden plantear problemas de comprensión y, por tanto, de interpretación. Para ti, sin embargo, estas ventajas también significan una desventaja decisiva: los datos no son tan fáciles de entender como, por ejemplo, los resultados de Google PageSpeed Insights.
Los datos de medición no siempre son fáciles de leer
La parte más desalentadora es sin duda el llamado diagrama de cascada, pero es precisamente esto lo que proporciona datos especialmente importantes. Por tanto, merece la pena examinar más detenidamente este tipo de diagrama.
En este post, primero explicaré WebPageTest con más detalle. Esta es una herramienta que puede proporcionar rápidamente información muy informativa sobre tu sitio web y también mide el tiempo de carga de tu sitio web.
Mi favorito: WebPageTest
webpagetest.org es rápido y muy fácil de usar. En principio, solo tienes que hacer dos cosas:
- Introducir primero el dominio que se va a probar.
- A continuación, selecciona la ubicación del servidor.
La ubicación del servidor es, además de la elección del navegador que se va a probar, uno de los ajustes más importantes para poder comprender cómo y con qué rapidez se construye tu sitio web en diferentes regiones del mundo. En estas pruebas, la ubicación del servidor indica desde qué lugar se accede a tu sitio web para medir la velocidad.
Asegúrate siempre de utilizar la misma ubicación del servidor, especialmente para las comparaciones de rendimiento. Solo entonces podrás comparar los resultados de forma significativa. Si el tiempo de carga de tu sitio web se mide una vez desde EEUU y otra desde Frankfurt, los tiempos de carga diferirán significativamente.
Cuando inicias la prueba, se expulsan tres grandes paquetes de datos después de unos instantes:
- Breve resumen: "Opportunities and Experiments"
- Cifras medidas de tu sitio web: "Observed Metrics"
- Pruebas individuales con diagramas de cascada
La primera parte, oportunidades y experimentos en español, te da consejos prácticos sobre qué partes de tu web funcionan bien y dónde se puede mejorar.
Aquí se te presentan evaluaciones y sugerencias de soluciones para diversos aspectos de tu web relacionados con el rendimiento, similares a las herramientas de Google o Yahoo. Es importante comprender que aquí no se midió el tiempo de carga del sitio web, sino el potencial de optimización del tiempo de carga.
El tiempo de carga del sitio web es el parámetro central con el que se pueden hacer comparaciones de rendimiento en particular. Es la respuesta directa a la pregunta: ¿Cómo de rápido carga mi sitio web? El número de peticiones HTTP también es adecuado para este tipo de comparaciones. La regla aquí es: cuantas menos peticiones HTTP, mejor.
La segunda sección consta de los números medidos, es decir, las métricas. Debajo está la acumulación visual de la página en forma de una serie de imágenes en pasos de 100 ms. Aquí también se denomina "filmstrip". Las imágenes que muestran un cambio significativo en el diseño de la página se resaltan en color.
La tercera parte muestra un resumen de las pruebas realizadas. Aquí, las peticiones HTTP y el contenido de tu sitio se desglosan por tipo y fuente. De este modo, puedes ver rápidamente si un determinado tipo de contenido, como las imágenes, ocupa mucho espacio o produce muchas peticiones y, por tanto, ralentiza tu sitio web.
El diagrama de cascada te muestra detalladamente el orden en qué orden se ejecutan las peticiones y cuánto tarda en cargarse cada una de ellas. El diagrama de cascada es, por tanto, una visión detallada del tiempo de carga del sitio web.
También encontrarás una leyenda al final de los resultados del test que explica el significado de los símbolos y colores.
En nuestro caso, verás en la parte superior el primer contacto con el servidor y luego los tiempos de carga de los scripts individuales.
De este modo, puedes mirar cada solicitud individual y compararla con otro valor medido. De este modo, puedes determinar si el tiempo de carga de tu sitio web ha mejorado tras una medida de optimización y, si es así, por qué factor.
Ventajas: rápido, relevante, informativo
En general, WebPageTest es una buena herramienta para medir el tiempo de carga de un sitio web. Puedes reconocerlo rápidamente:
- cómo de rápido carga la web
- qué tamaño tiene
- donde todavía hay potencial de optimización
- cómo se puede aprovechar este potencial
- cómo se construye el sitio web
Si esta información sobre WebPageTest no es suficiente para ti, te recomiendo que profundices un poco más.
Observa el tiempo de carga percibido
El tiempo de carga de un sitio web es importante, sin duda, tanto para la experiencia como para la conversión. No obstante, para la gente lo que importa no es el tiempo de carga real, sino la velocidad percibida del sitio web o, en otras palabras, el tiempo que se tarda en cargar por completo visualmente el sitio web. Esto se debe a que la web se experimenta sin conocer los valores medidos. El tiempo de carga percibido es, por tanto, un valor importante para optimizar la conversión y la tasa de rebote. Esto también puede medirse de forma fiable.
La conexión entre el tiempo de carga de la página y la tasa de conversión en las tiendas ha sido bien estudiada en el pasado. El resultado: cada segundo cuenta. Porque, por término medio, somos impacienten. Un tiempo de carga un segundo mayor puede suponer una tasa de conversión un siete por ciento menor.
Por cada segundo que tu web tarda en cargarse, pierdes ingresos. La optimización "above the fold" puede ser un antídoto, porque esta medida reduce el tiempo de carga percibido, lo que a su vez puede mejorar los índices de conversión.
En determinadas circunstancias, tu sitio web puede tardar diez, doce o trece segundos en cargarse, pero al cabo de solo tres segundos parece que está completamente cargado. Así, el sitio web se percibiría como mucho más rápido de lo que es.
Análisis de series temporales y función de vídeo para el tiempo de carga percibido
1) El análisis de las series temporales
Comparar el tiempo de carga de tu sitio web a lo largo de varios días o semanas puede ser muy informativo. Por ejemplo, si lo optimizas paso a paso durante varias semanas.
2) Análisis de vídeo: la mejor indicación del tiempo de carga percibido de la página
La función de vídeo o las series de imágenes, que toman una captura de pantalla a determinados intervalos durante el proceso de carga, son las más adecuadas para medir el tiempo de carga percibido. Puedes ver cuánto tiempo pasa hasta que se ve una representación visual. Lógico. Pero este sencillo truco te permite obtener una clara diferenciación entre el tiempo de carga medido y el percibido. WebPageTest ofrece esta función en la sección "Observed Metrics" como "Visual Page Loading Process".
GTmetrix
Me gustaría hablar brevemente de GTmetrix. Esencialmente, las dos herramientas WebPageTest y GTmetrix pueden hacer lo mismo. GTmetrix es tan fácil de usar como WebPageTest: introduces la URL del sitio web que quieres probar y la herramienta escupe el resultado al cabo de unos instantes. El inconveniente:
- GTmetrix solo ofrece una ubicación de servidor, Vancouver
- GTmetrix prueba sólo con Firefox
Esto significa que los resultados de las mediciones de GTmetrix se aplican siempre a un ordenador de sobremesa con Firefox en Vancouver. Mientras trabajes exclusivamente con GTmetrix para medir tu performance o rendimiento, esto no afecta a los resultados. Si quieres saber lo rápido que carga el sitio web para un público europeo, por ejemplo, debes utilizar una herramienta diferente.
Conclusión
Para el análisis del tiempo de carga, también es elemental la medición de la experiencia del tiempo de carga ya que permite comparaciones a un nivel abstraído de los meros datos. Solo podemos recomendar pruebas que permitan el análisis de vídeo o una funcionalidad comparable. En determinadas circunstancias, el tiempo de carga medido es bastante elevado, pero el tiempo de carga percibido es absolutamente justificable. El valor no solo te permite comprender mejor cómo se percibe tu sitio web, sino también si merece la pena optimizarlo con vistas al rendimiento. En determinadas situaciones, merece más la pena invertir en la optimización de la conversión que en el tiempo de carga del sitio web.
Cuando se trata de medir el rendimiento, WebPageTest es para nosotros/as lo último en herramientas de medición gratuitas.
¿Con qué herramientas has tenido hasta ahora la mejor experiencia en el análisis del rendimiento? ¿Has tenido alguna experiencia con otras herramientas de medición que puedan proporcionar datos aún mejores?
