CTA Design – O pequeno detalhe que faz uma grande diferença

Você tem uma ótima ideia. Você tem o design perfeito para isso. E seu anúncio consegue atrair a atenção dos clientes certos. Mas eles veem e passam sem clicar no anúncio. Você gostaria? Obviamente não! Mas o que fez seu cliente ignorar o anúncio? Foi a paleta de cores ou a cópia? Você pode pensar em tantos motivos. Mas você examinou o design do CTA? Provavelmente não. Essa talvez seja a última coisa que você examina, mas, idealmente, deveria ser a primeira!

Sim, você não quer que o anúncio perfeito seja desperdiçado simplesmente por causa de um CTA fraco ou mal projetado. Na verdade, você não pode nem chamar de “anúncio perfeito” se o CTA não cumprir o propósito.

Mas o que há em um CTA, certo? Um simples “clique aqui” ou “saiba mais” é tudo o que você vê na maioria das vezes. Nós ouvimos você. Mas, acredite ou não, tudo, desde a posição daquele botão CTA até as cores que você escolhe, a copy que você usa e o estilo da fonte nele pode influenciar direta ou indiretamente seu impacto no visualizador. Muito curioso? Prepare-se então. Hoje vamos falar tudo sobre design de CTA.

Design de CTA – então, por que isso importa?

Uma frase de chamariz ou CTA deve ser o ponto alto do seu anúncio. Vejamos algumas das razões pelas quais os CTAs se tornam os componentes mais críticos na maioria dos gráficos de marketing.

1. O CTA deixa claro o objetivo do seu anúncio

Para definir um CTA você precisa saber qual é o objetivo do seu anúncio. Por exemplo, para todas as suas campanhas em várias plataformas, você não espera que os clientes visitem a página inicial do seu site. Para alguns desses anúncios, você deseja que os clientes baixem seu aplicativo. Alguns devem levá-los a uma página de captura de leads para que você possa coletar seus detalhes de contato para futuros esforços de nutrição de leads. E outros podem ter que levar os clientes a uma página de venda ou a uma página de produto para ajudá-los a adicionar o item ao carrinho e fazer a compra o mais rápido possível.

Portanto, seu CTA ajuda a direcionar o tráfego na direção pretendida com base nos objetivos que você definiu para a campanha, o anúncio específico ou o design de marketing.

2. Ajude os clientes a tomar decisões

Os clientes sabem o que estão procurando, mas, acredite ou não, a maioria dos consumidores aprecia uma ajudinha na tomada de decisão de compra. A maioria dos anúncios, páginas de destino e outros designs de marketing têm um ou dois CTAs. Nos e-mails, você pode ter mais de um quando se trata de um conjunto de categorias de produtos ou um e-mail de guia de compras. De qualquer forma, adicionar o(s) CTA(s) garante que os clientes superem o cansaço da decisão e prossigam para a próxima etapa com mais confiança.

3. Ajude a melhorar as conversões

Às vezes, os clientes não avançam para a próxima etapa em seu funil de leads simplesmente porque não sabem para onde ir em seguida. Adicionar um CTA torna mais fácil para eles entenderem isso.

Vamos dar um exemplo para entender isso melhor. O controle deslizante abaixo aparece no site da Apple.

Ok, e o Black & Blues de Louis Armstrong? Por que os clientes estão vendo isso no site da Apple? Talvez o logotipo da Apple TV na parte inferior diga que este documentário está disponível na Apple TV. Mas e daí? Se não fosse pelo CTA “Stream Now”, a maioria das respostas acima teriam ficado sem resposta. Clientes confusos podem ter passado por isso. Mas, por causa do botão CTA, os visitantes sabem que clicar nele os levará à página de streaming na Apple TV sem problemas. Isso os motiva a clicar no controle deslizante. Ali, simplesmente aconteceu uma conversão!

Esse é um exemplo de como a maneira mais direta de fazer a conversão acontecer é adicionar um CTA claro e compreensível.

Tendo estabelecido o fato de que CTAs são importantes no design, vamos agora falar sobre algumas dicas de design de CTA.

Design de CTA: dicas para torná-lo digno de clique

Seu CTA deve ser um detalhe evidentemente distinguível em seu design. Mas, ao mesmo tempo, não deve distrair os clientes das informações essenciais que o precedem. Seus recursos visuais, cópia e CTA juntos devem apresentar claramente a mensagem e dizer aos clientes por que eles devem clicar no CTA e o que acontece quando o fazem. Para que tudo isso aconteça, separamos algumas dicas para que seu CTA funcione a favor do seu design.

1. Um pequeno ajuste em sua cópia ajuda bastante

Você deve saber que 90% dos usuários que leem o título do anúncio ou da página da web também leem a cópia do CTA. Então, sim, a cópia importa.

No CTA abaixo, um simples CTA “Download” teria sido suficiente. Mas adicionar a palavra “grátis” garante aos clientes que eles não estão pagando nada no momento, mas ainda podem baixar o conteúdo.

Estima-se que os CTAs personalizados tenham um desempenho 202% melhor do que os CTAs simples. Portanto, gaste tempo suficiente na cópia. Identifique as melhores palavras que soam mais convincentes e as mais relevantes para o contexto.

CTAs personalizados são maneiras fáceis de informar aos clientes o que acontece quando eles clicam no botão. No e-mail abaixo, por exemplo, os figurinos entendem instantaneamente que clicar no botão “Reserve seu lugar” os leva à página de reservas. Então, eles clicariam nisso apenas se estivessem genuinamente interessados ​​em fazer uma reserva ou saber mais sobre ela.

Portanto, se você tiver um CTA personalizado, pode ter certeza de que apenas leads genuinamente interessados ​​avançam no funil. Esses são os tipos de leads com maior probabilidade de conversão. E se eles não sabem, você sabe que eles são o tipo de leads para redirecionar.

Dica do Kimp: Para que sua cópia de CTA cause mais impacto, escolha uma fonte simples e legível. Fique longe de fontes sofisticadas e estilos decorativos. Uma frase de chamariz deve ser fácil de ler.

Combinar as fontes certas sem usar muitos tipos de letra parece uma tarefa árdua? Deixe que designers profissionais cuidem disso.

2. Faça seu CTA parecer um botão

Se a frase de chamariz se parece com o restante do texto, como os clientes saberão que podem clicar ali para passar para a próxima etapa? Portanto, faça com que seu CTA pareça diferente do restante da cópia.

Algo tão simples como fazer o CTA parecer um botão pode melhorar significativamente os cliques em 45%. Claro, dependendo do estilo visual do restante do design e da identidade visual da sua marca, você sempre pode usar um botão plano ou esqueuomórfico (tridimensional) conforme necessário. Mas, desde que seja fácil de perceber como um botão, há mais chances de os visitantes clicarem nele.

3. Escolha a cor certa para o seu CTA

Você sabia que simplesmente mudar a cor do design do seu CTA pode alterar drasticamente a aparência e a eficácia do CTA? Na verdade, a SAP notou que um botão CTA laranja aumentou sua conversão em 32,5%.

Claro, algumas outras cores podem funcionar melhor para sua marca. Você pode descobrir isso fazendo testes A/B. Uma maneira de fazer isso é criar duas versões diferentes do mesmo design, mantendo tudo menos o CTA. Use diferentes cores de design de CTA em ambos os designs e veja qual converte melhor. Se você estiver testando a ideia em uma página da Web, também poderá usar mapas de calor e outras ferramentas de rastreamento para entender o comportamento do visitante e fazer mais ajustes em seu design.

Depois de escolher a cor, certifique-se de que seu CTA se destaque do fundo. Você não pode usar a mesma cor para o CTA e o plano de fundo. Deve haver um bom contraste entre a cor do design do CTA e a cor de fundo e a paleta de cores geral. Mesmo o design de CTA mais bonito com a melhor cópia será inútil se o CTA não for fácil de reconhecer.

No exemplo acima, o CTA vermelho se destaca do fundo escuro. Assim, não há risco de o usuário não perceber o CTA.

Dica Kimp: Cores e contrastes de cores funcionam de maneiras complicadas. Às vezes, cores com contraste máximo podem causar muita tensão visual quando colocadas juntas. Para saber mais sobre esquemas de cores e como escolher cores contrastantes, confira nosso blog sobre roda de cores e esquemas de cores.

4. Tenha cuidado com a opacidade do design do CTA

Outra razão pela qual o design do CTA não é fácil de reconhecer pode ser o padrão de fundo e a opacidade do design do CTA. Um CTA transparente ou translúcido pode se perder em um fundo lotado. Nesses casos, um botão opaco faz o CTA aparecer. Ou você também pode adicionar detalhes sutis, como o destaque ao redor do CTA no design abaixo. Detalhes como esses valorizam ainda mais a aparência do CTA e chamam a atenção para ele.

Quer criar banners atraentes para suas campanhas digitais? Entre em contato com a equipe Kimp hoje.

5. Use o espaço negativo a seu favor

Adicionar espaço negativo ao redor do seu CTA pode aumentar a conversão em cerca de 230%. Isso ocorre porque o uso eficaz do espaço negativo elimina toda a confusão em torno do CTA e direciona a atenção para ele.

Na página de destino acima, todo o espaço abaixo do CTA torna o CTA facilmente perceptível. Os CTAs que chamam sua atenção são os que têm maior probabilidade de serem clicados. Portanto, para garantir que os clientes não saiam porque não notaram um CTA presente na página, adicione bastante espaço negativo ao redor dele.

6. Não adicione muitos CTAs

Idealmente, você deve definir claramente uma única direção para seu design de marketing. O direcionamento e o fornecimento de opções ocorrem em um estágio inicial. Você precisa ter categorias de leads claramente definidas e seus anúncios devem ser segmentados com precisão. Quando seus anúncios são segregados, definir seu CTA fica mais fácil. Daremos alguns exemplos.

• Se você estiver segmentando leads em potencial, poderá ter conteúdo que apresente sua marca ou os convença a conferir seu site. Nesses casos, é mais provável que o CTA os leve ao site ou à sua página de mídia social para coletar mais informações.
• Os leads que você acessa em seu site ou página de mídia social mostraram o primeiro nível de interesse. Em seguida, vem convencê-los com as estratégias certas. Aqui você pode estar usando iscas digitais com um botão de download ou uma página de captura de leads com um botão de inscrição.
• Para clientes existentes, quando você envia ofertas relevantes de itens em sua lista de desejos ou itens que eles estão navegando, seu CTA os levará à página do produto.
• E se for um e-mail abordando o abandono do carrinho, o CTA leva os clientes ao carrinho de compras para prosseguir com o pedido.

Você precisa entender melhor a jornada de um comprador para saber o que ele está procurando e para onde deve ser direcionado a seguir. Em todos esses casos, ter um único CTA faz mais sentido.

Para um lead no estágio inicial do funil de leads, muitas opções podem causar confusão e leads confusos podem não tomar uma decisão.

7. Mas quando houver várias direções, mantenha a consistência

Para um design de marketing simples, um único CTA evita confusão e aumenta a conversão. Mas existem alguns lugares onde você precisa de vários CTAs para causar o maior impacto. É o caso de designs de formato longo, como páginas de destino e alguns e-mails.

Quando o conteúdo é longo, fazer pausas frequentes e adicionar um CTA em cada seção será muito melhor do que esperar que os clientes leiam até o final da página e encontrem o CTA lá.

Ou se a página de destino ou o e-mail estiver no formato de um guia de compras, onde os clientes veem um conjunto de opções de produtos para comprar, um CTA diferente para cada opção fará mais sentido.

Em todos esses casos em que você tem vários CTAs, estabeleça uma consistência visual entre eles. Se cada design de CTA parecer diferente do outro, isso pode fazer com que o design geral pareça desajeitado. Algumas coisas a reter serão:

• Forma e cor do botão CTA
• Fontes usadas na cópia do CTA
• Alinhamento da cópia do CTA dentro do botão
• Orientação dos botões CTA

A página de destino abaixo tem CTAs diferentes para cada seção, mas todos os designs de CTA parecem consistentes. Deixa a página mais organizada. E do ponto de vista da usabilidade, uma vez que os clientes veem alguns desses CTAs, sempre que virem um botão verde semelhante no site, eles saberão que é um link clicável para outra etapa.

Crie designs de CTA dignos de cliques com Kimp

Os CTAs fazem com que a maioria dos designs de marketing pareçam completos, levando os clientes na direção pretendida. Portanto, não se esqueça de adicionar um aos seus e-mails, páginas de destino, banners e todos os outros designs de marketing em que um CTA pareça relevante. Os CTAs também aparecem em anúncios impressos e aqui eles serão principalmente o endereço do site ou as informações de contato da empresa. Ainda assim, eles precisam se destacar do restante do design para que os clientes executem a ação que você deseja. Se adicionar um CTA sem mexer na estrutura do design ou se entender onde usar CTAs e como parece confundi-lo, deixe isso para seus designers. Escolha uma assinatura Kimp. Registre-se agora para uma avaliação gratuita.