O botão é a menor parte do texto de um site e a que mais trabalha. É nele que o visitante decide pedir o orçamento, comprar ou ir embora. E, mesmo assim, a maioria dos sites usa as mesmas três palavras: “Enviar”, “Saiba mais”, “Clique aqui”.
Use a lista abaixo para revisar os botões do seu site, um por um. São sete regras, cada uma com um jeito rápido de conferir.
1. Diga o que acontece depois do clique
“Enviar” não diz nada. “Pedir orçamento”, “Agendar consulta”, “Finalizar compra” dizem exatamente o que vai acontecer. Teste: leia só o botão, sem o resto da página. Dá para saber o que ele faz?
Isso vale também para o que acontece depois. Se o botão leva para o WhatsApp, diga (“Chamar no WhatsApp”). Se baixa um arquivo, diga o formato (“Baixar o cardápio em PDF”). Ninguém gosta de clique que surpreende.
2. Comece com um verbo
Botão é ação, e ação é verbo: baixar, comprar, falar, ver. “Orçamento” sozinho é um rótulo; “Pedir orçamento” é um convite. O verbo também ajuda quem usa leitor de tela, que muitas vezes navega pulando de botão em botão.
3. Fale do lado do cliente
“Quero meu desconto” convida mais que “Resgatar cupom”. Nem sempre a primeira pessoa cabe, mas pergunte: o botão está escrito do ponto de vista de quem clica ou de quem programou o site?
4. Corte o que sobra
Duas a quatro palavras, na maioria dos casos. “Clique aqui para solicitar o seu orçamento gratuito agora mesmo” vira “Pedir orçamento grátis”. Steve Krug resume a ideia no título do livro dele, Não me faça pensar: o visitante não lê, ele bate o olho. O botão precisa ser entendido nesse relance.
5. Um botão principal por tela
Quando a página tem cinco botões do mesmo tamanho e da mesma cor, nenhum é o principal. Escolha a ação que mais importa naquela página e dê a ela o botão mais visível. As outras viram links ou botões discretos.
No celular, essa escolha pesa ainda mais. A tela pequena mostra um botão de cada vez, e o principal precisa estar ao alcance do polegar, grande o bastante para não ser apertado por engano no vizinho.
6. Não use “Clique aqui” nem “Saiba mais” soltos
Além de não dizerem nada, eles atrapalham a acessibilidade. A WCAG, a referência internacional do tema, pede que o objetivo de cada link possa ser entendido pelo texto dele, sozinho ou com o contexto em volta. Uma página com seis “Saiba mais” é uma lista de seis mistérios para quem navega pelo teclado. “Ver o cardápio”, “Conhecer os planos”, “Ler o regulamento” resolvem.
7. Diga o que tranquiliza, perto do botão
O medo do clique costuma ser o mesmo: vai me cobrar? Vou receber spam? Uma linha pequena logo abaixo responde: “sem compromisso”, “você não paga nada agora”, “resposta em até um dia útil”. Não entulhe o botão com isso; coloque ao lado.
Um exemplo, antes e depois
A página de uma escola de idiomas tinha, no fim, dois botões: “Enviar” e “Saiba mais”. Reescritos pelas regras acima, viram “Agendar aula experimental” (o principal, com “grátis e sem compromisso” logo abaixo) e “Ver os horários das turmas” (discreto, como link). É exemplo, mas repare que nenhuma palavra nova foi inventada: só foi dito o que já acontecia.
Depois de revisar
Se o site tem formulários, teste o botão até o fim: clique, veja a mensagem de confirmação e confira se o pedido chegou. Botão com texto perfeito e formulário quebrado é o pior dos mundos, porque convence o cliente a fazer algo que não funciona.
Para ir além
- Copywriting: o texto da página que leva até o botão.
- Formulário de contato que gera orçamentos: o que vem depois do clique.
Cada clique levando a algum lugar
No design de sites da PubliCode, o texto de cada botão é escrito junto com o layout, e não preenchido no fim com o “Enviar” padrão.
Quer uma revisão dos botões e formulários do seu site? Agende uma consultoria sem compromisso e traga a página que mais deveria vender.