Domingo, 07 Febrero 2021 13:54

Mejorar la velocidad de carga de Joomla

Escrito por
Valora este artículo
(3 votos)

Mejorar la velocidad de carga de Joomla

¡Bienvenid@! Si estás aquí es porque buscas mejorar la velocidad de carga de Joomla.

Hemos creado este artículo para ti, esperamos que te pueda ser de utilidad.

*Para que no haya centenares de enlaces y sea cómodo, los componentes para mejorar la velocidad de carga de Joomla y otras herramientas, permanecerán ocultos para usuarios anónimos. Registrarse es completamente gratuito y tendrás acceso a diferentes extras que iremos creando.

¡Por cierto! antes de empezar quiero invitarte a navegar por nuestro sitio web, a que descubras otros apartados como el blog de SEO (bueno va, ¡cuando acabes de ver el artículo!) 

La velocidad de carga es hoy día uno de los principales factores clave del posicionamiento SEO y más, si tenemos en cuenta que la mayor parte de tráfico proviene de dispositivos móviles, los cuales en algunas ocasiones estarán utilizando una tarifa de datos limitada para navegar.

Cuando hablamos de la velocidad de carga, nuestro objetivo principal debe ser el de mejorar la experiencia de usuario.

Esto lo conseguiremos al poner a régimen nuestro contenido (en especial el contenido multimedia) y al conseguir una velocidad de carga óptima aplicando las acciones aquí citadas y utilizando algunos de los complementos para Joomla indicados al final del artículo.

Hace poco, publicamos un artículo para mejorar la velocidad de carga en Wordpress, este artículo, tendrá elementos en común lógicamente, pero los plugins que nos encontramos para mejorar la carga de Joomla son distintos por lo general. No obstante te invito a echarle un vistazo ya que al inicio nombramos algunos de los avisos de mejora de PageSpeed.

 

Optimizar la velocidad de carga de Joomla

A lo largo de este artículo veremos diferentes acciones a tener en cuenta para mejorar la velocidad de carga de Joomla. ¡No te lo pierdas!

Joomla es uno de los CMS más utilizados a día de hoy, a mi personalmente me encanta, lo encuentro muy versátil y cuenta con muchas funciones de serie, aunque como todos los CMS, para optimizar la velocidad de carga, suelen requerir de alguna ayudita externa, como parámetros de configuración en htaccess o plugins.

 

Veamos los valores ideales de TTFB, Peticiones, Peso y Tiempo de carga:

 

TTFB Pet. Peso T.Carga
<100ms <40 <1MB <3s

 

TTFB: es el tiempo que transcurre hasta que el navegador del usuario recibe el primer byte. Es uno de los factores más importantes para Google. Para mejorarlo deberemos hacer diversas acciones que veremos a lo largo de este contenido, como reducir el peso de nuestro sitio, intentar no sobrecargar nuestro servidor, reducir el tiempo de respuesta por ejemplo haciendo uso de caché, entre otras.

Pet.: abreviación de peticiones HTTP. Son los "mensajes" enviados por un cliente para iniciar una acción en el servidor. Seguro que en alguna ocasión PageSpeed te ha indicado que deberías reducir el número de peticiones. Como es lógico, si el servidor trabaja menos para ofrecernos la información, el proceso será más rápido. Puedes leer más aquí.

Peso: es el tamaño total que ocupa la página o publicación concreta que analices (no todo tu sitio web). Es decir esta publicación por ejemplo, tiene su código html, sus imágenes, etc. Todo ello da un tamaño total, cuanto mayor sea ese tamaño, peor. Los tiempos de procesamiento serán mayores, el usuario tardará más en recibir la información y utilizaremos más ancho de banda.

T.Carga: el tiempo de carga es, como su propio nombre indica, el tiempo que tarda en cargar nuestro sitio web desde que hacemos clic.

 

Es importante que no os centréis exclusivamente en el tiempo de carga de vuestra Home.

¡Optimizad todo vuestro sitio!

 

¡Haz que tu Joomla vaya a la velocidad de la luz! 🌠

 

Herramientas análisis de velocidad

Si te pones a buscar, verás que existen multitud de herramientas de análisis de velocidad, hay quien prefiere unas y quien prefiere otras. La verdad, es que todas tienen su lado bueno, yo personalmente te aconsejo que no te centres exclusivamente en PageSpeed y pruebes las otras que te mencionamos.

 

 

☝🏽 ¡Importante! Antes de optimizar tu sitio, haz una copia de seguridad y analízalo para conocer los cambios

 

 

