Optimización WordPress, Joomla, Prestashop

La velocidad de carga de nuestra página repercute sobre todo en dos aspectos importantes: el primero es que los usuarios no suelen tener mucha paciencia a la hora de navegar por una web, y si nuestra página tarda mucho en cargar, la abandonarán; y el segundo es el SEO, ya que los buscadores bajan las posiciones de las páginas que más tiempo tardan en cargar. En este post voy a explicar algunas opciones de cómo optimizar nuestro CMS, para que esto no nos pase.

Antes de continuar, asegúrate primero en comprobar que rápido es actualmente su sitio web. Hay una serie de herramientas en línea que pueden ayudarte a determinarlo. Las siguientes herramientas te pueden ofrecer  información detallada sobre todas las posibles preguntas:

Consejos para optimizar nuestro WordPress

1.- Elige un theme que esté optimizado

Siempre trata de elegir un theme que esté optimizado y tenga actualizaciones periódicas, sino puede ser muy antiguo y puede estar mas optimizado para SEO.

2.- Elimina Plugins innecesarios que consuman recursos

Trata de eliminar los plugins que no uses, no que los desactives, no, si no que los elimines directamente. Aunque estén sin uso, consumen recursos.

3.- Optimiza las imágenes

Otro de los puntos básicos para mejorar la carga de WordPress o de cualquier web.

En muchas ocasiones puede que hayas estado subiendo imágenes cogidas de tu cámara con resoluciones muy grandes (mayores de 800×600) que al final hacen que tu imagen sea extremadamente pesada y por tanto ralentice la carga de tu web.

Lo primero que debes de hacer es adaptar el tamaño de la imagen al tamaño real que va a ocupar en tu web.

Esta adaptación la puedes hacer con algún programa de edición de imágenes como Gimp que es gratuito.

Por otro lado, una vez que la has adaptado es posible que se pueda optimizar un poquito más, y es aquí cuando entra el uso de otro plugin llamado WP-Smush.it.

WP-Smush.it optimizará por ti la calidad de la imagen, reduciendo su peso y por tanto aligerando la carga de tu web y mejorando la velocidad de carga.

4. Comprimir el contenido usando el .htaccess

Podemos comprimir todo el contenido que enviemos a los navegadores incluyendo esta línea en nuestro .htaccess

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/javascript application/x-javascript application/x-httpd-php application/rss+xml application/atom_xml text/javascript

La mayoría de las páginas html se comprimen bastante bien, pero conviene hacer algunas pruebas después de aplicar ésta modificación.

5.- Utiliza un plugin de caché

Cuando tienes un servidor que genera contenido dinámico (como puede ser WordPress o cualquier CMS o web que use php por ejemplo) con cada acceso a la web se tiene que generar el contenido dinámico para cada usuario.

Con un sistema de caché, este contenido se genera sólo una vez, y se muestra cada vez que llega un usuario y solicita la misma página.

Con un sistema así estamos ahorrando consultas al servidor, por lo que además de mejorar la velocidad de carga de la web, mejora la carga del servidor.

Dentro de estos plugins existen dos que son los más usados WP-Super Cache y W3 Total Cache.

WP Super Cache para mí es más fácil de configurar, tiene menos opciones y es menos tedioso por lo que puede ser una buena idea empezar con este plugin.

W3 Total Cache en mi opinión es mucho más potente y configurable, es el que uso en mi web y los resultados los tienes a la vista.

En cambio W3 Total Cache es algo más complejo de configurar ya que tienes que tener claro qué poner en cada una de sus opciones para sacarle el máximo partido.

6. Desactivar el sistema de revisiones en WordPress

El sistema de revisiones es un sistema de control de cambios que se incluye desde la versión 2,6 de WordPress, y que no suele utilizar ni el 1% de los usuarios. Las revisiones se generan automáticamente cada vez que variamos algo en una entrada.

Para deshabilitarlas, podemos añadir la siguiente línea en el fichero wp-config-php:

define( ‘WP_POST_REVISIONS’, 0);

o

define( ‘WP_POST_REVISIONS’, false);

