¿Cómo ver la tienda mientras está en mantenimiento?

Aunque tengamos nuestra tienda en mantenimiento porque estemos haciendo cambios o porque aún no la tengamos terminada y estemos subiendo productos, podemos estar viéndola (solo nosotros).

¿Cómo ver la tienda estando en mantenimiento?

Es muy sencillo. Solo tenemos que entrar al backoffice de nuestra tienda online PrestaShop 1.7 y añadir nuestra IP. Para ello seguiremos los siguientes pasos:

En la parte superior de nuestro backoffice veremos lo siguiente:

Pincharemos en «Modo mantenimiento» y nos llevará a la siguiente pantalla:

En ella solo tendremos que clicar en «Añadir mi IP» para añadir la dirección IP desde la que estamos navegando. Luego, guardaremos los cambios.

Nada más.

Ya bastará con buscar el enlace a «ver mi tienda» en esquina superior derecha de la pantalla para poder ver los cambios que vayamos haciendo.

Recuerda que mientras el modo mantenimiento esté activado, solo las direcciones IP configuradas en este apartado podrán ver la parte pública.

¿Qué hacer con los productos descatalogados en PrestaShop?

Lo normal si tienes una tienda online en activo es que tengas productos que, con el tiempo, van desapareciendo. Son productos que se quedan obsoletos porque se sacan nuevas versiones o simplemente porque desaparecen.

¿Qué hacer con los productos que ya no tienen stock y nunca más volverán a tenerlo?

Desactivar o inhabilitar el producto

Si el producto de nuestra tienda online se ha quedado sin stock y no se va a reponer, dentro del backoffice de PrestaShop debe aparecer como inhabilitado o desactivado. De esta forma no cargaremos nuestra página de cantidad de productos que no se pueden comprar. Esto crearía mala experiencia para el usuario que navega y encuentra productos que nunca podrá llegar a adquirir.

Redireccionar a otro producto similar

Si tienes un producto similar que puedes ofrecer al usuario en lugar del que está buscando que ya está descatalogado, lo ideal es hacer una redirección 301 desde la misma ficha de producto. Para ello, desde el panel de administración de PrestaShop, entramos en el producto en cuestión y en el desplegable «Redireccionar cuando esté deshabilitado» marcamos la opción «Redireccionado permanentemente (301)». 

Automáticamente nos aparecerá una nueva casilla, la de «Producto relacionado». Ahí buscamos el producto al que queramos redireccionar el antiguo. Por último, guardamos y comprobamos que la redirección se ha hecho correctamente. Para ello entramos en la URL del producto descatalogado. Deberá llevarnos a la ficha del producto que hemos indicado.

 

Redireccionar producto en PrestaShop 1.6
Redireccionar producto en PrestaShop 1.6

Redireccionar el producto a otra página de la tienda

También es habitual hacer una redirección a una categoría (normalmente a la que tenía por defecto el producto que se ha quedado descatalogado) o a la página de inicio con el fin de no generar muchos errores 404 en Google. Para ello, necesitaremos hacerlo en el código (si tenemos conocimientos de programación) o a través de un módulo de redirecciones.

No redireccionar el producto e informar al usuario

Si por el contrario, el producto que ha desaparecido no tiene ninguno similar al que hacer la redirección, una solución sería perfeccionar el diseño y el contenido la página de «producto no disponible» para informar al usuario de que ese producto ya no lo volveréis a tener en la tienda y para invitarlo a seguir navegando por la web. De esta forma, vamos a reducir el rebote que, inevitablemente, causa una página de error 404.

Este método, como decía, generaría un error 404 de cara a Google en cada ficha de producto que desactivéis. Esto quiere decir que, si esa URL estaba indexada por el buscador, va a desaparecer con el tiempo ya que no encuentra contenido en ella para ofrecer ante una búsqueda. Evidentemente, afectará al posicionamiento si esa URL era relevante en vuestra tienda.

Como vemos, no hay una opción válida por encima del resto. Cada una tiene sus ventajas e inconvenientes. Por tanto, nuestra recomendación es que utilicéis el sentido común e intentéis hacer lo mismo que haríais en una tienda física. 

¿Cómo afecta la directiva PSD2 a mi tienda online?

Si tienes o gestionas una tienda online probablemente estés desesperado buscando información sobre la aplicación de la nueva PSD2, la normativa que cambiará el proceso de los pagos online. Hay mucho publicado al respecto, y en todas las noticias una fecha: 14 de septiembre pero, ¿realmente entra en vigor ese día?

¿Qué dice Redsys sobre la PSD2?

REDSYS es la procesadora de pago oficial de la mayoría de los bancos en España. Ante tantas dudas, nos hemos dispuesto a llamarlos para que nos aclararan un poco el tema. Os contamos lo que nos han dicho.

