(+34) 91 668 45 71 info@onlinezebra.com

El algoritmo de Google y el usuario tienen una cosa en com√ļn. A ambos les encanta que tu sitio web cargue r√°pidamente. Es por ello, que la optimizaci√≥n de la velocidad web cumplir√° una doble funci√≥n. Por una parte, mejorar el posicionamiento org√°nico en Google, y por otra, ofrecer una buena experiencia de usuario.

En este post, queremos hablaros de manera más extensa sobre qué implica que un sitio web tenga optimizados los tiempos de carga, puesto que puede ser un factor que condicione el éxito de cualquier sitio web.

Y t√ļ ¬Ņsabes si tu p√°gina web carga al instante? ¬ŅHas realizado en alguna ocasi√≥n alg√ļn test de velocidad web? Hoy te contamos todo lo que debes saber sobre dos herramientas online y gratuitas para medir la velocidad de una p√°gina web: GTmetrix y PageSpeed. Continua leyendo para conocer m√°s acerca de estas herramientas.

¬ŅQu√© es la velocidad web?

Es muy probable que como usuario te haya ocurrido en m√°s de una ocasi√≥n. Encuentras un enlace o p√°gina web que te resulta interesante, haces clic en √©l y seguidamente te aparece una pantalla en blanco que tarda varios segundos en responder. ¬ŅQu√© ocurre entonces? Probablemente abandones el sitio web, antes de haber visualizado su contenido, dirigi√©ndote al siguiente enlace que resuelva tu consulta.

Esto, que es m√°s habitual de lo que piensas, ocurre porque los tiempos de carga web, no se encuentran optimizados. Por este motivo, un usuario que hemos conseguido atraer de manera org√°nica, o bien recomendado, hacia nuestra p√°gina web, ha abandona la misma porque hemos tardado demasiado tiempo en ofrecerle nuestro contenido, y por tanto, ha ido a buscarlo a otras p√°ginas de la competencia.

Podemos definir la velocidad web, como el tiempo que tarda una p√°gina web en descargar todo el contenido y mostrarlo en la ventana del navegador del usuario. Un tiempo de carga web aceptable, ronda los 2-3 segundos. Si tu sitio web excede este tiempo, es recomendable que puedas optimizarlo.

¬ŅPor qu√© influye la velocidad de carga en el √©xito de un sitio web?

  • Minimizar la tasa de rebote

Hace referencia a aquellas visitas que llegan a tu sitio web, y salen de él, sin llegar a haber interactuado con el mismo. Uno de los principales factores que afecta al hecho de tener un porcentaje de rebote elevado, es la velocidad web. Como comentamos anteriormente, el usuario no suele esperar más de 3 segundos segundos a que la web haya cargado por completo.

  • Conseguir la fidelizaci√≥n de los usuarios

Cuando un usuario tiene una mala experiencia en un sitio web, es bastante frecuente que no vuelva a interactuar con él. Por ello, una buena optimización de carga puede llegar a fidelizar a nuestros usuarios, convirtiéndolos en recurrentes.

  • La velocidad de carga influye en la conversi√≥n

Si tu velocidad de carga es lento, es muy posible que tu porcentaje de conversión se vea disminuido. Como hemos comentado, el usuario puede llegar a abandonar el proceso de compra, si detecta que debe esperar mucho tiempo en la carga de un sitio web.

  • Mejorar la usabilidad m√≥vil

Los usuarios de dispositivos móviles son mucho más exigentes, en cuanto a la velocidad de carga se refiere. Por ello, si buscamos una buena experiencia de usuario a nivel móvil, debemos tener en cuenta la optimización al máximo de nuestros tiempos de carga.

GTmetrix VS PageSpeed

Si estás pensando en mejorar los tiempos de carga de tu sitio web, existen algunas herramientas online, que de manera gratuita nos permiten realizar un test de velocidad para páginas web, ofreciendo recomendaciones sobre cómo mejorarla. A continuación, te hablaremos sobre algunas de ellas

GTmetrix

Se trata de una completa herramienta que nos permitirá analizar con profundidad un sitio web, creando informes personalizados. Es posiblemente una de las más conocidas y utilizadas hoy en día.

