Call to action: o que é CTA e por que seu botão não parece botão

Quase todo conselho sobre call to action trata de palavras: use verbo no imperativo, crie urgência, fale do benefício. É um bom conselho, mas pula uma etapa. Antes de alguém ler a frase do botão, precisa perceber que aquilo é um botão. Se o CTA parece texto solto, enfeite ou parte do layout, a melhor frase do mundo fica parada na tela.

Este artigo explica o que é CTA, para que serve e quais os formatos mais comuns. Depois vai ao que os guias costumam deixar de fora: o que a pesquisa de usabilidade mostra sobre elementos que não parecem clicáveis, qual o tamanho mínimo de um alvo de toque segundo a W3C e como revisar seus CTAs em ordem — primeiro achar, depois tocar, só então convencer.

O que é call to action (CTA)?

Call to action, ou CTA, é o pedido explícito de uma ação ao leitor, posicionado no ponto em que ele já tem informação suficiente para decidir. Em português, chamada para ação. Pode ser um botão (“Agendar visita”), um link no meio do texto (“veja os planos”), uma frase no fim de um vídeo (“comente qual foi a sua experiência”) ou um campo de formulário com o botão de envio.

O CTA existe porque a maior parte das pessoas não decide sozinha o que fazer depois de ler. Sem um convite claro, a visita termina num “interessante” e numa aba fechada. Com ele, a página tem um destino: um cadastro, uma conversa no WhatsApp, um pedido de orçamento, uma compra. É o ponto em que o marketing deixa de ser exposição e vira algo que dá para contar.

Todo CTA tem três camadas, e elas falham de jeitos diferentes: a forma (o elemento parece clicável?), o tamanho e o lugar (dá para tocar sem errar, e ele aparece quando a pessoa está pronta?) e a mensagem (o texto diz o que acontece depois do clique?). A maioria dos guias trata só da terceira.

O que significa a sigla CTA e de onde vem o termo?

CTA é a sigla de call to action, expressão em inglês que vem da publicidade direta: o anúncio de jornal ou a mala direta que terminava com “ligue agora” ou “recorte e envie este cupom”. A lógica era a mesma de hoje — o anúncio só se paga se alguém agir, e alguém só age se souber exatamente o que fazer.

No digital, o termo passou a nomear também o próprio elemento de interface: o “botão de CTA”. Essa mudança de sentido importa. No papel, o CTA era uma frase; na tela, ele é uma frase dentro de um objeto que precisa ser reconhecido e acionado com mouse, dedo ou teclado. A frase continua contando, mas agora o objeto também conta — e é aí que muita página tropeça.

Vale um aviso de busca: a sigla CTA sozinha também é usada para o Centro de Testagem e Aconselhamento, serviço público de saúde. Se você pesquisar só “CTA”, vai encontrar endereços de unidades. No marketing, é sempre call to action.

Qual a diferença entre CTA, botão e link?

Os três se confundem porque o CTA quase sempre vira um botão ou um link. Mas não são sinônimos: CTA é a função (pedir uma ação), botão e link são formas de entregar essa função, cada uma com o seu papel.

Tamanho de toque: W3C, WCAG 2.2, critério 2.5.8.

A regra prática que sai da tabela: uma ação principal por tela, em forma de botão; as alternativas, em forma de link ou de botão secundário visivelmente mais fraco. Quando tudo tem o mesmo peso, nada é principal.

Por que caprichar no texto do CTA não basta?

Porque o texto é a última coisa a ser processada. O caminho de quem usa uma página é mais ou menos este: bater o olho, localizar o que parece acionável, ler o rótulo, decidir e tocar. A frase só entra no terceiro passo. Se o primeiro e o segundo falham, ela nem é lida.

Isso ficou mais agudo com a moda do design plano (o flat design). Botões perderam sombra, volume e às vezes até o preenchimento; links perderam o sublinhado e passaram a ter a mesma cor do texto. A página fica limpa e elegante — e o visitante passa a adivinhar o que é clicável. Ninguém reclama disso em reunião de aprovação de layout, porque quem aprova já sabe onde está o botão.

Há também o celular. No desktop, o cursor muda de forma ao passar sobre um link, o que dá uma segunda chance a um botão mal desenhado. No toque não existe essa pista: ou a pessoa reconhece o botão de cara, ou não toca. E, quando toca, o dedo é bem menos preciso que um ponteiro — se o alvo é pequeno ou está colado em outro, o toque vai para o lugar errado.

Antes de testar a frase do CTA, garanta que ele seja reconhecido como algo clicável e tocável. A frase não converte se o olho não encontra o botão.

O que a pesquisa mostra sobre o botão que não parece botão?

