¿Cómo medir y optimizar la velocidad de carga de nuestra web?

Categorias: Diseño Web

Quedaron atrás los tiempos en los que navegábamos por la red con nuestro módem de 56k, con su particular y entrañable ruido de inicio y el no tan entrañable tiempo de carga de webs con gran cantidad de contenido de información. Hoy día, nos aparece el site que cargamos milisegundos después de hacer click en la pantalla. Esto se debe a varios factores, desde cómo esté diseñada la web (cuan limpio sea el código) hasta el peso de las imágenes que carguemos en nuestra web.

¿Cómo medir y optimizar la velocidad de carga de nuestra web?

En este tutorial comprobaremos cómo comprobar la velocidad de carga de diversas maneras y realizar cambios para su mejora.

Desde el navegador

Con Chrome podemos comprobar de una manera simple el tiempo de carga de los elementos de la web. Es importante que limpiemos primero la caché del navegador para que nos aparezca una cifra real. Para comprobar este método, hacemos click con el botón derecho en la página y pinchamos en “Inspeccionar elemento”.

imagen varios

Hacemos click en la pestaña “Network” y actualizamos la página. Nos aparecerán una serie de datos de navegación y el tiempo, normalmente en milisegundos, que tarda la página en cargarse.

imagen varios

Con el navegador Firefox, podemos instalar el plugin Firebug para comprobar datos sobre la carga del sitio. Con este plugin integramos una serie de herramientas para desarrolladores con las que podemos editar, debuguear y monitorizar el CSS, HTML y JavaScript en vivo de cualquier página web.

imagen varios

Otro plugin que podemos instalar en Firefox es el Yslow, que analiza la página y nos sugiere distintas formas de mejorar el rendimiento basadas en una serie de reglas que establece la aplicación.

imagen varios

Herramientas Online

Vía online, podemos hacer una serie de tests que nos darán alguna pista de por dónde empezar a la hora de mejorar la carga de nuestra web. Hablaremos de las más nombradas:

Con Webpagetest podemos introducir nuestra URL para que haga un análisis con los tiempos de carga. Además, podemos configurar una serie de parámetros para que el análisis sea más eficiente.

imagen varios

Pingdom Tools no tiene opciones configurables, pero aún así nos dará un análisis bastante completo de los tiempos de carga de nuestra web, desglosándolo en varias pestañas.

imagen varios

PageSpeed Insights es una herramienta que Google pone a nuestro servicio y que nos ofrece informes detallados y consejos útiles con cambios que deberíamos realizar basándose en una serie de reglas preestablecidas. Recordemos que Google, a la hora de posicionar nuestra web, está teniendo en cuenta también el tiempo de carga de la misma.

imagen varios

Con aplicaciones de optimización

Existen varias herramientas de optimización para Gestores de Contenido como WordPress que diagnostican y dinamizan nuestra página, reduciendo el tiempo de carga de la misma. Uno de los más laureados es W3 Total Cache, un plugin muy avanzado para mejorar el rendimiento de nuestro sitio creado con WordPress, que requiere bastantes conocimientos para configurarlo de la forma que mejor rendimiento ofrezca.

imagen varios

Depurando nuestra web

Es la opción que depende de nosotros, de nuestros propios conocimientos y de la organización de nuestra página. Es saber qué y dónde se han producido cambios y de qué forma esos cambios pueden optimizarse. Hay una serie de factores que podemos tener en cuenta a la hora de realizar dichos cambios, como:

Quizás esta opción se quede lejos de la mano de muchos usuarios, y si queremos profesionalizar nuestra web necesitemos que alguien nos haga el servicio por nosotros. Desde Hostinet ofrecemos una serie de planes de desarrollo y diseño web que quizás te puedan interesar.