fbpx

¿Cómo crear «banners vendedores» para la portada de tu tienda virtual?

Contenido

Empecemos por definirlo.

Sin duda los banners son un elemento publicitario muy efectivo. Por eso, es el espacio perfecto para comunicar tus promociones u ofertas especiales. Y es importante ¡que lo aproveches al máximo! ya que un banner vendedor debe ser llamativo y persuasivo para que nuestros usuarios hagan clic sobre el banner.

Estructura de un «banner vendedor».

Antes de empezar, me gustaría compartirte un poco mejor cómo luce un banner vendedor y también unas serie de tips que, en resumen, te ayudarán a potenciar los banners que crees para tu tienda virtual.

Primero, te traigo un ejemplo de Falabella y su una página web que podríamos decir, aprovecha mucho los banners vendedores para incentivar la compra de sus diversas categorías de productos:

Como puedes ver lo más resaltante de todos ellos, son las promociones y descuentos ¡y está más que bien! Porque recuerda, tus banners serán una vitrina para lo que ofertes (especialmente desde tu portada) ya que desde aquí, puedes despertar el interés de tu usuario e invitarlo a que explore tu tienda virtual de Plenishop.

Por eso, hoy te enseñaré las características fundamentales que debes considerar para crear “banners vendedores” resumido ¡en solo 5 puntos!

Empecemos con la lista:

1) Formatos y Tamaños.

Algo muy importante a considerar en la creación de tus banners web, es determinar el formato del archivo y tamaño del mismo. Te preguntarás, ¿qué significan y cómo influye en tu banner?

Formatos de archivos

Veamos, cuando hablamos del formato de un banner te hablo de la especificación del archivo. Esto es determinante para el tipo de banner que quieras crear, existen estos formatos:

  • JPG: es perfecto para mostrar fotografías en la web sin ocupar mucho espacio en un servidor y conservando la calidad de las mismas.
  • PNG: es el formato ideal para ilustraciones, gráficos y archivos que necesiten transparencias. Es más pesado que el formato JPG.
  • GIF: es un tipo de animación. Está limitado por 256 colores (por lo que no te lo recomiendo tanto para fotografías). Es una alternativa muy visual para crear banners animados.

¿Cómo puedes identificar qué formato tienes? ¡Muy fácil! El formato de un archivo se ve reflejado en el guardado, lo puedes ver como una extensión seguido de un punto (.) en el nombre de tu archivo.

Por ejemplo: creando.jpg   / mis-propios.png /  banners.gif 

¿Lo ves? Identificando estas extensiones en tus archivos podrás darte una idea del tipo de pieza creada.

Tamaños

Ahora, hablemos de los tamaños de banners. Esto es algo ¡aún más sencillo! Y para ilustrarte mejor, te dejo una tabla con el resumen de los tamaños de banner que puedes usar en tu tienda online:

Tamaño del banner* Nombre del banner Descripción
medida (alto referencial):
1584x472px
PortadaEs el banner que anclamos en la página de inicio de nuestra tienda, es el más grande. Estos banner tienen un ancho fijo de 1584px pero su altura puede variar, siendo más angosta o ancha según la preferencia de la marca. Como estos se presentan en un slider, puedes crear 3 o 4 principales.
medidas referenciales:
316x259px / 635x 256px
ComplementariosSon banners que suelen colocarse bajo el banner de portada (3 o 4 de estos). Pueden variar en forma, tamaño e incluso la cantidad que uses. Son más pequeños que el principal, pero suelen llevar ofertas y botones CTA para agilizar la navegación.
medidas referenciales
1271x240px
Pie de páginaSe llaman así porque van al término de la web, puedes usar uno o la cantidad y tamaños que quieras. Suelen marcar el término promocional con un último «gancho»(oferta) o algún dato netamente informativo.
medidas referenciales:
741x724px
Pop-upEstos son los banners emergentes y suelen cubrir casi toda la pantalla para mostrar una oferta o canje particular que bloquea la vista de nuestra página de inicio.

Así es como más o menos lucirían los banners que te acabo de describir:

Si bien, este es un modelo base, ya que tú puedes definir la estructura que le das a tu tienda online de Plenishop. Al igual que las medidas precisas para tus banners. ¡Eres quién decide cómo armarla!