Acciones para mejorar la velocidad de carga de Joomla:

  1. Contratar un buen hosting
  2. Elegir un buen template
  3. Utilizar la caché de Joomla
  4. Utilizar la caché del navegador
  5. Habilitar compresión Gzip
  6. Minificar archivos JS, CSS y HTML 
  7. Eliminar recursos que bloqueen el primer renderizado
  8. Optimizar imágenes
  9. Carga diferida de imágenes
  10. Limpieza de complementos
  11. Optimiza la base de datos
  12. Corrige errores 404
  13. Mantén tu web actualizada
  14. Complementos para mejorar la velocidad de Joomla

 

 

Contrata un hosting decente

Si tu hosting es una auténtica patata, te va a costar mucho conseguir unos valores óptimos de carga para tu sitio web. Contrata un buen hosting para conseguir que Joomla cargue rápido.

En el apartado elegir hosting os ayudamos a dar con las mejores opciones.

Existen muchísimos hostings en el mercado, os hablamos de aquellos que merecen la pena, algunos probados por nosotros mismos, otros por personas cercanas. No os queremos hablar de cualquier cosa, ni perder el tiempo en analizar un hosting durante unos días (cuando su funcionamiento puede fluctuar).

Para Joomla, a mi personalmente, me gusta mucho LucusHost y Tropical Server. Ambos son hostings de calidad a precio competitivo.

Si estás empezando y buscas invertir lo mínimo posible, puedes consultar la publicación 15 Hostings baratos a tener en cuenta.

Si ya tienes hosting, entonces deberás valorar si realmente cumple con tus expectativas y seguir en él o bien migrar a otro. Por lo general, la mayoría de hostings tienen servicio de migración gratuito. Da pereza, pero a veces es lo mejor.

Nosotros tenemos un proyecto en Joomla que era infranqueable, pero pesa bastante y el hosting no da más de si, por lo que nos están empezando a ganar terreno y es que hoy día la velocidad de carga es un factor indiscutiblemente importante para el posicionamiento web.

Otra cosa a destacar, es que siempre será mejor que el hosting que elijas, esté próximo a tu público objetivo. Para que te hagas una idea, nosotros tenemos hostings en España para proyectos enfocados aquí y en EEUU/latinoamerica para proyectos enfocados a América.

Si tu página va a recibir mucho tráfico internacional, entonces igual para conseguir una configuración más óptima, con el tiempo deberías hacer uso de CDN.

 

 

Elige un template ligero

Junto al hosting, esto debería ser lo segundo que debamos tener presente ya que ambas cosas serán los pilares de nuestro proyecto. Elige un diseño sencillo, y con sencillo me refiero a que no cargue multitud de archivos, un template que pese poco y no tenga infinidad de archivos JS y CSS.

Nosotros lo que solemos hacer es analizar la demo que suelen tener los templates con herramientas de medición de velocidad, para saber toooodo lo que llegan a cargar.

Por otro lado, muchos templates son optimizables, si trae funciones que no vas a usar, es posible que puedas deshabilitarlas, para que no las cargue.

Que sea un template gratuito o de pago ya es cosa tuya. Intentaremos con el tiempo crear una selección. Pero sobretodo no te dejes llevar por la apariencia, lo bonito que te parezca un diseño, seguro que pecas de peso y tus tiempos de carga serán astronómicamente altos. ¡Sé prudente! Porque aunque lo puedas cambiar con el tiempo, esto puede suponer que tengas que modificar muchas cosas.

 

 

Caché de Joomla

Joomla tiene 3 tipos de caché de forma nativa.

Una de ellas se encuentra como plugin, es la caché de página, esta caché hará que tu página, literalmente, vuele como un cohete 🚀

El tema está en que solo se suele utilizar para el contenido estático, ya que no se le define tiempo.

Además piensa que una caché es como una copia con todos los recursos de esa página, que nos permite servir la página de forma rápida. Por lo tanto, algunas funciones como el "número de veces vista" no funcionarán. Una caché lo que hace es generar una copia estática de un contenido "dinámico".

Además de esta, Joomla tiene otros 2 tipos de caché, la caché conservacional y la caché progresiva.

La caché se genera para poder servir los datos en un archivo HTML de forma rápida, por lo que mientras que no limpiemos la caché o esta no caduque, nuestro servidor mostrará la misma copia.

 

 

Caché de Página de Joomla

Como hemos comentado antes, activar este tipo de caché hará que tu sitio web cargue mucho más rápido, aunque esto no quiere decir que nuestra puntuación en las herramientas de medición de velocidad ya vaya a ser óptima, hay otros factores a tener en cuenta.

¿Por qué es la caché más rápida de Joomla? Porque es una copia, una instantánea de absolutamente todos los complementos que conforman la página, es decir, plantilla, componentes, módulos...

¿Cómo activar la caché de Página de Joomla?

  • Accede a la administración de tu Joomla
  • En el Menú superior pulsa en Extensiones y después en Plugins
  • Busca el plugin "Sistema - Caché"
  • Actívalo, dentro de él podrás excluir elementos de menú y/o URLs concretas

 

 

