Empezamos este post con un dato fuerte:
Según un estudio de la empresa de analítica Kissmetric, el 40 % de los usuarios abandona una web si esta tarda más de 3 segundos en cargar.
Esos son muchos potenciales clientes que entran en tu web (o en la que has diseñado para un cliente) y se van por donde han venido.
Todo por algo tan “tonto” como que la web es un poco lenta.
Y eso es un problema grave, porque a tus clientes no les interesa tener la web más bonita o con el aspecto más profesional de todo su sector: lo que quieren es una web que les ayude a vender más.
Por eso, en este post vamos a contarte:
- Qué es la velocidad de carga y qué consecuencias tiene que sea baja.
- Los factores que influyen en ella (y cómo optimizarlos para que las webs que diseñas carguen como un cohete).
- 4 herramientas para medir la velocidad de carga de una web.
Preparados para despegar en 3, 2, 1…
Índice de contenidos del artículo:
✅ ¿Por qué es tan importante la velocidad de carga de una web?
Empecemos por aclarar conceptos:
La velocidad de carga o page speed es la métrica que mide cuánto tiempo pasa desde que un usuario accede a una web hasta que los elementos que contiene se vuelven visibles.
Es decir, hasta que el texto, las imágenes, los botones, etc., se han cargado y el usuario puede empezar a interactuar con ellos.
Y como te decíamos, si ese tiempo supera los 3 segundos, una parte de los usuarios se hartarán de esperar y se irán por donde han venido.
Pero es que eso no es todo:
Además, la velocidad de carga es un factor clave para el SEO On Page.
Y es que Google sabe muy bien que una velocidad baja es sinónimo de una mala experiencia de usuario, así que penaliza a las webs que cargan demasiado lento.
Resumiendo: la web se posiciona peor, y encima la tasa de conversión se reduce (porque muchas visitas se van por donde han venido).
✅ ¿Cómo se mide la velocidad de carga? 4 herramientas para asegurarte de que tus diseños cargan como un rayo
No te preocupes, que no te va a hacer falta un cronómetro. 😉
En su lugar puedes utilizar una (o varias) de las herramientas para medir la velocidad de carga que te hemos traído en esta lista.
Y lo mejor: la mayor parte de ellas son gratuitas.
Vamos a verlas.
👉 1. PageSpeed Insight
Arrancamos con el test de velocidad de la propia Google.
Lo más interesante de PageSpeed Insight es que te ofrece varias métricas relacionadas con la velocidad de carga, incluyendo:
- FCP o “First Contentful Paint”: cuánto tarda en cargar el contenido que el usuario ve en su pantalla nada más aterrizar en la web (lo que se conoce como “above the fold”).
- FID o First Input Delay: el tiempo que pasa desde que el usuario realiza una acción (por ejemplo, pinchar en un enlace) hasta que la página devuelve una respuesta (abrir la página a la que lleva ese enlace).
Es decir, te permite saber si una web es rápida “de verdad”.
Además, la herramienta te sugiere mejoras para acelerar la carga de la página (optimizando las imágenes más pesadas, comprimiendo los archivos CSS y JavaScript, etc.).
Y también mide por separado la velocidad en ordenador y en dispositivos móviles.
👉 2. Pingdom Tools
Hay 3 puntos que nos gustan de Pingdom Tools:
- Es una herramienta muy completa, que analiza todos los aspectos que afectan a la velocidad de carga (incluyendo factores externos como el tiempo de respuesta del servidor).
- Te permite descargarte el análisis completo en un PDF para mayor comodidad.
- Además, puedes medir la velocidad desde diferentes zonas geográficas, algo muy interesante si trabajas con un cliente internacional (esto te lo explicamos más a fondo luego).
Puedes usarla de manera gratuita o contratar uno de sus planes de pago para acceder a funcionalidades más avanzadas.
👉 3. Test My Site de Google (velocidad de carga móvil)
Según un estudio de Think With Google, más de la mitad de los usuarios que navegan en móviles abandona una web si esta tarda más de 3 segundos en cargar.
Y eso es un problema, porque en móviles la velocidad de una web suele ser más baja que en un ordenador.
Por eso Google diseñó Test My Site.
Esta herramienta mide específicamente la velocidad de carga en móviles, y te ofrece consejos muy concretos para mejorarla.
👉 4. K6
¿Sabes qué es una prueba de carga o rendimiento?
Se trata de un test de velocidad de carga que simula un pico de tráfico en una web. Es decir, analiza qué ocurriría si, de repente, hubiera decenas o cientos de usuarios intentando acceder a esa página al mismo tiempo.
Esta situación puede llevar al límite a una web y afectar muchísimo a la velocidad de carga, e incluso hacer que la página deje de cargar temporalmente.
Pues K6 es una herramienta que realiza este tipo de prueba.
La única pega es que se trata de una herramienta de pago (aunque tienes un periodo de prueba gratuito). Pero si trabajas con un cliente muy grande y temes que su hosting no sea capaz de soportar grandes picos de tráfico, vale la pena invertir en ella.
✅ Ya sé cómo medir la velocidad de carga de una web… ¿pero cómo la mejoro?
Algunos de estos factores que vamos a ver ya los hemos mencionado a lo largo del post, pero ahora los analizaremos en profundidad.
👉 1. Elige un hosting optimizado
Cuando un usuario quiere acceder a una página, su ordenador se conecta al servidor en el que está alojada para “descargársela”.
Si el servidor tarda en responder, la velocidad de carga empeorará.
Además, el servidor también es el principal responsable de mantener la velocidad de carga frente a un pico de tráfico, como vimos antes.
En nuestro caso solemos trabajar con los servidores VPS de Raiola Networks, porque están optimizados para ofrecer la máxima velocidad en todas las condiciones.
Aquí puedes ver los precios actualizados de Raiola Networks y contratar uno de sus planes de VPS con un 20 % de descuento.
Y si vives en Latinoamérica, puedes contratar sus servidores ubicados en América, también con un 20 % de descuento.
➡️ Tip: Velocidad de carga para clientes internacionales
Cuando trabajas con un cliente que vende a nivel internacional, mantener una velocidad de carga óptima se vuelve un auténtico reto.
Y es que:
- Recibe tráfico desde muchas partes diferentes del mundo (y a mayor sea la distancia física entre el servidor en el que está alojada la web y el ordenador del usuario, más tardará en cargar).
- Además, también suelen estar expuestos a un volumen de tráfico simultáneo muy alto.
Para estos casos es muy útil contar con una CDN: una red de servidores distribuidos por diferentes partes del mundo, que garantizan una velocidad de carga estable sin importar desde dónde se conecte el usuario.
En este tipo de proyectos, nuestro hosting de cabecera es WP Engine. Además de trabajar con su propio servicio de CDN, sus servidores también cuentan con una serie de mejoras para acelerar la carga de una página web.
>> Accediendo a través de este enlace puedes obtener un 10 % de descuento al contratar los planes de WP Engine.
Además, si contratas el plan anual también obtendrás dos meses gratis.
👉 2. El CMS también importa
El gestor de contenidos (la plataforma sobre la que está construida la web) también debe estar optimizado para favorecer la velocidad de carga.
En este sentido, nuestro favorito es WordPress, porque es el CMS mejor optimizado para el SEO en todos los sentidos.
Además, WordPress es compatible con la mayoría de los maquetadores y plantillas web.
👉 3. Crea una versión en caché de la web
El caché es una “copia” de una página que se guarda en el navegador del usuario la primera vez que la visita. Así, cuando vuelva a acceder, la web cargará más rápido.
Para generar esta versión en caché necesitas utilizar un plugin.
En nuestro caso el que siempre usamos es WP Rocket, porque consideramos que es el plugin de rendimiento más completo que hay.
De hecho, no solo genera la versión en caché, sino que:
- Actualiza la copia en caché de la web cada vez que haces un cambio.
- Comprime los archivos HTML, CSS y JavaScript.
- Prioriza la carga de los elementos del above the fold (una funcionalidad llamada “lazy load”) para que así el usuario pueda empezar a navegar cuanto antes.
- Te permite programar limpiezas de la base de datos del servidor.
Y además el 80 % de estos cambios los hace de manera automática. Lo instalas y él solito se encarga de hacer que la velocidad se dispare.
👉 4. Ojo con el peso de las imágenes
Unas imágenes muy pesadas ralentizarán la web.
Lo recomendable es que no excedan los 150 kb, salvo excepciones muy justificadas.
Para eso puedes:
- Comprimirlas antes de subirlas: es lo más recomendable. Tienes herramientas como TinyPNG o IloveIMG, que las comprimen sin restarles apenas calidad.
- Reducirlas una vez las has subido: si tu cliente ya tiene varias imágenes subidas sin optimizar, puedes usar un plugin como Kraken.io para redimensionarlas.
Más sencillo, imposible. 😉
✅ ¿Vas a poner en práctica estos consejos para acelerar la velocidad de tus webs?
Ya lo has visto: que una página cargue lento es perjudicial.
No solo se reduce el número de visitas que acaban convirtiéndose en clientes, sino que una baja velocidad de carga hará que se posicione peor.
Y esto es un problema grave, porque cuando un cliente hace una gran inversión para diseñar una web para su negocio, lo que de verdad le preocupa es que esa inversión le sea rentable.
Por eso las empresas cada vez demandan más servicios como los del Optimizer Manager. Un profesional que:
- Diseña webs profesionales y optimizadas para el SEO.
- Elabora una estrategia de captación integral, que combina el SEO y el SEM, para lograr que esa web le traiga ventas a sus clientes.
En una palabra: su trabajo consiste en hacer webs rentables.
>> Esto te lo explicamos más a fondo en la Semana #GánateLaVidaConGoogle.
Un entrenamiento 100 % gratuito donde te hablamos de este perfil y del método de trabajo que utiliza.
Si quieres saber más, entrando en el enlace puedes apuntarte a la lista de espera del entrenamiento (ahora mismo las plazas están cerradas, pero te avisaremos en cuanto volvamos a abrirlas).
¡Te vemos dentro!