Um bom banner para e-commerce pode fazer toda a diferença entre uma venda ou uma fuga do cliente. Muito se discute atualmente sobre a real efetividade desse elemento, mas não dá para negar que, sempre que bem elaborado, funciona muito bem – afinal, é a página com mais destaque e que carrega o impacto direto nos visitantes.

Sabemos que fazer uma peça dessa não é tão simples como parece para alguns negócios, principalmente sem a ajuda de um designer profissional. Isso sem mencionar que nem sempre há orçamento disponível para pagar por esse serviço.

Dito isso, neste artigo vamos dar algumas dicas valiosas de como você mesmo pode produzir os seus designes e deixar sua loja bonita e chamativa para conquistar muitas vendas. Tudo pronto?

Seja simples

A famosa frase “menos é mais” cai como uma luva nesse caso. Muitas informações em um banner para e-commerce fazem com que o cérebro fique confuso e não entenda a mensagem. Com isso, diminui o interesse dos usuários e também as taxas de cliques e de conversão.

Por isso, coloque apenas o que for realmente relevante para aquele momento. Deixe bem explícita a comunicação que pretende passar ao usuário, pois isso torna tudo mais amigável e legível.

Capriche nas imagens

Usar imagens de alta qualidade é fundamental, seja ela de um produto seu ou apenas para ilustrar o banner para e-commerce. Afinal, ela será a primeira coisa que o consumidor verá antes de ler as descrições.

Certamente você já ouviu alguém dizer que uma imagem fala mais que mil palavras, por isso capriche na escolha. Muitas vezes elas substituem várias frases de texto e são mais efetivas.

Além disso, fotos com boa resolução passam mais credibilidade e mostram ao seu cliente que você se preocupou com os detalhes. Como a maioria das imagens da internet têm direitos autorais, escolher a certa fica mais fácil se for utilizado algum banco gratuito, como:

  • Pixabay: permite o encontro de fotos, ilustrações, vetores e vídeos;
  • Unsplash: tem belas imagens para vários segmentos;
  • Pexels: há uma vasta gama de fotos que podem ser usadas para qualquer objetivo legal;
  • Life Of Pix: ideal para quem quer imagens em alta resolução;
  • SplitShire: todas as fotos são em HD. E o melhor: podem ser buscadas por filtros.

Vá direto ao ponto

Assim como as imagens, o texto também precisa ser acertado e sucinto. Diminua a quantidade de texto e aumente o tamanho da fonte. Seja claro no recado, seja ele uma oferta ou ação, pois o usuário não pode ficar com dúvidas.

É muito importante conseguir um bom contraste entre texto e plano de fundo para focar na mensagem passada. Escolha uma cor de texto que se destaque, mas, ao mesmo tempo, harmonize com conteúdo.

Organize as informações

Tome cuidado na hora de organizar os elementos. Dedique atenção especial ao alinhamento e espaçamento, pois não tem nada pior que um desenho bagunçado. Use linhas guias ou opções de alinhamentos disponíveis na ferramenta que você utiliza para fazer o design.

Crie uma hierarquia de importância dos componentes na hora de distribuí-los na arte. Use o princípio da proximidade, integrando informações relacionadas como preço e parcelamento, contato, etc.

Tenha cuidado com as cores

Certamente, as cores influenciam muito o seu banner. No design, estudamos a psicologia das cores e como ela afeta nosso subconsciente. Por isso cuidado com os tons escolhidos e a harmonização feita com eles.

Além disso, nosso subconsciente consegue interpretar os matizes e transformá-los em sentimentos em frações de segundos. Assim, eles podem deixar alguém eufórico, calmo, impulsivo etc. Exemplo: a relação que fazemos da cor vermelha com o amor.

Sobretudo, fique atento ao contraste para não adicionar nada opaco, principalmente nos textos. Por isso, escolha um esquema de cores tríades ou tétrades. Para ajudar a entender melhor esse esquema, esses dois sites podem ajudar muito:

  • Adobe Color CC: gera paletas de cores em smartphones Android e iOS, além do navegador;
  • Color Scheme: oferece opções específicas e combinadas dentro de determinada cor.

Faça testes

Primeiro, não tenha medo de testar! Dificilmente você vai acertar de primeira, por isso faça testes. Crie dois designes diferentes e deixe uma semana cada um para ver qual converteu mais. Assim, gradualmente você vai identificar qual a seleção mais adequada que melhor conversa com seus clientes.