O Nielsen Norman Group, uma das referências mais citadas em usabilidade, testou exatamente isso. Montou pares de páginas reais — de comércio eletrônico, ONG, hotel, viagem, tecnologia e finanças — em duas versões: uma com sinalizadores de clique fortes (texto azul sublinhado, botão com volume) e outra com sinalizadores fracos (link com cara de texto comum, botão fantasma, só com contorno). E mediu, com rastreamento do olhar, quanto custava encontrar o alvo.

Fixação é cada parada do olho sobre um ponto da tela. Mais fixações significam mais procura: o olho pousa num elemento, não tem certeza, vai para outro, volta. Um quarto a mais de paradas para achar o mesmo alvo é o retrato da hesitação — e hesitação, numa página de venda ou de captação, é o momento em que a pessoa desiste ou abre outra aba.

O próprio estudo traz a nuance que evita a conclusão errada. O design plano não é o vilão em si: ele funciona melhor em páginas com pouca informação, layout tradicional e alvos com alto contraste. O problema é o sinalizador fraco somado a uma página cheia, em que o botão precisa competir com dezenas de outros elementos. É exatamente o cenário da maioria das páginas de serviço e de produto.

Qual o tamanho mínimo de um botão de CTA?

Achar o botão é metade do caminho; a outra metade é conseguir acioná-lo sem errar. Para isso existe uma regra objetiva, da W3C, o consórcio que mantém os padrões da web. As Diretrizes de Acessibilidade para Conteúdo Web (WCAG), na versão 2.2, criaram um critério específico para o tamanho do alvo.

Três detalhes mudam a leitura da regra. Primeiro, o que conta é a área que recebe o toque, não o desenho: um ícone de 16 px dentro de uma área clicável de 24 px passa. Segundo, a exceção de espaçamento: um alvo menor é aceito se, ao desenhar um círculo de 24 px centrado nele, esse círculo não encostar em outro alvo nem no círculo de outro alvo pequeno. Terceiro, link dentro de uma frase fica isento, porque o tamanho dele é ditado pela linha de texto.

Quem ganha com isso? A W3C cita pessoas com tremor nas mãos, espasticidade ou mobilidade reduzida, quem usa dispositivos de entrada especiais, quem opera o celular com uma mão só e quem tem dedos grandes. Ou seja: uma parcela grande de qualquer público, inclusive quem está no ônibus em movimento. Se a sua empresa já olhou para isso no site inteiro, o artigo sobre as seis falhas de acessibilidade digital que quase todo site tem mostra onde mais procurar.

Para o CTA principal, o razoável é ir além do piso. A página da W3C recomenda, para links e controles importantes, mirar o critério mais rígido, o 2.5.5 (Target Size – Enhanced, nível AAA). Na prática, o botão de “Pedir orçamento” não deveria ser o menor elemento tocável da tela, e sim um dos maiores.

Como fazer um call to action que funciona?

A ordem importa. Revise primeiro o que impede o clique de acontecer e só depois o que convence. Seis passos, do mais básico ao mais refinado:

1. Defina uma ação principal por tela

Antes do design, a decisão: o que esta página quer que a pessoa faça? Uma resposta. Ações alternativas podem existir, mas visualmente subordinadas. Página com “Comprar”, “Falar com vendas”, “Baixar catálogo” e “Assinar newsletter” no mesmo peso está pedindo para a pessoa escolher sozinha — e ela costuma escolher sair.

2. Faça o botão parecer botão

Preenchimento sólido, cor que contraste com o fundo e com o resto da página, cantos e proporções de botão, e algum sinal de profundidade ou borda nítida. Evite o botão fantasma (só contorno) para a ação principal; ele pode servir à secundária. Links no meio do texto precisam de cor própria e, de preferência, sublinhado.

3. Garanta o alvo de toque

Pelo menos 24 × 24 px CSS de área clicável, como pede a WCAG 2.2 no nível AA, e espaço suficiente entre o CTA e os elementos vizinhos. No celular, confira também se o botão não fica escondido atrás de banner de cookies, botão flutuante de chat ou barra fixa.

4. Escreva o que acontece depois do clique

Agora sim, o texto. Verbo de ação mais resultado: “Receber o diagnóstico”, “Agendar uma visita”, “Ver os preços”. Evite rótulos que não dizem nada, como “Enviar” ou “Clique aqui”. Se houver um atrito previsível, responda logo abaixo do botão: “sem cartão de crédito”, “resposta em até um dia útil” — desde que seja verdade.

5. Posicione onde a decisão acontece

O CTA aparece quando a pessoa já tem o que precisa para decidir: no topo para quem chega decidido, depois da prova (depoimento, caso, preço) para quem precisa de argumento, e no fim para quem leu tudo. Repetir o mesmo CTA ao longo de uma página longa é normal; trocar de pedido a cada seção confunde. A estrutura da página como um todo está no artigo sobre como saber se a sua landing page está boa.

6. Teste a frase só depois

Teste A/B de texto de botão é útil, mas é o último ajuste, não o primeiro. E precisa de volume: em sites com pouco tráfego, um teste de rótulo pode levar meses para dar resposta confiável. Antes de rodar, veja quanto tráfego e quanto tempo um teste A/B precisa para valer.

Quais são exemplos de call to action por canal e objetivo?

O CTA muda de forma conforme o canal, mas a lógica é a mesma: uma ação, clara, num elemento que se reconhece como acionável. Alguns exemplos por contexto:

Repare na última linha. Em vendas, o call to action é o fechamento de cada contato: o pedido claro do próximo passo, com data e formato. Conversa que termina em “qualquer coisa, me chama” é o equivalente comercial do botão fantasma — existe, mas ninguém vê.

Quais os erros mais comuns em CTA?

• Botão fantasma na ação principal — só contorno, sem preenchimento, quase da cor do fundo.
• Link igual a texto — mesma cor, mesmo peso, sem sublinhado; ninguém sabe que é clicável.
• Alvo pequeno ou colado — ícone minúsculo, dois botões grudados, o dedo toca o errado.
• Concorrência interna — três ou quatro CTAs com o mesmo peso visual na mesma tela.
• Rótulo vazio — “Enviar”, “Clique aqui”, “Saiba mais” em todo lugar, sem dizer o que vem depois.
• Botão escondido no celular — atrás do banner de cookies, do ícone de chat ou abaixo de uma imagem enorme.
• Começar pelo teste A/B da frase — otimizar o texto de um botão que metade das pessoas não encontra.

Os quatro primeiros são problemas de forma e tamanho, e quase nunca aparecem quando a página é revisada no monitor grande da agência ou do cliente. Aparecem no celular de quem não conhece o site.

Como medir se o CTA funciona?

1. Taxa de clique no CTA: cliques no botão ÷ visualizações da página. É o número que diz se o elemento está sendo encontrado e aceito.
2. Conversão depois do clique: dos que clicaram, quantos concluíram o cadastro, a conversa ou a compra. Clique alto e conversão baixa indicam promessa do botão diferente da página seguinte.
3. Separação por dispositivo: compare celular e desktop. Diferença grande costuma ser problema de alvo de toque ou de posição.
4. Mapa de calor e gravação de sessão: cliques em elementos que não são clicáveis e toques repetidos perto do botão revelam sinalizador fraco e alvo pequeno.
5. Teste com cinco pessoas: peça a quem não conhece o site para completar a ação e observe onde hesita.

Ferramentas gratuitas de mapa de calor ajudam bastante no item 4. Se você ainda não usa, o artigo sobre o Microsoft Clarity e o que a gravação de sessão guarda explica como começar e o que observar antes de instalar.

O que muda no CTA por tipo de negócio?

Em serviço B2B, o CTA principal costuma ser uma conversa (orçamento, reunião, diagnóstico), e o atrito é a sensação de compromisso; vale um CTA secundário mais leve, como um material ou uma ferramenta. Em comércio eletrônico, o botão de compra precisa vencer todos os outros elementos da página de produto, e o alvo de toque pesa muito porque quase toda a navegação é no celular. Em negócio local, o CTA mais forte quase sempre é o contato direto — ligar, traçar rota, chamar no WhatsApp —, e ele precisa estar visível sem rolagem.

Em todos os casos, a pergunta de partida é a mesma: qual é o próximo passo natural para quem chegou até aqui? O CTA bom é a resposta a essa pergunta, desenhada de um jeito que ninguém precise procurar.

Por onde começar hoje

1. Liste as cinco páginas que mais recebem visitas e anote, para cada uma, qual é a ação principal.
2. Abra cada uma no celular e faça o teste dos três segundos com alguém de fora.
3. Troque botões fantasma da ação principal por botões sólidos e dê cor e sublinhado aos links do texto.
4. Confira a área clicável dos CTAs e o espaço entre eles: pelo menos 24 × 24 px CSS, e mais que isso no principal.
5. Só então reescreva os rótulos, dizendo o que acontece depois do clique, e meça a taxa de clique antes e depois.

Se quiser um olhar de fora sobre isso, o serviço de CRO da Alliance audita os CTAs junto com o restante do caminho de conversão. E, para saber se o gargalo está mesmo no botão ou antes dele, o diagnóstico de marketing gratuito mostra em que etapa do funil a sua empresa perde mais gente.