No requiere registro para ser utilizada, no obstante, si optamos por registrarnos podremos obtener un hist√≥rico sobre las URL¬īs que analicemos y comprobar as√≠, la efectividad de las medidas que vayamos aplicando. Lo primero que deber√°s hacer es introducir la URL que quieres analizar.

 

herramienta velocidad web

 

A continuaci√≥n, obtendremos un informe completo de nuestro sitio sobre diferentes factores que afectan a la velocidad de carga. ¬ŅSabes c√≥mo interpretar estos datos? Te contamos algunos de los principales indicadores que utiliza esta herramienta.

  1. Test Server Region: La ubicación del servidor desde el cual se realizan las pruebas.
  2. Using: El navegador m√°s recurrente, y por tanto, donde se est√°n realizando las pruebas.
  3. Connection: El tipo de conexión que estaría simulando el test.
  4. Analysis Options: Puedes incluir en la simulación un vídeo, o en el caso, de que quieras evitar que se tengan en cuenta los anuncios de tu sitio web.

Lo siguiente que nos encontraremos, ser√° aquello que podemos denominar ‚ÄúPuntuaci√≥n de rendimiento‚ÄĚ o ‚ÄúPerformance Score‚ÄĚ. En este apartado, nos encontraremos diferentes puntos que habr√° que analizar.

  1. PageSpeed Score: Se trata de la puntuaci√≥n total sobre 100 que ha obtenido tu sitio web. Si tienes una puntuaci√≥n de tipo A significa que tu sitio web se encuentra optimizado a los ojos de Google, en cuanto a velocidad web se refiere. A partir de esa puntuaci√≥n, B, C en adelante, te mostrar√° algunas recomendaciones.¬ŅEn base a qu√© par√°metros se obtiene dicha puntuaci√≥n? Repasamos los mensajes m√°s importantes que nos proporciona la herramienta para mejorar tu velocidad web.
    • Combine Images Using CSS Sprites: GTmetrix te mostrar√° una serie de URL¬īs para cada imagen que deber√°s mejorar, por ello te recomienda la instalaci√≥n de un plugin o la implementaci√≥n de un c√≥digo CSS.
    • Defer Parsing of JavaScript: Tiene relaci√≥n con aquellas animaciones implementadas en tu sitio web. GTmetrix nos recomendar√° instalar un plugin que solucione el bloqueo de la carga de los Javascripts.
    • Serve Scaled Images: Tiene que ver con el escalado que estemos utilizando en las im√°genes que cargan en nuestro sitio web. Esto puede ocurrir, porque subas una imagen con un tama√Īo muy superior al que se va a mostrar en la web, por lo que te recomienda ajustar dicho tama√Īo.
  2. YSlow Score: Hará referencia a la puntuación total sobre 100, pero en este caso para Yahoo. YSlow Score nos proporcionará información sobre más de 34 parámetros que afectan al rendimiento web, entre ellos, Javascript, datos del servidor, cookies o imágenes.

herramienta velocidad web

A continuaci√≥n, el apartado denominado ‚ÄúPage details‚ÄĚ o ‚ÄúDetalles de p√°gina‚ÄĚ, nos ampliar√° algo m√°s de informaci√≥n acerca de nuestro sitio web.

  1. Page Load Time: Se trata del tiempo de carga de una p√°gina medido en segundos. Cuanto menor sea este valor, mejor ser√° considerado un sitio web. Para que nuestro an√°lisis sea lo m√°s fiable posible, es recomendable realizar dicho an√°lisis 3-4 veces, pudiendo sacar la media de estos resultados.
  2. Total Page Size:Har√° referencia al tama√Īo total de tu p√°gina teniendo como medida de referencia los Kylobytes o Megabytes. Los elementos que suelen aumentar el peso de una URL son v√≠deos e im√°genes.
  3. Request:Indica la cantidad de peticiones que son necesarias para construir por completo la URL que se est√° analizando. Son un conjunto de advertencias que deberemos llevar a cabo para mejorar alg√ļn aspecto de la web.

Tanto para analizar el sitio web en Google como en Yahoo, GTmetrix, nos ofrecer√° una serie de par√°metros y recomendaciones, que deberemos seguir para mejorar nuestra velocidad de carga. √Čstas, se encontrar√°n en un desplegable, siguiendo la misma puntuaci√≥n comentada anteriormente. Aquellas recomendaciones que cuenten con un grado A, significar√° que ya las estamos llevando a cabo. Por lo contrario, a partir de la puntuaci√≥n B, C, D y en adelante, significar√° que a√ļn hay margen de mejora.

