En este artículo, encontrarás las mejores prácticas para optimizar la velocidad de tu sitio web. Para ello, también te mostraremos cómo realizar pruebas de velocidad precisas y eficaces con algunas de las herramientas más potentes disponibles en el mercado actual.

¿Por qué es importante la velocidad de un sitio web?

La velocidad de su sitio web tiene un tremendo impacto en las clasificaciones de búsqueda orgánica. No es de extrañar si tenemos en cuenta que el tiempo de carga tiene un efecto directo en la experiencia del usuario. Incluso si tiene un sitio web completo y bien estructurado, si los usuarios tienen que esperar para ver su contenido, esto perjudica su percepción del rendimiento de su sitio. Un sitio web lento pierde rápidamente su atractivo, afectando negativamente a la tasa de rebote y al número de páginas vistas por sesión.

Hay varios factores fuera de nuestro control que condicionan la velocidad de carga. Por ejemplo, el tipo de dispositivo utilizado por el buscador y su CPU, el navegador o la conexión a Internet ciertamente afectan al tiempo de carga. Sin embargo, un usuario percibirá una mejor o peor experiencia al comparar la navegación entre diferentes sitios web.

Ahora que ha visto lo vital que es la velocidad del sitio, echemos un vistazo a algunas de las mejores herramientas gratuitas de prueba de velocidad del sitio web disponibles actualmente.

Herramientas gratuitas para realizar un test de velocida de carga de tu web

1. GTMetrix

GTMetrix proporciona informes detallados del rendimiento de la velocidad de su sitio web utilizando Google Page Speed e YSlow. Esta herramienta gratuita analiza sus páginas, les da una puntuación y ofrece recomendaciones prácticas sobre cómo mejorarlas.

2. Pingdom

Con Pingdom, puede comprobar al instante el rendimiento de la velocidad de su sitio web seleccionando la ubicación desde la que desea realizar la prueba. Es ideal tanto para los expertos como para los novatos. Obtendrá una calificación general de sus páginas web, así como algunas sugerencias para optimizarlas.

3. Web.dev

Web.dev ofrece amplia información sobre el rendimiento, la accesibilidad y SEO de su sitio web. Utiliza Lighthouse, una herramienta automatizada de código abierto para auditar la calidad de sus sitios. Cada métrica analizada cuenta con una guía completa para ayudarle a mejorar su puntuación.

4. Webpagetest.org

Webpagetest le permite ejecutar una prueba de velocidad desde múltiples lugares del mundo y seleccionar cualquier navegador. Puede elegir entre ejecutar un análisis simple o una prueba avanzada, que proporciona uno de los diagnósticos más ricos entre las herramientas de prueba de velocidad disponibles en el mercado.

5. Información sobre la velocidad de las páginas

Pagespeed insights (PSI) es una herramienta diseñada por Google que analiza el contenido de tu sitio web y sugiere cómo puedes mejorar tu velocidad. Esta herramienta califica tus páginas de 0 a 100. Ofrece numerosos consejos para acelerar tu sitio web con pautas completas.

6. Google Search Console (informe Core Web Vitals)

Puedes obtener el informe de Core Web Vitals en el Google Search Console para comprobar la rapidez con la que funcionan tus páginas. Éste se encuentra en la sección "Mejoras" y te ayuda a encontrar rápidamente problemas que ralentizan el tiempo de carga de tu página. Una ventaja de usar esta herramienta es que puedes rastrear tus datos históricos sobre las mejoras realizadas.

¿Qué métrica deberías rastrear?

Hay varias métricas clave que debes saber para optimizar la velocidad de tu sitio web. Estas son las métricas que la mayoría de las herramientas tienen en cuenta para evaluar el rendimiento del sitio. Te da una idea de cuánto tiempo los visitantes deben esperar para recibir tu contenido.

Recientemente, Google ha lanzado Web Vitals, una extensión del chrome para verificar el correcto funcionamiento de los elementos comunes de las páginas y la calidad de la experiencia del usuario durante la navegación.

Web Vitals cuantifica la experiencia del usuario en tu sitio web. Son mediciones usadas por Google como señales de calidad para evaluar el UX que ofrece tu sitio web. Google resalta el núcleo de los Web Vitals como la métrica más significativa que todo sitio debe rastrear. Hay tres Core Web Vitals que reflejan la velocidad de carga de la página, la interactividad y la estabilidad visual.

