Inicio > Blog > Tamaños y formatos adecuados de las fotos en una tienda PrestaShop

Tamaños y formatos adecuados de las fotos en una tienda PrestaShop

10/05/2020

¿Conoces cuáles son los tamaños y formatos de imágenes de la plantilla por defecto de una Web en PrestaShop?

Nuestro primer impulso cuando tenemos un teléfono móvil nuevo suele ser personalizarlo, añadir una imagen que nos gusta al fondo de pantalla o cambiarle los iconos de la página de inicio.

Y lo mismo sucede cuando nos planteamos cómo crear una tienda online a través de un theme predefinido: queremos personalizarla, ¿verdad? 

Lo primero que estamos deseando en esos primero momentos de nuestra creación es que refleje la imagen de marca de nuestro negocio, por eso subimos nuestro logotipo o las imágenes de nuestros productos.

Por ello, si acabas de instalar tu eCommerce PrestaShop a tu hosting Web, para ayudarte a personalizar tu página de inicio PrestaShop más rápido, en el post de hoy te presento los formatos y tamaños de imágenes que necesitas para personalizar tu plantilla predeterminada.

¡Vamos con ellos!

¿Qué tamaños y formatos de imágenes necesito para personalizar mi plantilla por defecto de PrestaShop?

La mayoría de las fotos que cargues en el backoffice tendrán que estar en formato de archivo .jpeg o .png.

Este sería el primer requisito básico.

Si tu programa de edición de imágenes no te permite guardarlas en estos formatos, trata de importarlas a uno de estos tipos de archivo.

» Bloque de banner

banner plantilla por defecto PrestaShop

El bloque de banner es uno de los primeros elementos que verás en tu nueva tienda online.

Se muestra en la parte superior de tu página web, así que tiene una gran visibilidad. Utiliza esta zona para anunciar las promociones importantes y que no se las pierdan tus clientes.

Tamaño recomendado: 1110 x 214 píxeles

» Logotipo

logo plantilla por defecto PrestaShop

Una de las imágenes más importantes de tu página Web es tu logotipo.

El tamaño de esta imagen puede variar ligeramente según el diseño de cada logotipo. La anchura máxima que permite el tema predeterminado de PrestaShop es 160 píxeles.

La altura recomendada para esta zona es 40 píxeles; pero el tema puede adaptarse a una altura de hasta 65 píxeles. Las imágenes de más de 40 píxeles no se reducirán, lo cual puede distorsionar el tema por defecto.

Tamaño recomendado: no mayor de 200 x 40 píxeles.

» Slider de imágenes para tu página de inicio

slider plantilla por defecto PrestaShop

El slider de la página de inicio es probablemente el segundo elemento que todo usuario ve de tu tienda.

Realmente, de cara al SEO no es demasiado recomendable usarlas, debido en parte a que ralentizan la Web y, por tanto, la velocidad de carga será probablemente superior a los 3 segundos de máximo que normalmente se establecen para asumir en una página es "lenta".

Pero entresus aspectos más positivos, cabe destacar que esas imágenes tan grandes y atractivas no sólo son llamativas, sino que además se mueven, lo cual capta la atención del usuario.

El pase de imágenes muestra por defecto 3 fotos; te recomiendo que pongas de media entre 3 y 5 imágenes, y no más de 7.

Como consejo SEO, cabe destacar que puedes añadir texto directamente en la imagen, pero los motores de búsqueda no podrán leerlo.

Para mejorar tu posicionamiento orgánico, te recomiendo que utilices la función de superposición de texto incorporada.

No olvides dar formato y destacar el texto importante con la herramienta de formato de encabezados.

Además, si quieres seguir utilizando el texto blanco, asegúrate de que la imagen es oscura para que sea fácil de leer.

Tamaño recomendado: 1110 x 340 píxeles

¿Cómo deben ser las fotos e imágenes de productos que subamos a nuestra Web?

La imagen predeterminada del producto se utilizará en toda tu tienda online en distintos tamaños.

Por ejemplo, las fotos de la página de producto serán más grandes para resaltar el producto, pero serán más pequeñas en el resumen que se muestra antes de pagar, ya que ahí se usan sólo a modo de referencia.

Pero no te preocupes: sólo tienes que cargar la imagen una vez, cuando configures el producto. El software PrestaShop cambiará automáticamente el tamaño de las imágenes con el tema por defecto.

Tamaño recomendado: 800 x 800 píxeles

imagen producto plantilla por defecto prestashop

» Marca de agua

Añade automáticamente tu logotipo corporativo a las imágenes de tus productos para que, si otros los utilizan, no se lleven todo el mérito.

A diferencia de todas las demás fotos con las que hemos trabajado hasta ahora, ésta tendrás que guardarla en formato .gif.

Puedes hacer esta marca de agua del tamaño que quieras, pero asegúrate de que no reste valor a tus productos.

¿Quieres un truco? Si quieres una marca de agua sombreada, configura la opacidad directamente con el módulo incorporado.

También podrás elegir dónde quieres poner la marca de agua con el módulo incluido.

Tamaño recomendado: Cualquiera

Formato recomendado: .gif

» Favicon

Si este icono no te resulta familiar, probablemente es porque todavía no has actualizado tu favicon para reflejar tu página web.

Se encuentra a la izquierda del título de tu página web y aparece antes de cada URL de tu tienda online.

Hay muchos generadores de favicons que pueden ayudarte a transformar tu logotipo.

Asegúrate de guardar la imagen final con el formato de archivo .ico.

Si tienes un logotipo muy complicado, puedes utilizar otra imagen que represente tu tienda online.

Tamaño recomendado: 16 x 16 píxeles o 32 x 32 píxeles

Formato recomendado: .ico

Actualiza esta característica en la pestaña: Preferencias > Temas > Iconos > Favicono

Conclusiones

Una vez que sepas cuáles son las distintas imágenes que necesitas para tu tienda online, utiliza esta "chuleta" para saber el tamaño que tienes que darles.

Nombre de Back Office Tamaño recomendado Tipo de archivo
Bloque de banner 1110 x 214 píxeles .jpeg, .png
Logotipo 200 x 40 píxeles .jpeg, .png
Slider de imágenes para página de inicio 1110 x 340 píxeles .jpeg, .png
Imagen de producto 800 x 800 píxeles .jpeg, .png
Marca de agua Cualquiera (hemos utilizado 76x76) .gif
Favicon 16 x 16 píxeles o 32 x 32 .ico

¿Qué imágenes quieres actualizar en tu página web?

Si quieres personalizar a tu gusto tu eCommerce, no dudes en seguir este listado de consejos para establecer los formatos y tamaños de imágenes más correctos para tu plantilla.

Sigue siempre las tonalidades de tu paleta de colores corporativa y cuida bien de que las fotos sean lo más fehacientes posible. Eso dará aún más profesionalidad a tu trabajo y podrás convencer y fidelizar a tu público.

Imagen principal By Freepik.

Fuente: prestashop.com.

Información de Contacto

Contacta conmigo y te responderé lo más rápido posible !

avatar.jpg

Por supuesto, también dispongo de perfiles
en las redes sociales. Allí nos encontramos.

Cool Blue Outer Glow Pointer

Formulario de contacto

Todos los campos son requeridos
Aviso Legal. Política de Privacidad
© Auriaweb. Diseño Web

Localización

C/ Castelao, 23 2º A Pobra do Caramñal - A Coruña

©2020