PageSpeed

En Pagespeed Insights, encontramos una muy potente herramienta, que Google pone a nuestra disposición para analizar el rendimiento y tiempos de carga de un sitio web. Al igual que GTmetrix, viene siendo una de las más utilizadas hoy en día. El primer paso, será introducir la URL a análisis.

test de velocidad web

 

Lo primero que nos encontramos, es que esta herramienta nos ofrece dos versiones, el análisis de la carga web a través de un dispositivo móvil, y por otro lado, a través de un ordenador.

Para cada una de ellas, nos muestra una puntuación sobre 100 acerca de nuestra velocidad web. Los datos serán mostrados de la siguiente manera: En rojo, aquellos que debemos corregir, en amarillo aquellas sugerencias que deberíamos tener en cuenta y en verde aquellos aspectos que ya estás realizando correctamente. A continuación, nos encontramos con algunas métricas, que será interesante analizar.

  1. Datos de campo: Nos indica una primera aproximaci√≥n del tiempo de carga de la web durante el √ļltimo periodo, en torno a unos 30 d√≠as. Este dato lo comparar√° con el rendimiento de otras webs incluidas en el informe de Chrome User Experience Report. Los resultados se mostrar√°n a trav√©s de una escala de colores, representando c√≥mo se ha cargado la web para los diferentes usuarios.
  2. Datos de experimento: La herramienta simulará un test de carga, ofreciendo algunas métricas sobre el rendimiento web.
    • Primer renderizado con contenido: Indica el momento en el cual se renderiza la primera imagen o texto.
    • √ćndice de velocidad: Mide lo r√°pido que se hayan llenado los blancos de los contenidos
    • Tiempo hasta que est√° interactiva: Cu√°nto tarda la web en estar interactiva al 100%
    • Primer renderizado significativo: El tiempo que ha tardado el sitio web en cargar el contenido principal.
    • Primer tiempo inactivo de la CPU: La primera vez que el hilo principal de la p√°gina est√° el suficiente tiempo inactivo como para recibir acciones por parte del usuario.
    • Latencia potencial m√°xima de la primera interacci√≥n: La latencia de la primera interacci√≥n que pueden llegar a experimentar los usuarios cuando se produce la tarea m√°s larga.
  3. Oportunidades: En esta sección, la herramienta nos muestra una serie de recomendaciones para optimizar nuestro rendimiento web. Incluye también, una estimación de la rapidez que se ganaría, si dichas mejoras fueran implementadas.
  4. Diagnóstico: En este apartado se incluyen algunas mejoras más técnicas que tienen que ver con el desarrollo web.
  5. Auditor√≠as aprobadas: Por √ļltimo, nos mostrar√° un resumen sobre aquellos test que el sitio web haya superado correctamente. Es decir, par√°metros que nuestra web tenga ya optimizados.

test carga web

 

Comparativa GTmetrix Vs PageSpeed

¡Ha llegado el momento de que ambas herramientas entren a combate! Queremos comprobar qué puntos fuertes y qué debilidades presenta cada una de ellas. Para ello, hemos realizado un análisis exhaustivo sobre los datos que nos proporciona cada una de ellas.

 

Puntuación global

Ambas difieren en la manera en la que muestran los resultados al usuario. Aunque las dos herramientas utilizan un sistema de color a la hora de indicar cada una de las puntuaciones, es necesario destacar cómo de amplio es el rango para cada una de ellas.

En el caso de PageSpeed, observamos cómo categorizada los resultados en tres colores diferenciados, indicando aquello que debemos corregir (rojo), las sugerencias para mejorar nuestra velocidad de carga (naranja) y aquellos aspectos que ya realizamos correctamente (verde). Para GTmetrix, este rango de puntuaciones será más amplio (A, B, C, D, E, F…), estableciendo de esta manera, una forma más fácil de establecer prioridades a la hora de ir realizando las correcciones que nos sugiere la herramienta.

 

Características de la simulación