Faça também algumas variações no texto, usando chamadas e subtítulos diferentes. Assim, você pode avaliar em conjunto o tom de voz e a linguagem que mais convertem em ações.

E por falar em testes, você sabe quais gatilhos são usados na hora de criar a o design de capa de um podcast? Conversamos com um especialista no assunto na série especial de videocasts do Dentro do Ringue:

Adicione uma chamada para ação

Os CTAs (Call to Action, ou chamada para ação) são muito importantes para levar o consumidor até a página de conversão. Já se foi o tempo em que um banner apenas ilustrava as promoções do dia ou o que há no site. Agora, é essencial colocar um link para conhecer o produto incrível apresentado.

Por isso, não se esqueça de inserir um botão na imagem para direcionar a uma página específica conforme o objetivo da peça. Lembre-se de manter a expectativa de quem visualizou e dê as informações corretas após o clique.

Use as ferramentas certas

Existem diversas ferramentas gratuitas para criar suas composições facilmente. Com elas, você mesmo pode produzi-las conforme suas necessidades. Mas é preciso escolher as melhores, como:

  • Canva: um dos editores mais famosos, conta com uma versão para dispositivos móveis e desktop e pode ser usado gratuitamente mediante um cadastro. Todos os modelos são editáveis, portanto, é a ferramenta preferida dos designers amadores;
  • Adobe Spark: assim como a primeira opção, o Adobe Spark tem muitos templantes personalizáveis e funciona na mesma lógica. O seu diferencial está na possibilidade de alterar a posição dos elementos sem que ele se desconfigure e precise refazer o trabalho;
  • BannerSnack: similar às demais alternativas, o BannerSnack tem as mesmas funcionalidades e se difere na possibilidade de mudar os tamanhos e layouts a partir de um único banner criado. Isso sem contar que ele trabalha com edição em camadas, o que confere mais personalização.

Preste atenção no tamanho

O tamanho do seu banner também influencia na eficiência. Afinal, isso pode comprometer a experiência do usuário se estiverem maus recortados, além de passar uma péssima impressão, tanto do design quanto da força da marca. A maioria dos sites são padronizados e isso ajuda a criar harmonia para quem visualiza. As dimensões mais comuns são:

  • Grande para mobile: 320×100 pixels;
  • Painel líder: 728×90 pixels;
  • Retângulo médio: 300×250 pixels;
  • Retângulo grande: 336×280 pixels;
  • Meia página: 300×600 pixels.

Otimize antes

Ao final de todos esses passos, chegou a hora de otimizá-lo. Já que toda peça criada para internet precisa ser carregada rapidamente, às vezes temos alguns segundos apenas para chamar a atenção do seu visitante e… o banner não carrega!

Diante disso, para agilizar o carregamento das imagens elas precisam ser comprimidas, claro, sem perder a qualidade, pois é um fator crucial para o resultado. O ideal é que os arquivos estejam nos formatos JPEG e PNG e o seu peso não pode ultrapassar 200kb.

Para essa missão, você pode contar com algumas ferramentas online e gratuitas, como:

  • Compressor.io: aceita formatos JPEG, PNG, GIF e SVG e funciona para imagens de até 10 MB;
  • Compress PNG: comprime até 20 arquivos de imagem no formato PNG de uma vez e permite baixar todos em arquivo ZIP ou individualmente;
  • Compress JPEG: faz parte do mesmo site que a opção anterior, mas promove a compressão de JPEG ou JPG.

Outra boa dica de otimização é ficar sempre de olho na descrição das imagens. Saiba mais sobre SEO para e-commerce no episódio 56 do podcast Dentro do Ringue:

Com essas dicas você já pode criar um bom banner para e-commerce. Certamente não existe receita de bolo, mas, como dissemos, faça testes e encontre a linguagem que melhor conversa com seu público. Com o tempo você vai acertar de primeira, e fará muito sucesso com seus visitantes.

Portanto, lembre-se, há poucos segundos para conquistar a atenção do consumidor. Fazer um estudo de como a concorrência vem trabalhando também é muito válido para acelerar esse processo de acerto.

Sobretudo, a ajuda de um profissional da área faz toda a diferença, por isso, sempre que possível contrate os serviços de um designer, vai ajudar, e muito, alavancar o sucesso do seu e-commerce.

Assine a Newsletter da Vindi

Este site usa cookies para melhorar sua experiência. Vamos supor que você esteja de acordo com isso, mas você pode optar por não participar, se desejar.
Aceitar consulte Mais informação Aceitar Leia mais

Política de privacidade e cookies