• Largest Contentful Paint (LCP): Mide el rendimiento de carga de la página. Para proporcionar una buena experiencia al usuario, los sitios web deben mostrar el primer frame del contenido en 2,5 segundos.
• Retraso en la primera entrada (FID): Evalúa la capacidad de respuesta o interactividad de una página web. Mide el período de tiempo entre el momento en que un visitante interactúa por primera vez con su página (hace clic en un botón o un enlace) y cuando el navegador responde a esa interacción. Google sugiere un FID de menos de 100 milisegundos.
• Cumulative Layout Shift (CLS): Esto comprueba la estabilidad visual. Tiene en cuenta la frecuencia con la que el UX cambia de diseño inesperadamente. Un CLS de menos de 0.1 se considera una buena experiencia para el usuario.

Cómo ejecutar correctamente las pruebas de velocidad de una página web

Ahora dispones de varias herramientas de alta calidad para comprobar la velocidad de tu sitio web. Veamos algunos puntos que debes tener en cuenta para realizar un análisis eficaz.

Elije el lugar correcto

Selecciona la ubicación más cercana a tu país de destino. Quieres que los resultados de la prueba sean lo más precisos posible. Para ello, debes seleccionar (siempre que sea posible) la ubicación para realizar la prueba más cercana al servidor de tu sitio web, que también debería coincidir con la zona donde se encuentra tu público objetivo.

La ubicación del servidor altera el LCP mencionado anteriormente y la latencia de la red. La latencia de la red es el tiempo de ida y vuelta desde el navegador hasta el servidor. Debes probar tu sitio siempre desde la misma ubicación para poder conocer el progreso de tu rendimiento de velocidad.

Realiza múltiples pruebas

Es conveniente ejecutar la prueba varias veces para permitir la acumulación de caché.

Además, ten en cuenta que los valores de las pruebas pueden diferir ligeramente en función de la herramienta utilizada. Fíjate en la media de las puntuaciones para obtener una estimación cercana a la realidad.

Estas prácticas aseguran resultados de pruebas de velocidad consistentes.

Testea páginas específicas

Se recomienda realizar pruebas específicas en los tipos de páginas más relevantes de tu sitio web. Prueba la velocidad de tu página de inicio, de las páginas de productos, de las entradas del blog, etc. De esta manera podrás saber si tiene un problema con un tipo de página en particular. Tal vez tengas que rediseñar el formato de presentación del contenido en una determinada categoría.

10 consejos prácticos para mejorar la velocidad de tu página

Ahora que ya sabes cómo evaluar de forma concisa la velocidad de tu página, veamos qué acciones puedes llevar a cabo para mejorar el rendimiento de tu web.

1. Elije un hosting que se adapte a tus necesidades

Elegir el proveedor de hosting adecuado puede reducir considerablemente el tiempo de respuesta del servidor. Existen diferentes tipos de servicios de alojamiento. Entre los más populares se encuentran los siguientes:

• Hosting compartido
• Hosting VPS (Virtual Private Server)
• Servicio de alojamiento dedicado (o dedicated server hosting)
• Alojamiento en la nube (o cloud hosting)
• Alojamiento gestionado (o managed hosting)
• Hosting de colocación (o colocation hosting)

Aunque puedes empezar con un alojamiento compartido, que suele ser el más económico, tendrás que actualizar a un servicio de alojamiento más potente a medida que aumente tu tráfico web.

Comprueba regularmente las necesidades de tu sitio web para asegurarte de que dispones de un servicior de alojamiento adecuado.

2. Utilizar un CDN

Una red de distribución de contenidos (CDN) es una red de servidores distribuidos geográficamente que trabajan juntos para acelerar la entrega de contenidos en Internet.

Además del alojamiento de tu sitio web, puedes considerar la posibilidad de contratar un CDN para reducir la velocidad de carga de tus páginas. Esta práctica es especialmente beneficiosa para los sitios web con un alto volumen de tráfico procedente de diferentes zonas geográficas del planeta.

Cuando un usuario solicita el contenido de tu sitio web, la CDN lo devuelve a través del servidor más cercano a la ubicación del usuario, acortando la distancia que debe recorrer la información. De este modo, se acelera la entrega del contenido.

3. Mantén tus páginas ligeras

El tamaño de tus archivos influye directamente en la velocidad del sitio web, así que intenta reducirlos al máximo. Para ello, empieza por comprimir tus archivos utilizando Gzip, uno de los métodos de compresión más populares. Esta aplicación puede reducir el tamaño de HTML, CSS y JavaScript de forma significativa. También puedes activar GZIP con WP Rocket o W3 Total cache si utilizas WordPress.

Otra forma de mejorar la velocidad de carga de tu página es optimizando tus imágenes. Debes mantenerlas en el menor tamaño posible sin comprometer su calidad.