En todas vuestras tiendas tenéis un módulo o plugin que permite activar la pasarela de pago entre vuestro banco y el banco del usuario. Pues bien, la inmensa mayoría de comercios electrónicos en España operan con esta entidad. Nos sorprendió que no tuvieran ningún comunicado oficial en su página web, es por eso que directamente llamamos para informarnos de primera mano. En toda la información que encontrábamos no quedaba del todo clara la fecha de aplicación. En algunos post hablaban del 14 de septiembre y en otros de 2020.

Todavía no te ha pillado el toro

Según nos han contado desde el departamento de atención al cliente de Redsys, el Banco de España ha pedido una moratoria para aplicar la adaptación en todos los agentes que intervienen en el comercio electrónico. Y se ha concedido. Solo falta por fijar la fecha, que ronda entre los 14 y 18 meses. Además, nos han asegurado que están trabajando en sus módulos oficiales para PrestaShop y WooCommerce con el objetivo de que estén preparados en el momento que esté 100% definido todo el proceso.

Por lo tanto, el 14 de septiembre de 2019 las plataformas de pago de tu tienda online pueden seguir como hasta ahora, no vas a tener problemas.

Más información sobre la directiva PSD2

¿Sigues con mil dudas? Nosotros también. Parece que lo único que está claro es que la fecha se amplía. A continuación, os pasamos la información más útil que hemos encontrado al respecto.

  • En el blog de PrestaShop nos informaban en agosto con la directiva PSD2 y cómo podía afectar a tu negocio online.
  • También puedes consultar la noticia en Xataka, aunque el titular de un poco de miedo «la revolución llega a España en Septiembre…»
  • En El País, el pasado 5 de septiembre, publicaban información sobre la moratoria solicitada por el Banco de España.
  • Por último os dejamos el enlace al comunicado oficial del Banco de España donde explican la prórroga concedida:

«… Para evitar posibles efectos negativos para algunos usuarios de servicios de pagos tras el 14 de septiembre, en su Opinión la ABE acepta que, de manera excepcional, las autoridades nacionales competentes puedan trabajar con los PSPs y otras partes interesadas, incluyendo consumidores y comercios, para conceder un tiempo adicional limitado que permita a los emisores de instrumentos de pago…»

¿Cómo afectará la PSD2 a tu tienda online?

Tu banco se encargará de marcarte las pautas cuando lo tengan todo listo. La mayor parte del trabajo le toca hacerla a ellos para aumentar la seguridad en el proceso de autentificación con el usuario final. Sin embargo, según detalla Xataka en su blog, parece ser que las plataformas de pago se integrarán en las páginas de las tiendas online y todo el proceso de compra se hará sin abandonar la web. De momento, seguimos a la espera de más información al respecto y de que los módulos (como el de Redsys) se actualicen oficialmente antes de 2020 para cumplir con la normativa.

¿Cuál es la solución de PrestaShop?

Dependerá de las formas de pago que ofrezcas en tu eCommerce.

Pago con tarjeta (Redsys)

El pago con tarjeta es una de las formas más extendidas, donde la transacción se realiza fuera de la tienda, a través de Redsys. Actualmente, Redsys ha lanzado una nueva versión de su módulo en fase de prueba (beta) que ya permite al usuario pagar sin abandonar la tienda online. Podrás descargar el módulo de Redsys oficial aquí

PayPal

También hemos llamado a PayPal para ver qué nos contaban y nos han asegurado que, al ser una plataforma intermediaria entre dos bancos, no tenemos que hacer ninguna actualización con su forma de pago, ni con el módulo oficial, ni en vuestra cuenta de PayPal Bussines.

Otras formas de pago

En cuanto a las otras formas de pago como transferencia bancaria, contra-reembolso y otras plataformas externas al banco, como es obvio, no hay que actualizar nada al respecto tras la entrada en vigor de la nueva normativa.

Resumiendo…

De momento seguimos a la espera de la fecha oficial del fin de la moratoria por parte del Banco de España, por suerte te podemos confirmar que el próximo 14 de septiembre no se acaba el mundo del comercio electrónico. En cuanto tengamos noticias ampliaremos este post.

Si tienes dudas o quieres comentarnos algo sobre PrestaShop, puedes contactar con nosotros, estaremos encantados de echarte una mano.

Foto de rupixen elegida con cariño en Unsplash.

¿Qué tener en cuenta a la hora de subir una imagen a tu web?

A veces nos ha pasado que entregamos proyectos y el cliente tiene la necesidad de cambiar alguna de las imágenes de la web . Lo que ocurre en muchas ocasiones es que, al modificarla, por desconocimiento, pereza o qué se yo, no se tienen en cuenta parámetros importantes que pueden afectar a la velocidad o a la estética del sitio. Ni tamaño, ni peso, ni resolución, ni proporciones. Es lo que ocurre cuando no se tienen muchos conocimientos del tema, algo de lo más lógico si te dedicas a vender calcetines y acabas de adentrarte en el maravilloso mundo online.

Por eso, para ayudar un poco, hemos preparado este post, para que veas que el tamaño sí que importa cuando hablamos de web.

¿Qué hay que tener en cuenta antes de subir una imagen a nuestra web?

Dimensión de la imagen

Este punto es muy importante. Hemos visto que en muchos casos se compran imágenes de muy buena calidad a tamaños tan grandiosos que incluso nos darían para hacer una lona que tape todo un bloque de edificios. Si quieres comprarla a ese tamaño y guardarla en tu disco duro, no hay problema, puede servirte para otros usos y nadie sufrirá las consecuencias de tanta cantidad de píxeles en un mismo archivo.

Sin embargo, si la tienes que publicar en unos de tus post o subirla a alguna de las páginas de tu web, lo mejor es que investigues qué dimensiones necesitas tener como referencia. Ten en cuenta que si tenemos un bloque de 600×500 píxeles no servirá de nada que subamos una imágenes de 1.200x 1.000 píxeles. Lo único que ocurrirá es que, cuando un usuario entre en tu web, tendrá que esperar un poco más a que se carguen todos los elementos que hay en ella corriendo el riesgo de que, como son muy pesados, se aburra y se marche. 

Por eso, si el ancho de tu bloque o tus productos no es superior a 600 píxeles, de nada te servirá subir imágenes de un tamaño mayor.

Y ahora te preguntarás….

¿Cómo saber cuánto mide la imagen que tengo que cambiar? Formas de saberlo hay muchas.

  • Puedes guardarte la imagen en tu ordenador haciendo clic en ella con el botón derecho del ratón y pulsando «Guardar imagen como…» Luego puedes ver la información del archivo, la cual te mostrará las dimensiones, el peso, etc. También puedes abrirlo con Photoshop y ver sus dimensiones (Imagen > Tamaño de imagen).
  • También puedes medirla con una extensión que puedes añadir a tu navegador. Se trata de una regla de píxeles, Page Ruler. Cuando vayas a medir, recuerda ampliar la ventana del navegador todo lo posible ya que si está reducida, puede que la imagen esté adaptada al tamaño de la ventana y se esté visualizando más pequeña. Para utilizar esta forma de medir debemos tener ciertos conocimientos de maquetación ya que hay determinadas páginas web que están diseñadas con ancho completo y las dimensiones de la imagen pueden variar según el tamaño de la ventana del navegador.
  • Otra opción válida es tener instalada la extensión de navegador Image Size Info. Nos permitirá conocer tanto las dimensiones como el peso con solo hacer clic con el botón derecho del ratón sobre cualquier imagen de la web.

Resolución

La resolución en pantalla es de 72 píxeles/pulgada. Es cierto que para imprimir se utilizan más altas (normalmente 300 ppp), pero en web lo recomendable es usar 72 ppp. Esto es así porque, a diferencia del papel, en la pantalla no podemos controlar la densidad o proximidad de los píxeles.  

Peso

Hay que ser muy precavido con esto y revisar siempre que nuestras imágenes estén en forma. El peso de ellas tiene que ver con los dos puntos anteriores: si subimos una imagen de grandes dimensiones y con una resolución muy alta, el peso del archivo será mucho mayor que si optimizamos estos dos parámetros. Pero además, hay otras informaciones como los metadatos, perfil de color, etc. que se almacenan junto a nuestras fotografías sumando Kilobytes y haciendo al archivo aún más pesado.  

Para dejar nuestras imágenes estilizadas y eliminar toda esa información adicional, te recomendamos un par de herramientas. Hay muchas más. Si quieres, busca en Google «Herramientas para optimizar imágenes» y te saldrán cientos de artículos de otros blog con recopilaciones de las que ellos consideran mejores. 

Por supuesto, también te sirve Photoshop. Si elegimos «Guardar para web…» tendremos diferentes opciones de configuración. Asegúrate de que la imagen que generes se vea bien, que no esté pixelada, que no sufra pérdida de calidad y sobre todo, que pese poco. El tamaño total de la página debe ser de menos de 1MB así que, ¡imágenes ligeritas de peso!

 

Guardar para web Photoshop

 

Proporción

