Pular para o conteúdo

Formulário que vira contato: menos campos, rótulo visível e erro que explica

O formulário é onde a visita vira contato. Quatro decisões de campo, rótulo, erro e altura, e o que fazer com a página de obrigado.

  • Carrossel
  • 24 de out de 2026
  • 3 min de leitura
Formulário que vira contato: menos campos, rótulo visível e erro que explica
Imagem 2 de 7
Imagem 3 de 7
Imagem 4 de 7
Imagem 5 de 7
Imagem 6 de 7
Imagem 7 de 7
Arraste para o lado

O formulário é o ponto exato em que a visita vira contato. Tudo o que vem antes na página serve para levar a pessoa até ele. E é justamente ali que muita página perde: campos demais, rótulos que somem, erros que não explicam nada e uma página de obrigado que só diz obrigado.

Estas são as quatro decisões que eu tomo em todo formulário, mais uma para depois do envio.

1. Peça só o necessário

Cada campo é uma pergunta, e cada pergunta é um motivo a mais para desistir. Telefone, empresa, cargo, cidade, como nos conheceu: tudo isso pode ser útil um dia, mas cobra o preço agora.

A pergunta certa não é o que seria bom saber, e sim o que eu vou usar no próximo passo. Para receber um material ou se inscrever numa aula, nome e e-mail bastam. Para pedir orçamento, talvez um campo a mais sobre o projeto. O resto você descobre na conversa.

Se o formulário realmente precisa de muitos campos, divida em três ou quatro etapas curtas, com indicação de progresso. Uma tela com dois campos assusta menos do que uma com oito.

2. Rótulo sempre visível

O placeholder, aquele texto cinza dentro do campo, some quando a pessoa começa a digitar. Se ele é o único rótulo, ela esquece o que o campo pedia no meio do preenchimento, principalmente quando volta para corrigir algo.

O rótulo fica acima do campo, sempre visível. O placeholder vira exemplo do formato: ana@email.com no campo de e-mail, por exemplo.

No celular, mais um detalhe: o texto do campo precisa ter pelo menos 16 pixels. Abaixo disso, o Safari do iPhone dá zoom quando a pessoa toca no campo, e a página inteira se desloca.

Grátis

Libere o resto da matéria

Você também recebe por e-mail o link desta matéria e a aula grátis do Conversão Visual.

3. Erro que diz o que fazer

“Campo inválido” não ajuda ninguém. A mensagem de erro aparece logo embaixo do campo e diz o que fazer: falta o @ no e-mail, o telefone precisa do DDD.

E nunca dependa só da cor. Uma borda vermelha sem texto não é percebida por quem tem dificuldade para distinguir cores, nem por quem está com o celular no sol. Texto e borda juntos, sempre.

Use também o tipo certo em cada campo. Campo de e-mail com tipo de e-mail, campo de telefone com teclado numérico, e o preenchimento automático ligado. O navegador já sabe o nome e o e-mail da pessoa. Deixe ele trabalhar.

4. Tudo na mesma altura

Campos, opções e o botão de envio usam a mesma altura. Eu uso 48 pixels em formulários. Quando um campo tem 44 e o botão tem 52, o formulário parece montado por partes, e essa sensação de improviso pesa justamente no momento em que a pessoa decide confiar os dados dela a você.

Mesma altura, mesmo raio e o mesmo espaço entre os itens. O formulário vira um bloco só, fácil de ler de cima para baixo.

Depois do envio

A página de obrigado é a parte mais esquecida. Ela aparece para a pessoa mais interessada do site inteiro, e quase sempre diz só obrigado.

Use essa tela para três coisas: dizer o que acontece agora, em quanto tempo, e qual o próximo passo. Por exemplo: você vai receber a resposta por e-mail, em até um dia útil, e enquanto isso pode ver os projetos. Quem acabou de preencher está com atenção total. Não desperdice.

O formulário é design de conversão

Nenhuma dessas decisões é difícil. Elas só costumam ficar para o fim, quando a página já está pronta e o formulário entra do jeito que veio. Decidir antes muda o resultado da página inteira.

No Conversão Visual eu ensino essas decisões que transformam visita em contato, do primeiro título até o formulário, e como passar cada uma para a IA executar. A aula grátis mostra o processo completo.

Mais da Biblioteca. Do mesmo tema primeiro.