Si llevas un tiempo teniendo las revisiones activadas, podemos borrarlas usando el ya mencionado WP-DBManager y lanzando la siguiente consulta:

DELETE FROM wp_posts WHERE post_type = “revision”;

Esto borrará las revisiones de la base de datos, reduciendo su tamaño.

ATENCIÓN: haz esto con cuidado. Si no estás seguro de lo que estás haciendo, por lo menos haz una copia de seguridad de la base de datos antes de lanzar consultas.

7.- Usa un CDN

¿Y qué es esto?

Un CDN, viene de sus siglas Content Delivery Network, o dicho de otro modo, red de distribución de contenido.

Un CDN no es otra cosa que un “espejo” de tus ficheros estáticos, como pueden ser imágenes, ficheros css, ficheros js, etc.

En un CDN todos tus ficheros estáticos se replicarán en servidores por todo el mundo, de modo que cuando un usuario acceda a tu web estos ficheros no se descargan desde tu servidor, sino que se descargan del servidor de tu CDN más cercano.

¿Qué conseguimos con esto?

Dos cosas.

Primero mejoras la velocidad de carga de tu web, ya que estará cogiendo los ficheros del servidor más cercano, y estos servidores son servidores potentes con buenos tiempos de respuesta.

Segundo mejoras la velocidad de respuesta del servidor, si estás en un hosting compartido igual no te preocupa mucho, pero si el servidor dónde estás está menos sobrecargado mejorarás el tiempo de respuesta de las peticiones dinámicas y a BBDD que estés haciendo.

Consejos para optimizar nuestro Prestashop

Entramos en Opciones avanzadas–> Rendimiento

– Caché de Smarty:

Es un motor de plantillas para PHP. Deberemos activar la caché, con esto conseguimos que el motor no tenga que compilar cada vez que se abre la página, utilizando datos de la caché de una compilación anterior y haciendo que todo funcione mucho mas rápido. Si estamos trabajando en nuestra página o queremos hacer cambios en ella, deberemos activar la casilla de forzar compilación para que nuestros cambios se reflejen, pero cuando no vayamos a hacer ningún cambio en nuestra plantilla lo mejor es activar la casilla de nunca recompilar los archivos de las plantillas.

Configuración smarty prestashop

– Opciones CCC:

Las primeras dos opciones reducen código juntando ficheros .css o .js para que el navegador los descargue mas rápido. Las otras dos están muy claras pero cuidado con mover el javascript al final, en algunas páginas es necesario que esté al principio porque si no la página no nos cargará bien. Si ves que tu página no carga bien, desactiva esta opción.

Si creas una copia de los ficheros .css y javascript y utilizas dominios externos para alojarlos, mejorarás considerablemente la carga de tu página, ya que los navegadores permiten la descarga simultánea de ficheros desde diferentes dominios a la vez. Amazon Web Services ofrece un servicio excelente para esto. En otro post explicaré cómo crear y configurar diferentes servicios de Amazon para este fin.

ccc

– Servidores de media:

A continuación viene la parte de los servidores de media, (media servers); estos sirven el contenido estático, css, js e imágenes en paralelo sin añadir cookies, permitiendo que el navegador descargue datos más rápido.

En primer lugar, deberéis crear tres subdominios en vuestro hosting, que tienen que apuntar a vuestro dominio principal donde tengáis alojada la tienda;luego insertáis esos subdominios en los siguientes apartados.

servidores_multimedia

Esto tiene un problema y es el sitemap, en él aparecerán las direcciones http://estatico.midominio.com y esto no suele gustar mucho a los buscadores… La solución sería cambiar estas direcciones por  http://midominio.com. Podéis hacerlo manualmente pero yo creo que la mejor forma es generar el sitemap antes de poner los subdominios o, si ya tenéis la tienda online funcionando, quitar los subdominios, generar el sitemap y volver a poner los subdominios. Creo que merece la pena este esfuerzo para la recompensa que se obtiene en el tiempo de carga. Hay que recordar decirle al módulo de SEO que no genere sitemaps automáticamente.

– Cifrado