IMPORTANTE. Al momento de diseñar y guardar tu banner, recuerda que sin importar el tipo o tamaño que sea tu banner, este nunca debe exceder los 150kb. De lo contrario, tendrás un banner muy pesado que afectará la velocidad de carga de tu web.

2) Elementos gráficos.

El propósito de tu banner es atraer al público por lo que el diseño del mismo, debe ser llamativo ¿cómo? Bueno empecemos por lo principal.

  • Nuestro producto o servicio destaque en la gráfica con una buena representación fotográfica.
  • Puedes considerar incluir diversos elementos gráficos como fotografías, vectores y formas ¡no hay límite! Solo intenta crear gráficas armoniosas en las que haya un balance entre la parte visual y el mensaje.
  • El mensaje principal de tu gráfica, a nivel de composición, es también un elemento gráfico más que debes buscar destacar lo mejor posible ¿a qué me refiero?, destácalo quizás con un tamaño de texto mayor o buscar resaltarlo con un elemento visual grande en la gráfica, como un descuento o promoción (esto hará aún más llamativo tu anuncio)

Aquí algunos ejemplos:

Una opción de banners de portada, cuando tenemos campañas en toda la tienda se puede recurrir a diseños más tipográficos (solo texto), como este:

O puedes optar por combinar el anuncio con tu producto, así brindas una comunicación más completa, atrayendo a los usuarios tanto por tu producto como por la campaña que ofertas:

3) Estilo propio e identidad de marca.

Algo que no debe faltar en tus diseños de banners, es tu esencia de marca. Es importante que hagas notar tus lineamientos gráficos sin irte a algo alejado a tu estilo, ten siempre presente que tu marca debe vivir siempre en armonía con tus diseños.

Por ejemplo, ¿viste las gráficas anteriores? Como ves, ambas pertenecen a la campaña del CyberWOW pero cada marca ha logrado «darle la vuelta» a su diseño en algo tan estandarizado como es el Cyber.

Eso significa de que claramente esta campaña es la misma, pero tanto Linio como Ripley han tratado de llevar su estilo gráfico y composiciones, lo más alineado posible a lo gráficamente válido a sus marcas ¡todo un reto, lo sé!

Pero puedo decirte, que es cuestión de que puedas usar referencias, encontrar el estilo gráfico que más te guste y empezar a aplicarlo como una guía en todos tus banners. Ojo, con esto no te estoy diciendo que uses un mismo diseño para todo; sino más bien, que comiences a experimentar con todo lo visualmente atractivo con el lineamiento gráfico que te guste ¿a qué me refiero con ello?

Mas adelante te enseñaré a crear tus propios banners usando una herramienta gratuita, por lo pronto deseo que tomes en cuenta cada una de las pautas antes de diseñarlos.

Si tu marca tiene un logo de un estilo algo clásico/minimalista y tiene como paleta de colores inicial, unos tonos pasteles. Prueba con incluir diseños que combinen tus productos con demás elementos gráficos en tonalidades pasteles, crear una estructura no tan cargada (que mantenga lo «minimal»). Así te irás acostumbrando y a la vez, construyendo un lineamiento gráfico sólido para tu marca.

Mira esto:

¿Lo ves? Tenemos 2 banners completamente distintos, que «viven» dentro de un mismo lineamiento gráfico.

4) Coherencia en el mensaje.

Como ya te habrás podido dar cuenta, los banners se caracterizan por tener textos breves, por eso es importante que seas conciso.

Lo más llamativo en un banner es ver las palabras: LIQUIDACIÓN, NUEVO LANZAMIENTO o colocar el DSCTO. con su % con un gran tamaño en la gráfica.

Sea cual sea el mensaje que busques destacar, comunícalo claramente y refuérzalo utilizando fotografías acordes a tu imagen de marca, compartiendo un mensaje directo que conecte con tus usuarios.

Es decir, sé claro, breve y utiliza un lenguaje acorde al target(público) al que te diriges.

5) Gatilladores persuasivos.

Recuerda de que el elemento vendedor más efectivo que tendrá tu banner, es el precio o la promoción, así que siempre hay que buscar potenciarlo con recursos extra que nos permitan agilizar la compra.

Uno de estos recursos, son los gatilladores persuasivos ¿y qué son? Son elementos, frases o palabras que despiertan el interés del público que refuerzan nuestro banner, haciéndolo más efectivo.