Caché conservacional de Joomla

La caché conservacional muestra a todos los usuarios de tu sitio web una misma versión de la caché que ha generado él o cualquier otro usuario, es decir todos los usuarios cargarán un mismo duplicado de tu página hasta que esta caché cumpla su tiempo de muestra o sea eliminada manualmente.

 

¿Cómo activar la caché conservacional de Joomla?

  • Accede a la administración de tu sitio
  • En el Menú superior pulsa en Sistema y después en configuración global
  • Pulsa en la pestaña "Sistema"
  • Dónde dice caché de sistema, selecciona "Activo - caché conservacional"
  • Define el tiempo de duración de la caché (en minutos)

 

 

Caché progresiva de Joomla

A diferencia de la caché conservacional, la progresiva generará una capa superior de caché única para cada usuario. No suele ser recomendable a menos que se trate de un sitio pequeño, ya que usar este tipo de caché genera muchos archivos y puede hacer que disminuya el rendimiento nuestro servidor.

Los pasos para activarla, son los mismos que la conservacional, solo que eligiendo la progresiva obviamente.

 

 

Caché de navegador

Los tipos de caché que hemos visto antes, hacen referencia a la caché que se generará en nuestro hosting, para servir la página de una forma más rápida. Pero podemos dar un paso más allá y activar la caché de navegador.

Esta la activaremos introduciendo el siguiente código en el fichero .htaccess ubicado en el directorio raíz de nuestro sitio web (modificando los tiempos por los deseados).

La caché de navegador es una excelente forma de lograr que los usuarios recurrentes puedan cargar las páginas que ya han visto de una forma rápida, ya que existiría una "copia" en sus equipos y por lo tanto no tendrían que volver a descargar información que ya habían descargado antes.

Ellos conseguirán tener una mayor velocidad (ahorrar datos) y nuestro servidor tendrá que trabajar menos.

 

<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/plain "access plus 1 month"
ExpiresByType image/gif "access plus 5 months"
ExpiresByType image/png "access plus 5 months"
ExpiresByType image/jpeg "access plus 3 months"
ExpiresByType image/x-icon "access plus 3 months"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/x-icon "access plus 3 months"
</IfModule>

 

 

Habilitar comprensión Gzip

La comprensión Gzip, la podemos habilitar desde nuestro mismo Joomla, aunque es preferible habilitarla desde el archivo .htaccess

¿Cómo habilitar la compresión Gzip desde Joomla?

  • Acceder a la administración de Joomla
  • En el menú superior pulsar en Sistema y en Configuración global
  • Pulsar en la pestaña "Servidor"
  • Dónde dice "Compresión Gzip de páginas" pulsar en "Si".
  • Pulsar en el botón Guardar o Guardar y cerrar.

 

 

¿Cómo habilitar la compresión desde htaccess?

Os dejaré dos códigos, solo deberéis utilizar uno de ellos, hoy en día es más común utilizar el segundo.

<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

 

<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/shtml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>

 

 

Minificar JS, CSS y HTML

Otra de las acciones comunes a la hora de optimizar la velocidad de carga es la de minificar archivos, es decir reducirlos para que ocupen menos, esto se hace eliminando comentarios insertados en el interior de estos archivos, espacios, etc.

Si analizas tu página web con una herramienta de medición de velocidad para webs como GTMetrix, te permitirá descargar esos archivos ya optimizados (recuerda hacer copia de seguridad de los originales), también existen herramientas online específicas para tal fin como minifycode.com

Aunque lo más común es hacer uso de algún plugin que nos facilite esta tarea. Abajo os dejaremos una selección de plugins para joomla.

 

 

Eliminar recursos que bloqueen el renderizado en Joomla

Este suele ser uno de los principales dolores de cabeza que nos puede dar PageSpeed, esto ocurre porque nuestra página carga ficheros CSS y JavaScript que bloquean el primer renderizado (lo primero que verá el usuario al acceder), y dichos ficheros no son necesarios en ese momento.

Dependiendo del tipo de conexión HTTP, es posible que la lectura de tu sitio web por parte del navegador se vea interrumpida por la descarga de archivos JS o CSS, es decir, durante un breve tiempo el navegador estará descargando esos archivos y dejará de leer el contenido, por lo que estamos pausando el renderizado.

Esto se soluciona con Async y/o con Defer. Es decir, cargando los archivos de forma asíncrona (paralelamente a la lectura) o haciendo que se carguen después.

Para solucionar este inconveniente, haremos uso de algún plugin de Joomla, pero esto lo veremos en el apartado herramientas.

 

 

Optimización de imágenes