Esto es para el cifrado de los datos de las cuentas de usuario de Prestashop y aquí lo que hacemos es ajustar la manera en que lo hace. El cifrado Rijndael es el más apropiado en este caso, pero deberás asegurarte de que tienes instalada la extension PHP Mcrypt en tu servidor. Puedes descargarla desde el enlace que te ponen.

Cifrado en las opciones de prestashop

– Caché

Esto guarda algunos ficheros estáticos que hace que luego se puedan recuperar antes si ya han sido guardados y así no ser procesados por el servidor. La mejor opción es la de Memcached, que es fácil que tu servidor la tenga instalada pero necesitaremos comprobarlo; si no es así puedes marcar la opción de Sistema de archivos.

Configuración de caché en prestashop

Consejos para optimizar nuestro Joomla

Empezamos con las optimizaciones para hacer volar nuestro Joomla

Caché de Joomla

La caché de Joomla permite generar las páginas previamente en el servidor antes de que el usuario las acceda, de manera que cuando el usuario visita una página de nuestro sitio web, ésta ya está generada y se sirve más rápido. Esto supone una mejora en la velocidad del sitio web. Veamos cómo configurarlo.

Lo primero que tienes que hacer es habilitar la caché de Joomla. Nos iremos al panel administrativo de Joomla, Sistema > Configuración global > Sistema, y seleccionaremos la opción “Caché conservacional” en el parámetro “Caché”.

cache joomla velocidad

Ya tenemos configurada la caché de Joomla, sigamos…

Caché avanzada en Joomla3 con JotCache

JotCache es una extensión que mejora el funcionamiento por defecto de la caché de Joomla que acabamos de configurar. Permite obtener mejores resultados en el cacheo de las páginas, lo que mejorará la velocidad de carga de nuestro Joomla. Vamos a ver cómo instalarlo y configurarlo.

Lo primero que haremos es descargar la extensión. Podemos hacerlo desde aquí.

Descargaremos la última versión estable de la extensión. A la hora de descargar la extensión, fíjate en descargar la versión compatible en este caso con Joomla3.

Una vez descargada, iremos a Extensiones > Gestor de extensiones en el panel administrativo de nuestro Joomla3, y procederemos a instalar el paquete descargado.

instalación jotcache joomla velocidad

Una vez instalada la extensión, accedemos a Componentes > JotCache para revisar algunas cosas que debemos de tener en cuenta.

Para que JotCache esté funcionando correctamente, los tres indicadores de arriba a la izquierda deben de estar en color verde. Para conseguir esto, tendremos que hacer lo siguiente:

Habilitar plugin JotCache y ponerlo el último de los plugins de tipo “system”

Para ello nos vamos a Extensiones > Gestor de Plugins, y nos aseguramos que el plugin JotCache está habilitado:

configuración plugin jotcache Joomla velocidad

Además de esto, tendremos que ordenar el plugin JotCache, de manera que quede el último de los plugins del tipo “System”. Hacer esto es bastante sencillo, para ello emplearemos el filtro de la izquierda para seleccionar los plugins del tipo “System”, ordenaremos los plugins por el criterio “Orden”, y por último arrastraremos el plugin JotCache con el ratón para situarlo el último de la lista. Fíjate que el orden de los elementos en el panel administrativo de Joomla3 se hace situando el ratón sobre el borde izquierdo del elemento (en este caso el plugin JotCache), y arrastrando arriba o abajo el elemento con el ratón.

Estos dos pasos anteriores son importantes a la hora de configurar de manera adecuada JotCache.

Configuración del plugin JotCache

Ahora vamos a ajustar el comportamiento de la caché a través del plugin JotCache. Para ello nos vamos a Extensiones > Gestor de plugins, y accedemos al plugin “JotCache”. Dejaremos los parámetros de configuración del plugin tal y como aparecen en la siguiente captura:

configuración plugin jotcache Joomla velocidad

Lo más interesante a comentar de estos parámetros de configuración, es que le estamos indicando al plugin que vuelva a generar la caché de las páginas cada 300 minutos. Esto provocará que cada 5 horas se vuelvan a generar las cachés, con lo cual se actualizarán los contenidos de tu sitio web con los cambios que hayas podido hacer en las páginas, módulos, etc.