Estos gatilladores pueden usarse de forma individual o usarlos en conjunto al precio para hacerlos más impactantes. Aquí te comparto los 3 tipos de gatilladores persuasivos más populares:

  • PALABRAS: Una sencilla palabra como: UNO GRATIS, REGALO o 3×2 puede convertirse en ese empujoncito que nuestro usuario necesita para efectuar su compra.
  • FRASES: También puedes optar por usar algunas como: SOLO POR HOY o ÚLTIMAS HORAS. La verdad es que puedes usar la frase que quieras, la idea es que esta sea convincente y refuerce nuestra promo.
  • CONTADOR REGRESIVO: Este sin duda es un elemento bomba y crea un sentido de urgencia mucho más potente que los 2 anteriores. ¿Por qué? Porque siembra la incertidumbre y sentido de urgencia en el usuario por realizar la compr, creas en su mente la idea del «es ahora o nunca». Sobre los contadores existen dos formas:
    • El primero, una cajita con la cuenta regresiva que nos muestra las horas, minutos y segundos restantes de la promo (Ejemplo en la imagen de abajo)
    • La segunda opción, es un contador que nos muestra las unidades restantes del producto (Ejemplo: SOLO QUEDAN X UNIDADES)

Aquí te dejo un banner que fusiona los gatilladores persuasivos junto al precio (En mi opinión, muy efectiva combinación) Veámoslo:

Llamados a la acción.

La llamada a la acción, es el famoso CTA (Call To Action) y es sumamente importante en el entorno digital. Es lo que podríamos decir, termina por darle un propósito a nuestro banner.

¿Qué significa esto? el llamado a la acción, gráficamente suele ser representado por un texto corto que extiende una invitación al usuario. Va dentro o acompañado de un botón, que está enlazado a la tienda y permite hacer visible el objetivo del anuncio ¡es un recurso muy eficaz!

Por ejemplo, si el objetivo de tu banner es captar la atención del usuario y que descubra más sobre el producto o promoción que anuncias, sería necesario incluir un botón o enlace que los lleve a este con un botón CTA que diga: Más info”, Comprar ahora” o Quiero saber más”.

Estos son algunos de los textos más utilizados, pero tú puedes hacerlos más propios, lo importante es que todos ellos inviten al usuario a tomar una acción. Algo tan simple como esto, logrará que el usuario le de clic:

Tipos de Banners.

Banner de formato integrado.

Este es el tipo de banner más utilizado y con mejor aceptación por los usuarios en la web. Es por eso, que suelen usarse con gran frecuencia ¿cómo los distingues? Pues son los banners que te aparecen en la página principal y puedes aprovecharlos al máximo gracias a su gran tamaño.

Banner complementario.

Este tipo de banners se caracterizan por ser los banners de «relleno» de una página web. Suelen estar debajo del banner de portada principal y pueden variar de tamaños. Normalmente se utilizan estos banners para organizar mejor la página, ya que estos se pueden distribuir para crear categorías de productos o llevar a un descuento específico desde menú de inicio. Estos banners son como los «atajos» para facilitar la navegación del usuario y también para destacar los productos que queramos. Aquí te dejo unos ejemplos…

Falabella utiliza mucho este recurso, como ves distribuye y juega con el tamaño de los banners para mostrar sus diversas categorías de productos. Estos los puedes ver justo debajo del banner principal en su menú inicial:

Con esto, la marca ha creado accesos rápidos a cada categoría y además un gran «gancho» que son los super descuentos que le dan más valor a cada uno de ellos ¿viste?

Ahora, si no eres partidario de saturar tu página, puedes optar por una opción más sutil como esta:

Banner anclado.

Estos banners varían en forma y tamaño. Pueden estar dispersosa lo largo de una pagina web, suelen usarse para un mensaje de urgencia como: una liquidación u oferta especial y están anclado en un lugar fijo. Lo característico de estos banners, es que poseen una “x” para poder cerrarlo, ya que pueden molestar o ser intrusivos en la navegación.

Banner pop-up.

Este es un banner más invasivo y que suele aparecer al entrar a una página web. Se caracteriza por cubrir la pantalla en su totalidad para que este banner pueda ser protagonista, normalmente se utiliza para mostrar una promoción especial, canjear o regalar cupones a cambio de un registro en la web o suscripción para la base de datos de la marca. Aunque otras veces, el pop-up puede ser netamente informativo (sin botones CTA). Así como el banner anclado, también posee una «x» para cerrarlo y poder dar inicio a la navegación. Aquí algunos ejemplos:

Este banner aparece apenas ingresas a la web y ofrece un cupón de descuento para tu primera compra con solo ingresar tu mail.
Este otro, aparece al intentar leer un artículo de blog, bloqueando la lectura.

Como ya viste hasta ahora, los banners no tienen un formato estándar, ya que pueden variar en apariencia y forma. Pero lo que sí tienen en común, es que estructurados correctamente pueden tener un gran impacto visual, estimulando al usuario y fomentando el recuerdo. Además, de que son elementos publicitarios “medibles”.

¿A qué me refiero con eso? a que podremos evaluar su efectividad, ya sea por visualizaciones o clics. Y hasta es posible medir esas acciones que conocemos como “conversiones” logradas por los usuarios en base a nuestros objetivos, ya sea una compra o un registro ¡en verdad podemos usar los banners para lo que queramos! Toda esta analítica, puede activarse también en tu tienda online de Plenishop, si está bien implementada ¿fantástico no?

Herramientas para crear tus propios banners.

Ahora que ya sabemos más de los banners, te mostraré algunas de las herramientas que puedes utilizar para crear tus propios banners de forma online ¡y desde cualquier dispositivo! Aquí te dejo mi Top 3 de aplicaciones:

Canva.

Es una de las herramientas de diseño web más populares. Es muy conocida y usada, gracias a la gran variedad de plantillas y recursos que ofrece de manera gratuita. Esta herramienta está disponible en su versión desktop y mobile, para que puedas crear tus banners desde el dispositivo que tengas disponible. Con ella puedes crear tus banners y, además, encontrarás imágenes con el mismo estilo para tus redes sociales, carteles y muchas otras más ¡Dale un vistazo a todo lo que tiene para tu emprendimiento!

RapidBanner.

Es también una herramienta gratuita pero a diferencia de Canva, esta se especializa únicamente en la creación de banners y está disponible únicamente desde la PC.  Lo mejor de esta herramienta online, es que te permite generar varios formatos de banners a la vez y posee un editor muy intuitivo, con un gran nivel personalización de tus piezas. ¿Te animas a probarlo? ¡empieza a experimentar!

Fotor.

Es una herramienta gratuita de gran utilidad, que te ayudará con la creación de tus banner y demás piezas gráficas que quieras crear. Cuenta con una gran variedad de plantillas y formato que puedes explorar para crear todo lo que te imagines, de forma online. Lo mejor es que también está disponible para PC y mobile así que, ¡no hay excusas para no crear diseños increíbles!

Prueba cada una de estas herramientas y empieza a crear en la que te sientas más cómodo, ¡tienes mucho que explorar!

Crea un banner paso a paso en Canva.

A continuación, te mostraré lo fácil que es crear tus propios banners usando la herramienta Canva. ¡Aprenderemos juntos! Así que, empieza por hacer clic aquí

1 Una vez que hagas clic en el link que dejé para ti líneas arriba, estaremos en la página de inicio de Canva. Y al ser tu primera vez en la plataforma, le daremos clic al botón «Regístrate» . En esa sección tendrás la oportunidad de registrarte usando Google, Facebook o tu correo electrónico; elige el que prefieras ¡y arranquemos!

Recuerda que al registrarte eres un usuario Canva, por lo que en tus próximos ingresos deberás ingresar desde el botón «Iniciar sesión».

2 Luego de haberte registrado, estaremos nuevamente en el menú principal de Canva. Ahí podrás ver la gran variedad de plantillas disponibles. Pero para crear nuestro banner, nosotros iremos a la barra de búsqueda y escribiremos en ella la palabra «banner». Al hacerlo, nos aparecerá un desplegable con todas las medidas de banners disponibles:

En esa sección, si haces scroll hacia abajo, también te aparecerán algunos banners predeterminados que puedes utilizar para el cover de tus redes o de blog. En esta oportunidad, yo seleccionaré: «Banner para blog», ya que su medida es similar al de los banners de portada web.

3 Inmediatamente después de haber elegido la pieza que quieres crear, te cargará el editor de Canva. En este veremos el lienzo en blanco con una panel de edición al lado izquierdo donde también verás las plantillas disponibles. Al ser tu primera vez en esta plataforma, te recomiendo hacer clic en el botón morado «Siguiente» para ver un paso a paso del proceso de creación:

4 Bien, antes de empezar a diseñar el banner, te mostraré rápidamente las herramientas que tiene Canva. A un extremo de la pantalla encontrarás las secciones: Plantillas, Elementos, Archivos subidos, Texto y Más. Las encuentras en la parte izquierda de tu pantalla y lucen así:

En la sección de Plantillas no entro a detalles, porque ya estamos en ella desde que ingresamos al editor de Canva. Y como ya viste, en esa sección puedes explorar todos los diseños predeterminados fácilmente.

Luego del esta, veremos la sección de Elementos que como verás es muy completa ya que en ella aparecerán todo tipo de recursos. Desde formas básicas y líneas hasta archivos de audios e incluso una sección de búsqueda de más recursos. Este es un resumen de todo lo que puedes encontrar en esta sección:

Pasando a la sección de Archivos subidos, veremos que únicamente tendremos el botón «Subir». Pero conforme subamos a Canva todos nuestros archivos (imágenes o videos), ahí es donde los tendremos almacenados.

Podrás ver tus archivos organizados por categorías.

La siguiente sección es Texto y como bien dice su nombre, encontraremos todo tipo de tipografías para títulos, subtítulos o párrafos:

Y por último está la sección Más en la que verás una infinidad de categorías y demás integraciones que puedes explorar por tu cuenta para crear banners y otras piezas ¡mucho más potentes!

5 Luego de ese mini-recorrido por Canva, volveré a la sección Plantillas y haré clic en una de las plantillas predeterminadas de Canva. Imaginemos que tengo un emprendimiento de calzados para niños y quiero que el diseño se alinee a mi marca luciendo colorido y divertido. ¿Logran imaginar lo que busco? Con eso dicho, elegiré como punto de partida, esta plantilla y no moveré nada aún:

6 Después, iré a la sección de archivos subidos y cargaré la foto principal de mi banner. Una vez listo, arrastraré la foto al lienzo donde ahora está la plantilla elegida. Ahí comenzaré a mover y eliminar elementos (haciendo clic derecho).

¡Aquí ya empieza lo tuyo! con todo lo que te he mostrado en pasos anteriores, es momento de que empieces a crear. Pon tu imaginación a trabajar, hasta que te sientas satisfecho con el resultado.

7 Ahora, ¡es tiempo de mostrarte mi creación! Como podrás ver, jugué con los elementos de la plantilla seleccionada para crear una composición lúdica alineada a mi marca y los colores que también combinan con los de mi foto elegida.

También, añadí un mensaje claro y conciso de lo que quiero vender: «TODO AL 70% DSCTO.» Como ves, no necesito entrar en tanto detalle con el texto, porque mi imagen ya está vendiendo el producto. Para terminar de hacer «vendedor» mi banner, recurrí al uso de un botón CTA con el texto: «¡VE POR TU FAVORITOS!» y la manito que refuerzan la acción de hacer clic para que mis clientes puedan ir a mi tienda o a la sección con los descuentos.

¿Viste lo fácil que fue? ¡Canva lo tiene todo! Así que solo es ahora te toca experientarlo. Por plataformas como esta, te dan toda la libertad de crear lo que quieras. Solo es cuestión de que te decidas a explorarlo…

Recomendaciones finales.

Con todo lo que te he compartido hoy, la idea es que poco a poco puedas ir aplicando estos consejos en tus banners. Porque usados de la mejor manera, verás su efectividad reflejada en la respuesta del público hacia tus anuncios y marca.

Intenta probar las herramientas recomendadas y ve descubriendo cuál prefieres. Recuerda que cuanto mejor las domines, mejores serán los resultados que obtengas. Lo ideal es lograr que tu tienda virtual se encuentre «bien vestida» porque al fin y al cabo, tus banners de inicio serán tu carta de presentación para los usuarios. Procura darte esa oportunidad de trabajar en cada detalle de tu tienda online y podrás convertirla en un verdadero «radar de clientes», logrando que tus banners y el contenido mismo, sean generadores de tráfico: visitas y compras a tu tienda online.

Ahora es tu turno, ¿estás listo para empezar a crear tus propios banners? Entonces sube otra vez a la sección de herramientas ⬆ ¡y empieza a crear! Cuando los tengas listos, puedes vsubirlos a tu tienda online de Plenishop.

¡Comparte!

Facebook
Twitter
WhatsApp
LinkedIn

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *