Cómo mejorar el tiempo de carga de tu página web

Una forma de subir tu posicionamiento en internet consiste en mejorar velocidad de carga de tu sitio web. Por supuesto, lograr eso también te permitirá brindarles una mejor experiencia a los usuarios que te visiten virtualmente. Así podrás retenerlos porque, al fin y al cabo, casi nadie soporta quedarse en una web lenta.

Reduce las probabilidades de que tus visitantes abandonen tu página para que no pierdas ventas o autoridad online. Por suerte, aquí descubrirás cómo medir la velocidad de carga de un sitio web y qué hacer para aumentar su velocidad.

5 herramientas para medir la velocidad del sitio web

El primer paso es evaluar la velocidad de carga web que tiene tu página. De esa forma, sabrás si entras en el promedio de tiempo aceptable de espera y podrás determinar cuánto mejorar. De acuerdo con estudios hechos, los usuarios comúnmente saldrán de una página que tarde 3 segundos o más de carga.

Para saber si tu sitio carga lo suficientemente rápido, hay varias herramientas de medición que están a tu disposición. A pesar de que ninguna puede dar resultados totalmente exactos, resultan útiles para tener un diagnóstico general de rapidez.

Por eso, resulta conveniente que sepas cuáles son las mejores y qué datos pueden proporcionarte al usarlas. De hecho, si usas 2 herramientas o más, tendrás una idea más precisa del resultado real. Afortunadamente, la mayoría funciona de forma completamente gratuita y resultan sencillas de utilizar.

1. PageSpeed ​​Insights

Esta herramienta, para probar la velocidad de cualquier página web, hoy día es la más popular. En parte porque es una opción gratuita ofrecida por Google y que ha sido impulsada por desarrolladores expertos. Para usarla, solo coloca la URL a probar para que la plataforma haga un análisis.

Al final, presentará una puntuación que va desde 0 hasta 100 de acuerdo al desempeño en dispositivos móviles y desktop. El diagnóstico mostrará qué tiempo se llevó en cargar las cosas en la web y cómo mejorar velocidad de carga. Hablando de forma más específica, esta herramienta influyente proporciona:

• Puntuación de la velocidad promedio en los 30 días pasados.
• Respuesta a la duda “¿cómo saber la velocidad de carga de mi web?” tanto en computadores de escritorio como en aparatos móviles.
• Informe técnico amplio vinculado al código que tiene la web y a la incidencia de este en el tiempo de la carga del sitio.
• Sugerencias técnicas que sirven con archivos CSS, caché, JavaScript y más.
• Identificación de las imágenes con mayor peso y la proyección del ahorro del tiempo que podría producirse si son comprimidas.

2. Lighthouse

Consiste en un software con código abierto que ofrece Google y se utiliza para analizar de forma exhaustiva los sitios webs. Puede ejecutarse o funcionar como alguna herramienta de líneas de comando. Aunque, al mismo tiempo, sirve como si fuera una extensión del popular Google Chrome que resulta sencillo de usar.

Lighthouse no solamente analiza la velocidad, también abarca completamente lo referente a la calidad que presenta la web. Para utilizarla, tienes que introducir la URL a auditar, así la plataforma te mostrará una puntuación. Además, te dará consejos de cómo mejorar la velocidad y otros aspectos como los siguientes:

• Mejores prácticas
• Aplicaciones web que son progresivas
• Rendimiento
• Accesibilidad
• SEO

3. Informe de experiencia del usuario de Chrome

Entre las diferentes herramientas dadas por Google, para los desarrolladores, está este informe tan práctico. Dicho reporte es utilizado con el fin de evaluar qué experiencia tienen los usuarios con el sitio web. Lo que diferencia a esta de otras herramientas es que vas a requerir más conocimiento.

Ese conocimiento de tipo técnico será esencial para poder trabajar con los diferentes códigos. Esta alternativa recopila los datos de usuarios en Google Chrome y muestra los datos promedios en los sitios web.

Por supuesto, en esa información incluye la velocidad que posee el sitio. Así los desarrolladores comparan el rendimiento con los del promedio, para mejorar. También ayuda a saber si el problema es la web o se trata del caso “mi navegador tarda mucho en cargar las páginas”.

4. GTmetrix

La herramienta GTmetrix está en esta lista porque es muy bien conocida por medir velocidad en sitios web. Sirve para crear un plan que haga óptimo el tiempo para que se cargue una página en la web. Crear una cuenta y usarlo es completamente gratis, y te permite especificar una ubicación precisa.

Incluso si no te registras podrás usarlo, pero Canadá será la ubicación predeterminada en ese caso. Luego de estudiar la página indicada, esta plataforma ofrece puntos en porcentaje para reflejar la velocidad y tiempo de la carga.

También presenta el tamaño completo del sitio en internet y muestra promedios del mercado para hacer una comparación. Después de ello, podrás ver los consejos referentes a los ajustes que pueden hacerse a fin de incrementar la velocidad. Aparte, te entrega:

• Identificación de los errores separados por tipo. Pues existen errores o fallos de servidor, CSS/JS, imágenes, JS, contenido y más.
• Información referente al peso total que posee el sitio web, con la cantidad de llamadas hechas al servidor.
• Gran informe técnico, incluyendo diversas recomendaciones con el fin de optimizar los tiempos para cargar.
• Cada recomendación viene con cierto grado de prioridad detallado que la clasifica como alta, mediana o baja.

5. Pingdom

Pingdom es la última herramienta para probar sitios web de este top 5, pero no por eso resulta ser la menos efectiva. Más bien es muy popular, en especial para mejorar velocidad carga WordPress, por sus análisis más completos y valiosos. Aunque es paga, te ofrece un tiempo de prueba gratis que dura hasta 14 días.

Su plataforma es interesante y los análisis se efectúan en distintas partes en el mundo. En estos se detalla la disponibilidad y velocidad en la cual se carga la página. También informan sobre el rendimiento en las transacciones principales en el sitio web.

Así mismo, indica oportunidades para mejorar y manda alertas al surgir problemas. De esas maneras, demuestra su superioridad en comparación con otras herramientas de ese tipo, a pesar de ser similar. Te ofrece:

• Informe del tamaño que tiene la página separado por el tipo del contenido (Image, Script, HTML, Redirect, Font, CSS y XHR). Junto con la cantidad total del espacio que tiene cada uno.
• Evaluación rápida de la página web, que abarca grado del rendimiento, tiempo de la carga, número de peticiones a servidor y tamaño.
• Informe del tamaño que tiene el sitio por dominio.
• Informe de las peticiones hacia el servidor, clasificadas por el tipo del contenido.

Factores que influyen en la velocidad de carga de una página web

Saber por qué no carga una página web, o por qué no lo hace tan rápido como otras, es importante. Detectar los factores que influyen en este hecho te hará más fácil identificar dónde está el problema de tu sitio.

Ese es otro paso en la dirección correcta para responder la duda “¿cómo mejorar el tiempo de carga de mi web?”. Claro, debes tener en cuenta que hay ciertos factores que no podrás controlar para mejorar velocidad de carga. A continuación se especifican cuáles son algunos de los puntos incidentes en la velocidad:

• Tipo de página: No es posible esperar que un blog, un ecommerce y una página web corporativa carguen al mismo tiempo.
• Alojamiento web: El hosting elegido puede hacer que las lecturas de bases de datos sean más rápidas o lentas. Así que es un factor decisivo al analizar cómo cargar más rápido páginas web.
• Construcción: La rapidez dependerá de si los sitios son construidos sobre CMS, tales como Joomla o WordPress, o con CSS, PHP y HTML. También variará si se construyen con un software para comercio electrónico, tal como Prestashop.
• Uso de plugins: A pesar de que los plugins son muy útiles al implementar ciertas funciones fácilmente, no hay que abusar de ellos. Porque algunos reducen considerablemente la rapidez de cargas.
• Archivos subidos: Los archivos a subir, como fotos y vídeos, deben estar bien optimizados para que no bajen la velocidad excesivamente.

13 trucos para mejorar la velocidad de tu sitio web

Una vez que compruebes con las herramientas que debes mejorar el tiempo de respuesta del servidor, toma acción. Claro, no deberías esperar tener una puntuación 10/10 en esos sitios, porque hay múltiples variables involucradas. Sin embargo, tampoco es bueno que te conformes con una calificación tan baja.

Hay varias respuestas a la pregunta “¿cómo mejorar el tiempo de carga de mi web?” y aquí encontrarás cuáles son. Todas son sugerencias bastante útiles que te facilitarán lograr ese objetivo que tienes de aumentar la velocidad página web.

Lo más recomendable es que, en lugar de probar todas juntas, optes por las más sencillas de implementar para ti. De esa manera, serás capaz de ir comprobando si los resultados mejoran y determinar cuáles funcionan en tu web.

