Sé que tengo ancho de banda de sobras, sé que el servidor donde hospedo mi web tiene capacidad de sobras y tampoco estoy bajando archivos del tamaño de una Wikipedia. Sin embargo, al cargar mi página web parece que mi conexión va a pedales. ¿Qué está pasando?

¿Sabes si tu página web está optimizada para que cargue como un tiro? Page Speed es tu juguete para estas navidades.

Somos impacientes. Queremos páginas rápidas

Si hay algo que nos desespera mientras navegamos por Internet es toparnos con una web que tarda en cargar.

Según recientes estudios en la materia, tenemos una tolerancia de 2 segundos antes de abandonar una página si esta no se ha cargado. Si bien este valor me parece un tanto excesivo, si es cierto que reducir al máximo el tiempo de carga de una página mejora de forma directa la experiencia de navegación. Sin embargo, una carga lenta no sólo afecta a la experiencia del usuario sino al grado de confianza que este depositará en el sitio web y, por extensión, en la marca.

Puede parecer que la velocidad de carga de una web sólo depende de factores como el ancho de banda con el que navegamos o la capacidad del servidor donde la web esté hospedada. Sin embargo, optimizar el propio sitio web ayuda a reducir drásticamente su tiempo de carga.

Si quieres que tu web “vuele”, puedes probar utilizando Page Speed.

Page Speed, test de velocidad y diagnóstico.

Page Speed es un Add-on para Firefox que nos permite realizar tests de rendimiento sobre páginas web. Esta evaluación de rendimiento se basa en la medición del tiempo de carga de la página y una vez que concluye mostrará un listado de las incidencias encontradas así como una serie de consejos para su solución.

El test realiza una serie de comprobaciones a fin de validar que se están cumpliendo las mejores prácticas para el rendimiento de la web. Un resumen:

• Uso de la caché: validará si estamos permitiendo que algunos elementos del sitio web, como CSS, imágenes o JavaScript, sean almacenados en la caché del navegador.
• Tiempos de respuesta: validaciones con el fin de reducir los tiempos de respuesta cliente/servidor.
• Tamaño de cookies: verifica que el tamaño de las cookies a enviar tienen un tamaño adecuado.
• Tamaño de paquetes: comprobaciones sobre el tamaño de los datos que se transmiten. Page Speed validará, por ejemplo, si estamos usando ficheros JavaScript y CSS compactados o si las imágenes han sido escaladas y optimizadas para la web.
• Rendering de la página: comprueba la simplicidad del código para que este sea eficientemente interpretado por el navegador.

El resumen de incidencias se presenta en forma de lista ordenada según prioridad de cambio.

Veamos un ejemplo.

Caso práctico

Para poder utilizar Page Speed es necesario haber instalado antes FireBug para Firefox.

Para realizar un test, primero hay que ir a la página que se quiere evaluar. Una vez que el navegador haya cargado la página podremos lanzar el test: Abrir FireBug > Pulsar sobre la pestaña “Page Speed” > Pulsar en “Analyze Performance”.

Los resultados del análisis de rendimiento se presentan del siguiente modo:

La herramienta, además de especificar el grado de repercusión para cada incidencia, también explicita que ratio de mejora comportaría la solución.

Por ejemplo, en la imagen inferior se ven los detalles para la incidencia “Minify CSS”. En primer término tenemos un resumen donde ya podemos ver un par de datos interesantes: el tamaño total que podríamos ahorrar en caso de solucionar la incidencia, así como el porcentaje de optimización que supone. Esta información también se detalla para cada una de las sub-incidencias, en este caso para cada una de las hojas de estilo afectadas. No sólo eso, sino que para hacernos la vida más fácil, Page Speed nos da un enlace directo a la versión optimizada para cada CSS, JavaScript e incluso imagen pendiente de ser optimizada para la web.

En resumen…

Descarga Page Speed y échale un vistazo. Muy probablemente, estrenes el 2010 con una web más rápida de lo que era hasta ahora

Bonus

Si quieres jugar a ver quién es el más rápido, prueba con Website Speed Test. Puedes poner varios dominios a la vez y la herramienta comprobará cuales son los tiempos de carga. Ojo, google.com suele hacer pole.

¡Esperamos vuestros comentarios! Puedes seguirme en twitter @drodriguezlopez

Tags | optimización de web, tiempo de carga