Cuando subas imágenes a tu sitio web, tendrás que tener clara dos cosas... ¿Necesitas que las imágenes sean tan grandes? (recuerda que la mayor parte de las visitas vendrán de dispositivos móviles) y la segunda cuestión es... ¿Has comprimido tus imágenes?

Lo primero es comprimir las imágenes, para ello podemos hacer uso de herramientas online como por ejemplo tinypng.com o bien compressor.io (crearemos una publicación específica de este tema en la sección recursos)

Si hacemos uso de la herramienta WebPageTest citada al inicio de esta publicación, podremos ver si estamos usando imágenes demasiado grandes y si se pueden comprimir más, además desde esta herramienta podremos descargarnos las imágenes en un formato de nueva generación y ya optimizadas.

Analizar imágenes con WebPageTest:

  • Accede a WebPageTest
  • Introduce la URL de la página a analizar
  • Pulsa sobre análisis de imagen

Te recomendamos utilizar JPG para tus imágenes, si contienen transparencias PNG. No utilices formatos como WEBP, ya que no son compatibles con muchos navegadores.

 

 

Carga diferida de imágenes

Siguiendo con las imágenes, otro valor a tener en cuenta es la carga diferida de estas. Es decir, cargar de forma progresiva las imágenes mientras el usuario realiza scroll, en lugar de todas de golpe.

Con esto conseguiremos que la página cargue antes y que el usuario no descargue aquellas imágenes que no vaya a ver.

En un proceso normal se descargarían todas las imágenes pero con la carga diferida, solo aquellas que se vayan a visualizar.

Si un usuario accede utilizando datos móviles, le estaremos haciendo un gran favor si no llega hasta el final de nuestras publicaciones, no tendrá porque descargar todas las imágenes. En este caso, es un gran ahorro de ancho de banda y de datos.

Esto se consigue utilizando algún plugin para tal fin, en el apartado herramientas veremos qué podemos encontrar en Joomla.

 

 

Instala solo aquello que vayas a utilizar

Imagínate que tienes una caja de libros, contra más libros metas en ella, más pesará y por lo tanto más te costará moverla. 

Con un sitio web ocurre lo mismo, si empezamos a instalar complementos de manera desmedida, pesa cada vez más. Lo que supone que costará más moverlo, al pesar más, el tiempo de carga será mayor y haremos que nuestro servidor trabaje más, por lo que el tiempo de respuesta también puede empeorar.

Con esto no te digo que no instales nada, si no que tengas claro lo que realmente vayas a usar y no instales cosas que no sean verdaderamente necesarias.

 

 

Optimización de la base de datos

Tendemos a instalar cosas que posiblemente en un futuro eliminemos, con estas acciones es posible que generemos residuos en nuestra base de datos. Por lo que nos interesa mantenerla limpia y sana.

¿Cómo optimizar la base de datos?

Lo haremos desde nuestro hosting en 5 sencillos pasos:

  • Accede a tu hosting
  • Accede a phpMyAdmin
  • Selecciona tu base de datos para que se desplieguen las tablas
  • Selecciona todas las tablas de tu base de datos
  • Abajo del todo, en el desplegable, selecciona "optimizar la tabla"

Verás como de forma prácticamente instantánea tu base de datos estará optimizada.

 

 

Evitar errores 404

Los errores 404 no solo suponen un gran problema para el posicionamiento SEO, sino que pueden hacer que nuestro sitio web se ralentice.

Para ver qué enlaces rotos tienes, puedes hacer uso de Search Console de Google.

Aunque abajo, en herramientas te dejaremos alguna específica para tal fin.

 

 

Mantén tu web actualizada

Utiliza las últimas versiones de PHP, la diferencia de velocidad puede ser muy importante (podrás seleccionarla desde tu hosting). Mantén todos los complementos, el sistema de Joomla, y tu template actualizados. Las nuevas versiones pueden ahorrarte problemas de seguridad y pueden traer mejoras de rendimiento.

 

 

Herramientas / Complementos para mejorar la velocidad de carga de Joomla

A continuación te hablaremos de una serie de herramientas para hacer que tu jooomla cargue más rápido. 

Este contenido solo será visible para usuarios registrados (Registrarse es gratis).

 

 

 

 

 🤩 ¡Síguenos en redes sociales! 👇🏻

 

 

 

Visto 79 veces Modificado por última vez en Martes, 23 Febrero 2021 18:58
Oscar García

“El ingrediente más importante es levantarte y hacer algo. Así de simple. Muchas personas tienen ideas, pero solo algunas deciden hacer algo hoy. No mañana. No la siguiente semana. Sino hoy. El verdadero emprendedor actúa en lugar de soñar” - Nolan Bushnell

Más en esta categoría: « Quitar barra final URL (slash) en Joomla
Inicia sesión para enviar comentarios