1. Habilitar la compresión Gzip

Gzip consiste en un formato para comprimir archivos que serán subidos a páginas web. Este reduce el tamaño total de todos los archivos y hace menor el tiempo en la transferencia. Por lo tanto, se convierte en una medida eficiente al momento de mejorar el tiempo de respuesta del servidor.

Cada navegador actual admite dicho formato y procesa automáticamente la compresión, así que solo el servidor debe estar bien configurado. De esa manera, los archivos que están comprimidos estarán disponibles una vez que los usuarios los soliciten.

Si tu servidor no hace eso automáticamente, podrás usar complementos de WordPress de caché que logran esa posibilidad. Asombrosamente, haciendo esto podrías conseguir hasta 90% de compresión en archivos muy grandes.

2. Reduce el tamaño de las imágenes

El peso de las imágenes tiene un impacto directo en la carga del sitio web. De hecho, se ha estimado que representan una cantidad superior a la mitad existente de bytes en una página de internet.

Por esa razón, optimizarlas es primordial y puedes comenzar usando un plugin de WordPress que reduzca su tamaño. Tinyping y Optimus están entre las herramientas que disminuyen los kilobytes que tienen las imágenes, pero no pierden su calidad.

Aparte, la información de tipo superflua, que pueden guardar los programas de edición, se eliminará. La ventaja es que esas aplicaciones no solo realizan automáticamente esas acciones con las imágenes incluidas. También funcionan con las imágenes ya subidas a tu página, por lo que son aún más prácticas.

3. Utiliza formatos de última generación para las imágenes

El uso de formatos más actualizados de archivos es otra respuesta a la interrogante sobre cómo mejorar la velocidad online. Algunos de estos son WebP, JPEG XR y JPEG 2000 y tienen mejor compresión manteniendo la calidad.

Por consiguiente, son mejores si se comparan con PNG y JPEG al acelerar la carga y consumir menos datos móviles. Por otra parte, usando Apps como Imagify y Optimus se puede hacer una conversión a WebP automáticamente. Dicho formato guarda compatibilidad con el navegador Opera y con el de Chrome.

4. Carga las imágenes en el tamaño que serán utilizadas

Al utilizar imágenes de cierto tamaño, inclúyelas en dicho tamaño para que la página no haga el cambio. Eso se debe a que, no cargarlas en el tamaño a usar, haría que ocupen espacio innecesariamente. Como resultado del cambio mediante CSS o HTTP, se retrasaría la velocidad de carga de página web.

Así que es mejor guardar las imágenes con las dimensiones justas que se usarán en tu web. De esa manera, no se desperdiciará espacio en el servidor ni este perderá tiempo efectuando el cambio en el tamaño. Aunque parezcan insignificantes, este tipo de acciones sirven para cargar más rápido páginas web.

5. Pospón la carga de imágenes fuera de pantalla

Hasta aquellas imágenes que saldrán posteriormente en pantalla afectan la velocidad de la página web, aunque aún no aparezcan. El lado bueno es que existe la posibilidad de posponer su carga para cuando el usuario se desplace por la web.

Eso quiere decir que los desarrolladores usarán la función para carga diferida de las imágenes ocultas. Así que estas solamente se cargarán si el usuario las alcanza al desplazarse por la interfaz del sitio. Podrás configurar fácilmente esa característica usando el complemento Lazy Load de WordPress o de WP Rocket.

6. Reduce HTML, CSS y Javascript

Cuando los desarrolladores crean códigos usados para sitios webs, incluyen espacios blancos, comentarios y saltos de líneas. A pesar de que dicha información no afecta el contenido visto por el usuario, sí ocupa espacio.

Debido a eso, pueden ser una razón detrás de la queja “mi navegador tarda mucho en cargar las páginas.” Ya que la recomendación es eliminar esos caracteres superfluos especificados, lo mejor es que lo hagas. A fin de ahorrarte el trabajo de hacer más ligero cada código, existen aplicaciones gratuitas.

Por ejemplo, Autoptimize y W3 Total Cache son Apps confiables que sirven para hacer esa tarea. Sin embargo, siempre debes conservar una copia completa de los archivos, por cuestiones de seguridad.

7. Elimina las funciones que impiden la representación

Los bloqueos de procesamiento son un problema común que impide acelerar la velocidad, pero se trata de un tema complejo. Generalmente, los códigos CSS y Javascript hacen que los navegadores se retrasen al leer páginas HTML. Así pueden ser mostradas al usuario con un atractivo estilo visual definido.

