La velocidad del sitio web es crucial tanto para la experiencia del usuario como para el posicionamiento en Google. Por lo tanto, si deseas retener a los visitantes en tu sitio web y mejorar los resultados con SEO, aquí te mostramos cómo evaluar y mejorar el tiempo de carga de tus páginas.
A nadie le gusta una página web lenta. Si un usuario hace clic en una página de tu sitio web y se encuentra esperando más de unos segundos a que cargue, es muy probable que abandone tu página, lo que puede dañar tu reputación y peor aún hacerte perder conversiones de clientes.
¿Qué es la velocidad de carga?
La velocidad de carga se refiere al tiempo que tarda en cargar una página web, es decir, mostrarse en el navegador de forma completa.
Índice
¿Por qué la velocidad web es importante?
La velocidad de tu página web es importante tanto para los usuarios como para tu negocio. Un sitio que carga rápido, ofrece una mejor experiencia a sus usuarios. Quizás parezca algo obvio pero cuanto más rápido se cargue tu página web, más rápido los usuarios podrán interactuar en ella, aumentando las probabilidades de obtener conversiones y reduciendo la tasa de rebote.
Por ejemplo, si tienes una tienda online y cada paso del proceso de compra demora más de un par de segundos en cargarse, se entiende que muchos compradores potenciales abandonen su compra. De hecho, un retraso de tan sólo 100 milisegundos en la velocidad de la página podría traducirse en una disminución del 7% en las tasas de conversión de una página web. El tiempo de espera de carga puede ser la diferencia entre una buena venta o un carrito de compra abandonado.
Incluso si hablamos de consejos de SEO para tu página, Google ha indicado que toma en cuenta la velocidad de carga de las páginas web como factor para posicionarlas, una velocidad de carga web baja podría afectar tu posición en los motores de búsqueda.
¿Cuál es la velocidad de carga óptima para una página web?
Por lo general, lo recomendable es que las páginas carguen en menos de tres segundos. De hecho, el 47% de los consumidores esperan que los sitios web se carguen en dos segundos o menos, y el 40% abandona una página que demore tres o más segundos.
¿Como mejorar la velocidad de tu página web?
Si ha has probado las herramientas para verificar la velocidad de tu sitio es posible que no hayas logrado una puntuación muy satisfactoria. No tienes que desesperarte: una puntuación de 100/100 en estas herramientas no debería ser una obsesión.
Las herramientas que puedes encontrar para medir la velocidad de tu sitio tienen algunas limitaciones, por ejemplo PageSpeed Insights, realiza el análisis basado en una conexión 3G y en un servidor con una ubicación desconocida. Estos factores pueden proporcionar una visión diferente de la realidad de tus visitantes.
Además, optimizar todos los elementos del sitio para alcanzar el puntaje máximo puede ser imposible, ya que hay muchas variables involucradas. Y, a menudo, mejorar un punto puede dañar a otro. De cualquier forma, los informes de estas herramientas son buenas indicaciones de qué tan bien está funcionando tu sitio.
Si no estás viendo buenos resultados y visiblemente tu sitio está lento, te presentaremos algunos tips para acelerar la velocidad de tu sitio web.
1. Habilitar la compresión Gzip
Gzip es un formato de compresión de archivos para el sitio web. Es decir, reduce el tamaño de los archivos enviados por el servidor y el tiempo de transferencia, con tasas de compresión de hasta 90% en archivos más grandes.
Esta es una de las medidas más eficientes para reducir el tiempo de carga de la página.
Todos los navegadores actuales admiten este formato y procesan la compresión automáticamente cuando el usuario entra a un sitio web.
Solo necesitas asegurarte de que el servidor esté configurado para hacer que los archivos comprimidos estén disponibles cuando el usuario lo solicite.
Algunos servidores hacen esto automáticamente. En este enlace, puedes probar si la compresión Gzip ya está funcionando en tu sitio. Si no, hay varios complementos de caché para WordPress que permiten la compresión Gzip.
2. Reduce el tamaño de las imágenes
Las imágenes tienen un gran impacto en el peso y la carga de un sitio web. Según HTTP Archive, en mayo de 2019, representaban más de la mitad de los bytes de un sitio web.
Optimizarlos, entonces, puede ser uno de los primeros pasos para mejorar la velocidad del sitio web.
Comencemos reduciendo el tamaño. Para esto, puedes usar un plugin de optimización de imagen para WordPress, como Optimus y Tinypng.
3. Utiliza formatos de última generación para las imágenes
Otra acción importante para optimizar las imágenes es utilizar los formatos de archivo más actualizados, como JPEG 2000, JPEG XR y WebP.
Tienden a tener una mejor compresión mientras mantienen la calidad en comparación con JPEG y PNG. Esto reduce el consumo de datos móviles y acelera la carga.
En las aplicaciones Optimus e Imagify, es posible realizar la conversión automática a WebP. Este formato es compatible con los navegadores Chrome y Opera y, en promedio, es 25-34% más pequeño que JPG.
4. Carga las imágenes en el tamaño que serán utilizadas
Si vas a utilizar una imagen en tamaño 822x325, por ejemplo, ¿por qué incluirla en el sitio web en tamaño 1920×1080?
Dejar que el sitio haga este cambio de tamaño a través de HTTP o CSS puede retrasar la carga. Además, la imagen ocupará más espacio innecesariamente, ya que se utilizará en un tamaño más pequeño.
Guarda la imagen en las dimensiones que será usada en el sitio web evitando, de esa forma, que el servidor pierda tiempo con el cambio de tamaño y espacio con una imagen que podría ser más clara.
5. Activa la carga diferida de imágenes
Las imágenes que no aparecen en la pantalla afectan el tiempo de carga de las páginas, lo interesante es que es posible retrazar la carga a medida que el navegante se desplaza por la página.
Esta característica se puede configurar con los complementos de WordPress: Lazy Load o Lazy Load de WP Rocket. Ambas opciones son muy simples de usar.
6. Reduce HTML, CSS y Javascript
Cuando un desarrollador crea los códigos para un sitio web, es común incluir saltos de línea, espacios en blanco y comentarios.
Esa información no influye en el contenido que ve el usuario, pero está ocupando espacio y puede aumentar el tiempo de carga.
Las herramientas generalmente recomiendan la eliminación de estos caracteres superfluos. Esto es lo que se hace al "minificar" los códigos HTML, CSS y Javascript, para que sean más ligeros.
Existen aplicaciones gratuitas para eso, como W3 Total Cache y Autoptimize. Pero, incluso utilizando una aplicación confiable, siempre es importante mantener una copia de seguridad de tus archivos.
7. Elimina las funciones que impiden la representación
En general, los códigos Javascript y CSS obligan a los navegadores a retrasar la lectura de las páginas HTML, de modo que se muestren a los usuarios con estilos definidos. Después de todo, nadie desea que las páginas pierdan todo el atractivo visual.
Esto puede ser un problema cuando dificulta la carga de páginas con contenido que el usuario no ve. Esto significa que Javascript y CSS retrasan innecesariamente el sitio al bloquear el contenido que está "debajo del pliegue", es decir, que el usuario aún no ha visto.
Para resolver esto, puedes determinar que los recursos de JavaScript y CSS se carguen de forma asincrónica.
Esto se puede hacer, por ejemplo, con el complemento Async Javascript (solo para Javascript) o el Speed Booster Pack (para Javascript y CSS).
8. Crea páginas AMP
Las páginas móviles aceleradas (AMPs) son un proyecto de código abierto encabezado por Google para lograr ese objetivo de hacer que la web sea más rápida. Las páginas creadas con esta tecnología se cargan instantáneamente en dispositivos móviles.
Para crear AMPs para tu sitio web, puedes usar el plugin AMP for WP, que te permite crear páginas desde diferentes plantillas móviles sin tener que utilizar códigos.
9. Evita redireccionamientos múltiples
A menudo, la redirección es necesaria para que el usuario no caiga en una página inexistente en el sitio. Sin embargo, demasiados redireccionamientos sobrecargan el servidor. Activan un ciclo de solicitud adicional y retrasan la carga, por ejemplo:
Para acceder a la versión móvil de tu sitio web hay dos redirecciones:
- de "site.com" a "www.site.com";
- de "www.site.com" a "m.site.com".
Esto puede retrasar la carga. Pero si usas una página con diseño responsivo, no hay necesidad de redirigir, ya que la página se adapta a la pantalla del usuario. Por lo tanto, la recomendación es usar páginas responsivas.
Además, un plugin como SEO Redirection puede identificar redirecciones innecesarias para que las elimines.
10. Aprovecha la memoria caché del navegador
La memoria caché del navegador se utiliza para almacenar el contenido del sitio web en el dispositivo del usuario, de modo que se carguen más rápidamente en la próxima visita.
Si el contenido no se almacena en caché o el tiempo de almacenamiento ha expirado, las páginas tardarán más en cargarse. El servidor debe realizar la solicitud de los navegadores para mantener estos archivos guardados. Esta solicitud generalmente es automática. Pero, si no es así, debes incluir un archivo para forzar el uso de la memoria caché.
11. Reduce el tiempo de respuesta del servidor
El tiempo de respuesta del servidor mide cuántos milisegundos se requieren, después de la solicitud del usuario, para cargar el HTML requerido para representar la página. Si este tiempo es superior a 200 ms, PageSpeed Insights apunta a una oportunidad de mejora.
Existen algunas soluciones relacionadas con el tipo de hosting. Cuando compramos un hosting compartido, es común que se le impongan demandas excesivas al servidor y comprometan el rendimiento de tu sitio.
Es recomendable un CDN para reducir el tiempo de respuesta del servidor ya que aloja los sitios en servidores repartidos por todo el mundo, lo que permite una distribución rápida y efectiva de los contenidos, el CDN más utilizado es Cloudflare el cual es fácil de configurar y ayudará bastante a tu sitio.
