Me he decidido escribir este artículo de cómo acelerar la velocidad de prestashopConcepto de Prestashop¿Qué es el Prestashop?Prestashop es un gestor de contenidos, CMS, o además una plataforma. Se trata del sistema con el que se pueden crear tiendas online de forma fácil y sencilla, contando con todas las herramientas para elaborar catálogos de productos, determinar fichas, precios y facilitar otras estructuras como las de carrito de compra o sistemas de pago.Es todo lo que una web necesita para convertirse en una más 1.5, porque la información que he encontrado buscando en Internet, en su gran mayoría, tiene uno o varios años y quería actualizar algunas novedades que existen en la actualidad respecto de este tema.
¿Por qué es tan importante acelerar la velocidad de prestashop 1.5?
La velocidad de una tienda online es un factor importante para el SEO ¿Qué es SEO o search engine optimization? Conjunto de prácticas destinadas a mejorar el posicionamiento de una web en el ranking de resultados de los motores de búsqueda. Al contrario que la estrategia SEM, que contempla la inclusión de enlaces contratados para obtener este objetivo, el procedimiento SEO se ocupa exclusivamente de los resultados naturales (no pagados) localizados por el algoritmo propio de cada buscador. Para esto contempla ajustar más (Search Engine Optimization) y además es importante para mejorar la experiencia de nuestros clientes que visita nuestra tienda online. Cuántas veces has hecho clic en una tienda online y al cabo de 4 o 5 segundos de no tener respuesta, cerramos dicha tienda online, pues para evitar que te suceda esto, ponte manos a la obra y sigue esta serie de recomendaciones.
En la actualidad no se cuenta con eficientes módulos gratuitos que permitan acelerar la velocidad de prestashop, esto nos lleva a tener que realizar muchos de estos ajustes de forma manual y con la ayuda de algunas herramientas gratuitas que explicaré a continuación.
Pasos para acelerar la velocidad de prestashop 1.5
1.- Abre el backend de tu tienda online en prestashop y haz clic en Parámetros avanzados -> Rendimiento.
En esta parte de tu backend de prestashop configurarás los siguientes aspectos:
a) Cache. Activa la opción de cache, tal y como se ve en la imagen.
<noscriptNoScript es un complemento del navegador para Mozilla Firefox, que impide que se cargue en las páginas web contenido como JavaScript, Flash o iFrames. Su objetivo es incrementar la seguridad durante la navegación y quitar la promoción comercial más molesta al cargar sitios web. El términoNoScript tiene un significado distinto en la programación HTML. Cuando JavaScript está desactivado, la etiqueta <noscript> o </noscript> asegura que el usuario pueda ver el más>
Activa las opciones de CCC (Combine, Compress and Cache)
2.- Modificar tu archivo .htaccess puede acelerar la velocidad de prestashop.
Recuerda hacer una copia del archivo para poder volver atrás en caso de fallo, aunque siempre puedes regenerarlo de nuevo.
a) Añadir una fecha de caducidad a las imágenes, javascriptJavaScript es un lenguaje de programación que funciona en el lado del cliente y con el que las webs pueden ser más funcionales. Incorporación en código HTML El código JavaScript puede ser incrustado en las páginas HTML, para que adquieran funcionalidad. Existen varias opciones. Puede estar entre las etiquetas <SCRIPT> y </SCRIPT>, puede estar contenido en un archivo externo, puede ser un parámetro de las etiquetas HTML, y puede estar más, cssConcepto de CSS¿Qué es el CSS?CSS es un lenguaje de programación que se usa para definir el estilo y el aspecto de un documento que se ha escrito mediante de un lenguaje de etiquetas, como HTML. Conocido además como hojas de estilo en cascada, es el que se emplea para dar colores, indicar tipos de letra o inclusive resaltar aspectos como el espacio entre items para dotar de estilo a más y texto:
ExpiresActive On
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType text/javascript A2592000
ExpiresByType application/javascript A2592000
ExpiresByType application/x-javascript A2592000
ExpiresByType text/css A2592000
b) Comprimirs la tienda online mediante el método deflate:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xmlEl lenguaje de marcado XML es menos complicado que su nombre ("Extensible Markup Language") puede hacer creer: Un archivo XML contiene texto altamente estructurado, semejante a los archivos HTML. No obstante, la estructuración del texto es tan clara y lógica que puede utilizarse para mapear bases de datos enteras. XML se usa frecuentemente para sitemap que se pueden cargar en la Google Search Console o en las Herramientas para Webmasters más
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-httpd-fastphp
AddOutputFilterByType DEFLATE image/svg+xml
3.- Puedes retrasar la carga de los archivos javascript hasta justo antes de la etiqueta </body>.
Esta acción puede conllevar algún mal funcionamiento, ya que no todos los javascript se puede retrasar su carga hasta final del código, en caso de que te ocurra esta situación, debes identificar cual es el javascript que no podemos retrasar.
4.- Ahora puedes ir a la aplicación Gtmetrix para para ver el resultado de tu trabajo.
Debes revisar principalmente la optimización de las imágenes, css y javascript, y si queda algún elemento que optimizar, lo harás manualmente a través de este programa. Para ello debes seleccionar el archivo optimizado y descargarlo, para posteriormente sustituirlo por el original.
Una práctica habitual es no especificar las dimensiones de las imágenes, Gtmetrix te avisará cuáles son las que no le has introducido el ancho y el alto. Es una tarea un poco muy ardua pero importante, sobre todo en las imágenes del headerConcepto de Header¿Qué es el Header?El Header, encabezado en español, es una definición que se usa en el terreno del diseño y la programación web para referirse a la parte de arriba de una página. Se trata del primer punto a ver por cualquier usuario que entra en un portal web, por lo que cuenta con una responsabilidad enorme y ha de contener la carga informativa esencial para mostrar la más y del footerUn footer o pie de página es una línea o bloque de texto que aparece en la parte inferior de una página o documento separado del texto principal. Los footers incluyen notas en el título de la página, o navegación dentro del documento. En los sitios web, los pies de página son además un área especial que está separada del cuerpo principal y el encabezado. Por lo general, contienen información más.
5.- Si quieres acelerar la velocidad de prestashop 1.5 al máximo utiliza un CDN, que te permita cachear imágenes,css y javascript en un dominioUn dominio es una sección de Internet con direcciones que comparten un sufijo común o están bajo el control de una organización o individuo en particular. Está organizado jerárquicamente. Tanto los objetos físicos como los virtuales pueden ser direccionados con el nombre de dominio. Estos objetos pueden ser webs, ordenadores en red o servicios, como impresoras, faxes o servidores de correo. Cada objeto está referenciado por una dirección IP única, más externo, mejorando considerablemente la velocidad de tu tienda online.
6.- Actualiza tu versión de prestashop.
En cada versión nueva este ecommerceConcepto de Ecommerce¿Qué es un Ecommerce?Un Ecommerce o comercio electrónico es el traslado del comercio tradicional al ámbito digital. Se trata de toda la distribución, la venta, el procedimiento de compra, el marketing y el suministro de información sobre productos y/o servicios tomando como base Internet. Es la actividad comercial en su estado más simple, pero llevada a Internet para sacar provecho de sus posibilidades tanto de cara a la más mejora la gestión de cache y por tanto será una forma de acelerar la velocidad de prestashop.
7.- Módulo de limpieza.
El siguiente módulo solo debes utilizarlo si eres un webmasterEl término webmaster fue utilizado por primera vez por Tim Berners-Lee, el inventor de la World Wide Web, en su documento "Style Guide for Online Hypertext". La palabra se compone de las palabras inglesas "web", forma corta de World Wide Web y "master". En los primeros días de la WWW, a principios de la década de 1990, el término se usaba principalmente como un nombre profesional para las personas que disponen más experimentado en prestashop. Antes de utilizar el módulo deberás realizar una copia de seguridad de tu base de datos, para que en caso de fallo, puedas restaurar la base de datos.
Con este módulo podrás optimizar o eliminar los siguientes elementos; Carrito abandonado, Puntos de fidelidad huérfanos, optimizar tablas, reparar tablas, borrar ficheros smarty, borrar archivos de imagen temporales
Para descargar el módulo tendrás que registrarte en la página de prestashop, y vuelvo a hacer hincapié en que sólo un webmaster avanzado debe utilizarlo.
Espero que puedas acelerar la velocidad de prestashop 1.5 a un pagespeed por encima de 90
Espero vuestros comentarios sobre la experiencia de acelerar la velocidad de prestashop.
Si tienes algún problema para acelerar la velocidad de prestashop 1.5, déjame un comentario.