Hasta aquí tenemos configurada la caché de nuestro Joomla3. Si pruebas a navegar por tu sitio web ahora mismo, podrás ver a simple vista que la velocidad de la web ha mejorado de manera significativa.

Seguimos con más mejoras…

Activar la compresión de las páginas

En este punto lo que vamos a hacer es decirle a Joomla que comprima el contenido de las páginas de nuestro sitio web, de manera éstas ocupan menos espacio y tardan menos en viajar desde el servidor donde esté alojada hasta el ordenador del usuario que visita la web. El concepto es simple, cuanto menos ocupe el contenido de la web, menos tardará en descargarse.

Para activar la compresión de las páginas, lo único que tenemos que hacer es habilitar un parámetro en Joomla que se llama “Compresión Gzip de las páginas”. Para ello, nos vamos a Sistema > Configuración global > Servidor, y marcamos “Si” en el parámetro correspondiente:

compresión gzip optimización velocidad joomla

Con este sencillo paso ya tenemos habilitada la compresión de nuestras páginas en Joomla.

Habilitar urls amigables y fichero .htaccess

Lo siguiente que vamos a hacer va a ser habilitar las urls amiglables en nuestro Joomla. Esto hará que el funcionamiento de Joomla sea más óptimo y que se haga uso del fichero .htaccess, que nos permitirá mejorar algunos aspectos de la velocidad de carga de nuestro Joomla.

Para habilitar las urls amigables, nos iremos a Sistema > Configuración Global > Sitio. Una vez aquí, en la sección “Configuraciones SEO”, habilitaremos los parámetros “URLs amigables” y “Usar la reescritura de URLs”:

seo joomla optimización

Una vez hecho esto, editaremos el fichero .htaccess de nuestra web, y añadiremos las siguientes líneas al inicio del fichero:

<FilesMatch “\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$”>
Header set Expires “Wed, 15 Apr 2020 20:00:00 GMT”
Header set Cache-Control “public”
</FilesMatch>

<ifModule mod_deflate.c>
<filesMatch “\.(js|css|html|php)$”>
SetOutputFilter DEFLATE
</filesMatch>
</ifModule>

El fichero .htaccess está situado en la raíz de la web, lo único que tendremos que hacer será abrirlo con un editor de texto (desde el administrador de ficheros de cpanel, o bien a través de ftp), y pegar las líneas de arriba al inicio del fichero.

Éstas líneas optimizan la ejecución del fichero .htaccess, y por lo tanto mejoran la velocidad de carga del sitio web, concretamente mejorando la compresión y la gestión de las cabeceras.

Optimización de la carga de las imágenes con Lazy Load

El peso de las imágenes que tengamos en nuestra web es un aspecto muy importante a tener en cuenta, ya que las imágenes tardan bastante en cargarse en comparación con otros elementos del sitio web.

Vamos a acabar las optimizaciones de nuestra web con una mejora muy interesante. La técnica que te voy a explicar se llama Lazy Load, y permite que nuestro sitio web cargue únicamente las imágenes que ve el usuario en pantalla en ese momento. Las imágenes se irán cargando conforme el usuario vaya haciendo scroll por la pantalla y vayan apareciendo. Esto permite que nuestra web cargue una cantidad de imágenes mucho menor, y que por lo tanto la velocidad de carga mejore.

Para tener esta sencilla optimización en tu Joomla, puedes descargar la siguiente extensión.

Accede al enlace de arriba, descarga la versión del plugin para Joomla3, e instálala en tu Joomla a través del gestor de extensiones. Una vez instalado el plugin, accede a Extensiones > Gestor de plugins, y habilítalo para ponerlo en funcionamiento:

lazy load optimización imágenes joomla

Ahora comprueba que las imágenes de tu web se cargan sólo cuando aparecen en pantalla. Con esto hemos conseguido mejorar la velocidad de carga de nuestra web, reduciendo el número de imágenes cargadas.

¡Déjanos una respuesta!