Sin embargo, ese es un inconveniente cuando hace difícil cargar sitios con contenido no visto por los usuarios. Eso quiere decir que CSS y Javascript retrasan innecesariamente la página, bloqueando contenido no visto.

La forma de resolver esto es determinando que esos recursos sean cargados asincrónicamente. De ese modo, será posible mostrar el contenido rápidamente y posponer que elementos innecesarios se carguen. Para lograr eso, deberás usar el complemento Speed Booster Pack o el Async Javascript.

8. Crea páginas AMP

Las AMPs forman parte de un proyecto liderado por Google, de códigos abiertos, para hacer las webs más rápidas. Los sitios que se crean con esa tecnología cargan de manera instantánea en aparatos móviles.

A pesar de que el contenido es el mismo que en los sitios originales, su desarrollo es más simple y ligero. También eliminan los elementos innecesarios, acelerando la velocidad en la página web. Crea AMPs usando el plugin llamado AMP for WP que trae distintas plantillas móviles y evita el uso de códigos.

9. Evita redireccionamientos múltiples

La redirección resulta necesaria para evitar que los usuarios caigan en páginas inexistentes del sitio. De hecho es una recomendación de SEO, pero debes evitar los excesos que sobrecarguen al servidor.

Eso se debe a que los re-direccionamientos generan un ciclo adicional de solicitud que retrasa la carga.  Con el objetivo de identificar redirecciones que sean innecesarias, para eliminarlas, puedes usar el plugin SEO Redirection.

Por otra parte, es bueno que sepas que al utilizar una página de diseño responsivo, no habrá necesidad de redirección. Eso se debe a que la web se adaptará bien a cada pantalla desde la cual ingrese el usuario.

10. Aprovecha la memoria caché del navegador

La memoria de tipo caché se emplea para almacenamiento del contenido de la página en el aparato del usuario. De esa forma, cuando las personas vuelvan a visitar determinado sitio, este se cargará más rápidamente. Pero, sin ese almacenamiento, o la expiración del tiempo de este, las webs tardan en cargarse.

Por esa razón, debes asegurarte de que el servidor solicita automáticamente mantener esos archivos guardados. En caso de que la solicitud no sea automática, incluye un archivo que fuerce la utilización de dicha memoria caché. Para ello, los complementos WP Fastest Cache y W3 Total Cache son útiles.

11. Reduce el tiempo de respuesta del servidor

El tiempo que tarda en responder el servidor se calcula en milisegundos. Este se basa en cuánto tarda que el HTML pedido cargue, luego de hacer la solicitud, para presentar la web. Si dicho tiempo es mayor de 200 ms, es conveniente que lo mejores; y hay varias soluciones asociadas al hosting.

Por ejemplo, no es recomendable comprar un hosting que sea compartido. Eso se debe a que es normal que se impongan al servidor demandas excesivas, que comprometerán el rendimiento. De forma similar, un hosting extranjero no es la mejor opción, por el aumento del tiempo de la latencia.

Eso es algo que no ocurriría con un hosting regional, por la distancia más cercana. Debido a esos motivos, tal vez deberías considerar si está dentro de tus posibilidades la contratación de un hosting dedicado. Aunque utilizar un CDN igual podría mejorar el tiempo en la respuesta del servidor.

12. Eliminar el error «Query string from static resources»

La presencia de ese error, que podría producirse luego de especificar la caché en el navegador, es un problema. Este podría incidir negativamente en cómo cargar una página web a un servidor y la rapidez en ello.

Lo bueno es que puede solucionarse incluyendo las líneas de un código dentro del archivo con funciones. También puede ir con el archivo llamado «functions.php» que es del activo theme de WordPress. Las líneas del código son las siguientes:

function _remove_script_version( $src ){
$parts = explode( '?', $src );
return $parts[0];
}

add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );

13. Evitar errores de sintaxis y enlaces rotos

Este es un último truco fundamental a seguir para que el tiempo a esperar al cargar tu web sea menor. Los enlaces rotos, las etiquetas rotas SRC y los errores sintácticos dentro del código en la web son fatales.

Estos provocan peticiones excesivas al servidor, consumen transferencias excesivas de datos y aumentan la espera de un sitio web. Por consiguiente, no pases estos puntos por alto, evita enlaces rotos y mantén un sintaxis buena. Haciendo todo esto, lograrás optimizar la carga de tu página en internet.