Además, puedes utilizar lazy loading para que tus imágenes no se carguen todas a la vez, sino a medida que el usuario navega por la página. Esta técnica permite a los usuarios acceder a la página más rápidamente sin tener que esperar a que se carguen las imágenes.

4. Aloja tus vídeos en servicios de terceros

Aunque los vídeos son un apoyo visual increíble para tu página web, no debes permitir que afecten al tiempo de carga de tus páginas.

La mejor manera de mostrar vídeos en tu web es mantenerlos en algún servicio de terceros como YouTube, Vimeo o Wistia.

5. Habilita la caché del navegador

El caché es una forma sencilla de acelerar el tiempo de carga de tu página. Al activar la caché, permites que los navegadores almacenen los archivos de tu sitio web en los ordenadores de los usuarios para que no tengan que volver a cargarlos la próxima vez que visiten tu sitio.

Algunos de los plugins de caché más populares de WordPress son W3 Total Cache, WP Rocket o LiteSpeed Cache.

También puedes habilitar el almacenamiento en caché en tu archivo .htaccess si tienes un sitio HTML estático.

6. Elimina los plugins innecesarios

La eliminación de los plugins innecesarios hará que tu sitio sea más ágil y te ayudará a identificar los problemas más rápidamente. Por lo tanto, es esencial realizar un mantenimiento regular de tus plugins y eliminar aquellos cuyo servicio ya está cubierto por otros o que ya no utilizas.

7. Reduce las redirecciones

Ten en cuenta que hay una petición HTTP adicional por cada redirección en tu web. La existencia de un par de redirecciones puede ser apenas perceptible, pero tener bastantes perjudica la velocidad de tu sitio. Por lo tanto, debes reducir el número de redirecciones al mínimo posible si es que no puedes eliminarlas por completo.

Para supervisar tus redirecciones, te recomendamos que utilices un rastreador SEO como FandangoSEO. La herramienta enumera sus redireccionamientos para que pueda comprobarlos rápidamente y determinar si todavía sirven para algo. También es útil para identificar cualquier cadena de redirecciones.

8. Aplazar la carga (defer parsing) de JavaScript

Al aplazar los archivos javascript, dejas que otros elementos se carguen antes. Esta práctica evitará que se bloquee la descarga de otros activos, lo cual podría perjudicar la velocidad de carga de la página.

De nuevo, si tienes un sitio web de WordPress, utiliza un plugin como WP Rocket para activar la carga diferida de JavaScript.

Si tiene un sitio web HTML estático, puedes utilizar la siguiente técnica.

Paso 1: Copia el siguiente código antes de la etiqueta en tu HTML.

<script type="text/javascript">

    function downloadJSAtOnload() {

        var element = document.createElement("script");

        element.src = "example.js";

        document.body.appendChild(element);

    }

    if (window.addEventListener)

        window.addEventListener("load", downloadJSAtOnload, false);

    else if (window.attachEvent)

        window.attachEvent("onload", downloadJSAtOnload);

    else window.onload = downloadJSAtOnload;

</script>

Paso 2: Sustituye example.js en el código por el archivo de script a diferir.

Paso 3: Guarda los cambios.

9. Optimiza el CSS y el JavaScript

La minificación de CSS y JavaScript consiste en eliminar los caracteres innecesarios y reducir el tamaño de los archivos para que se carguen más rápido. Se trata de eliminar los comentarios que han dejado los desarrolladores (que no importan a los motores de búsqueda), los espacios en blanco o los caracteres de nueva línea. También se pueden acortar los nombres de las variables o combinar reglas de selector CSS duplicadas.

Aunque es un trabajo de desarrolladores, existen plugins de minificación como WP Rocket o W3 Total Cache que permiten optimizar los archivos CSS y JavaScript fácilmente.

10. Realizar pruebas constantes de velocidad del sitio web

Supervisar de manera constante la velocidad web te permite ver tu progreso y detectar rápidamente los problemas de rendimiento que puedas tener antes de que empeoren. Como puedes ver, son muchos los factores que influyen en la velocidad del sitio web, y es necesario realizar auditorías periódicas.

Existen diferentes herramientas en el mercado para este propósito. Puedes utilizar un SEO Crawler como FandangoSEO que monitoriza los elementos vitales de la web y te envía notificaciones por correo electrónico con los cambios en las métricas para que puedas estar siempre al día.

Esperamos que este artículo te haya resultado útil 🙂 .

Haznos saber si tiene alguna pregunta o si se te ocurre algún otro elemento para acelerar el tiempo de carga del sitio web.

Última actualización el 10 de mayo de 2022 por Hannah Dango