Es importante tener en cuenta a la hora de revisar los resultados de un test de velocidad web, ciertas características sobre cómo se ha producido su simulación. Principalmente la ubicación, el navegador y el dispositivo.

Es posible que la ubicación desde donde se realiza la prueba, afecte a los resultados del rendimiento. Por ello, si quieres ajustar lo más posible la simulación de tu audiencia, te recomendamos que escojas la herramienta con la ubicación de prueba más cercana. GTmetrix, suele escoger por defecto Canadá, y en el caso de PageSpeed no permite seleccionar la ubicación.

El tipo de dispositivo, ser√° otro factor de gran importancia. Como hemos visto anteriormente, en el caso de PageSpeed, contamos la posibilidad de poner escoger entre la opci√≥n de visualizaci√≥n de datos para m√≥vil o para ordenador. En cada uno de ellas, observaremos tiempos de carga diferenciados, as√≠ como las recomendaciones a seguir seg√ļn el dispositivo. Esto se diferencia de la manera en que GTmetrix nos muestra dicha informaci√≥n, puesto que la versi√≥n gratuita nos proporcionar√° datos de la versi√≥n Deskpot.

Además, la versión gratuita de GTmetrix nos proporcionará por defecto datos acerca de la velocidad de nuestra web en Google Chrome. PageSpeed irá un paso más allá, mostrándonos los tiempos de simulación, también en Yahoo.

 

Tiempos de mejora

Un aspecto a tener en cuenta, es cómo en el caso de PageSpeed nos proporciona ciertos datos que nos permiten ver el margen de mejora de nuestra web si realizáramos una acción en concreto. Esto viene reflejado a través del ahorro estimado en segundos. Nos puede ayudar a la hora de hacernos una idea de qué acciones pueden proporcionarnos una mayor mejora en el tiempo de carga de nuestra web.

 

Clasificación de mejoras

En el caso de GTmetrix, es necesario destacar c√≥mo cada una de las sugerencias de mejora se encuentran clasificadas seg√ļn el tipo: contenido, servidor, im√°genes, js o css. Esto nos puede ayudar a la hora de ir revisando cada una de ellas o para derivar a ciertos departamentos su optimizaci√≥n.

 

An√°lisis de los tiempos de carga

Como hemos visto anteriormente para cada una de las herramientas, ambas nos ofrecen información sobre el tiempo que invierte nuestra web en cargar por completo. En el caso de PageSpeed, nos ofrecerá ciertos datos del experimento, donde veremos de qué manera se van cargando en cascada cada uno de los elementos. GTmetrix, irá un paso más allá, mostrándonos uno a uno los recursos en los que tu URL invierte su tiempo de carga.

 

Una vez hemos visto las posibilidades que nos ofrecen ambas herramientas, queremos comentar algunas consejos a la hora de interpretar sus resultados que nos parecen relevantes.

  • Cada una de estas herramientas eval√ļa los sitios web en funci√≥n de su propio conjunto de recomendaciones, con lo cual, a la hora de analizarlas, es posible que alguna de ellas hayan sido personalizadas o modificadas.
  • Es importante comprender c√≥mo funciona cada herramienta, a la hora de analizar cualquier tipo de resultado. Esto tiene que ver por ejemplo, con la posibilidad de regular el tipo de conexi√≥n o modificar la resoluci√≥n de pantalla, para una simulaci√≥n en concreto. Por este mismo motivo, conocer el modo en que cada herramienta interpretada los indicadores, as√≠ como el propio escenario de simulaci√≥n, nos ayudar√° a entender mejor sus recomendaciones.

Llegados a este punto, en función de tu proyecto y necesidades, debes escoger cuál crees que responde mejor los parámetros que buscas medir, así como a su escenario de simulación, pudiendo combinar ambas en todo momento.

 

¬ŅCu√°les crees que son los puntos fuertes de cada una de ellas? Te leemos en comentarios.

 

En Online Zebra, somos conscientes de que uno de los puntos que más tiene en cuenta Google a la hora de posicionar tu web, es que ésta cuente con una óptima velocidad de carga. Por ello, asesoramos a nuestros clientes para conseguir sus páginas web carguen en el menor tiempo posible. ¡Conoce más sobre todo lo que las optimizaciones SEO pueden hacer por tu web!

Abrir chat
¬ŅNecesitas ayuda?