Esto es algo que molesta mucho a la vista de los diseñadores. También a la del resto de mortales, pero a ellos especialmente (o eso dicen). No hay que olvidarse de que si subimos una imagen a nuestra web con una proporción diferente a la que tenía inicialmente, luego la maquetación no cuadra. La tienda online que era bonita cuando te la entregaron se empieza a convertir en un pequeño mercaillo de imágenes bailongas. No es eso lo que queremos.

Por ejemplo, si en una galería de fotos de nuestra web teníamos varias imágenes en una misma fila de 500×500 píxeles, es decir, cuadradas; no podemos cambiar una de ellas por una imagen que no mantenga esa proporción ya que ocurrirían cosas como estas:

 

Imagen desmaquetada por proporción

 

Espacio en blanco por arriba y por abajo. Poco estético a menos que tenga alguna intención, ¿no?

Otro tema similar que nos encaja para tratarlo brevemente en este punto es el de las imágenes alargadas o achatadas. Recordamos que siempre que queramos escalar una imagen, debemos hacerlo manteniendo pulsada la tecla de «mayúscula» o «SHIFT» de nuestro teclado o bien marcando «restringir proporciones» en Photoshop.

 

Escalar imágenes proporcionalmente

Gif de Chris Phillips

Nombre del archivo

No queríamos pasar por alto este apunte. Los nombre de los archivos que subimos a nuestra web indican a Google el contenido de los mismos. Por eso, no será igual tener una imagen con el nombre «Sin-título.jpg» que otra con el nombre «anillo-de-plata.jpg». Evidentemente es mucho más descriptivo el segundo.

Además, para no tener problemas con tu servidor, recuerda:

  • Para separar palabras, utiliza guiones. Ejemplo: cesta-de-frutas.jpg
  • No utilices tildes, la letra Ñ o caracteres especiales como !, @, #, $, %, ^, &, *, :, ‘.
  • Evita los nombres demasiado largos.

 

¿Cómo puedo reemplazar una imagen de la web forma sencilla?

Antes de decirte cómo hacerlo, debemos entender cómo funcionan la mayoría de gestores de contenido como Prestashop o WordPress a la hora de subir imágenes. Muchas veces, tanto en las tiendas online como en las páginas web, las imágenes que subimos generan unas miniaturas que la propia plataforma utiliza luego en algunas ubicaciones de la plantilla. Por eso, es importante que si lo que queremos hacer es cambiar una imagen que ya está subida, localicemos la «imagen madre», aquella a partir de la cual se generan todas las hijitas más pequeñas. Debemos asegurarnos de que la que modificamos es esa.

Si no tienes demasiada experiencia en el mundo web igual todo esto no te parece tan sencillo, pero bueno, nuestro fin es enseñarte a hacerlo sin que tengas que depender de nadie. Por eso, para no equivocarte a la hora de modificar una imagen de tu sitio, te recomendamos hacer algo tan sencillo como, con el cursor sobre la imagen que quieres reemplazar, haz clic con el botón derecho en «guardar imagen» para almacenarla en tu ordenador. Luego, ábrela con Photoshop o cualquier otro programa de edición y diseña sobre ella. De esta forma te aseguras de que estás tomando las dimensiones y la resolución correcta. 

Para el tema del peso, no olvides «guardar para web» desde Photoshop o limpiar la imagen antes de subirla con alguna de las herramientas que os hemos facilitado cuando hemos hablado de la optimización del peso de los archivos.

¿Por qué debo optimizar las imágenes de mi web?

Por si todo esto que te hemos contado te da pereza digital, vamos a darte algunas razones por las que deberías obligarte a cuidar las imágenes de tu web.

  • Para mejorar la velocidad de carga: El porcentaje de usuarios que ven tu web en móviles cada vez es más alto. Por esa razón, y porque en Internet la paciencia no existe, tienes que reducir el peso de tus imágenes. Mientras más ligeras sean, menos tiempo tardará el móvil o el ordenador de turno en descargarlas para mostrarlas al usuario. Si el tiempo de carga es muy alto, probablemente se marche a otro lugar más rápido que ofrezca servicios o productos similares a los que está buscando. Haz la prueba contigo mismo, ¿cuánto estarías dispuesto a esperar para que se cargue una página?
  • Para que la web siga siendo como era al principio: Te entregan el proyecto, todo en orden, bien colocado, alineado, fotos chulas, velocidad de carga aceptable… De nada sirve todo esto si luego no seguimos el camino que nos marcaron las personas que se encargaron de desarrollar nuestro proyecto. Recuerda aplicar todo lo relativo a optimización de imágenes y cuida el diseño de los banners y slide. 

Con esto que te hemos contado ya tienes una base para que, a partir de ahora, tus imágenes sean lo más light posible. Ten en mente a tus usuarios, tienen poco tiempo y no quieren perderlo. 

Foto de ian dooley elegida con cariño en Unsplash.