Como Adicionar um Formulário de Contato ao Seu Site (Que Realmente Chega até Você)

Para adicionar um formulário de contato que funcione, crie um formulário curto (nome, e-mail, mensagem), envie-o para uma rota do servidor que valida os dados, salve a mensagem em um banco de dados e depois envie uma notificação para você por e-mail, por meio de um provedor, usando uma chave de API secreta. Adicione um campo oculto de armadilha (honeypot) e limitação de taxa para barrar a maior parte do spam, mostre uma mensagem clara de sucesso e teste tudo de ponta a ponta no site publicado. Salvar antes de enviar o e-mail é a parte importante: se o e-mail falhar, você ainda tem o contato.

Suas opções

Opção	Como funciona	Bom para	Trade-offs
Link mailto	"Fale conosco" abre o aplicativo de e-mail do visitante	Sites pessoais	Falha em muitos dispositivos; expõe seu endereço a robôs
Serviço de formulário hospedado	O formulário envia os dados para um serviço de terceiros que te envia o e-mail	Sites estáticos sem back-end	Outra conta; limites e marca d'água nos planos gratuitos
Ferramenta de formulário embutida	Um widget de um construtor de formulários incorporado na sua página	Pesquisas complexas, configuração rápida	Não combina com o seu design; os dados ficam em outro lugar
Seu próprio formulário + banco de dados + e-mail	Seu servidor salva e notifica	A maioria dos apps e sites de negócios	Você configura um provedor de e-mail

Se o seu site já tem um back-end e um banco de dados — o que apps criados com criadores de apps com IA costumam ter —, a última opção é a mais confiável e mantém os contatos onde você consegue vê-los.

O que um bom formulário de contato inclui

O menor número possível de campos. Nome, e-mail, mensagem. Adicione uma lista de assunto ("Vendas", "Suporte", "Outro") só se for encaminhar por ela.
Rótulos claros acima de cada campo, não apenas um texto de exemplo que desaparece.
Validação útil: "Digite um endereço de e-mail válido", exibido ao lado do campo.
Uma tela de sucesso que diga o que acontece em seguida: "Obrigado — respondemos em até um dia útil."
Um aviso de privacidade explicando como você usará os dados, com link para sua política de privacidade.
Uma alternativa, como seu e-mail ou telefone, para quem preferir.

Exemplos de prompts

O formulário básico:

Adicione um formulário de contato na página Contato com nome, e-mail e mensagem (todos obrigatórios, mensagem com até 2.000 caracteres). Envie para uma rota do servidor que valida os dados, salva em uma tabela contact_messages com a data e hora de recebimento e mostra a mensagem de sucesso: "Obrigado, respondemos em até um dia útil." Mostre os erros dos campos logo abaixo de cada um. Faça funcionar bem em celulares.

Notificações por e-mail:

Quando uma mensagem de contato for salva, envie um e-mail de notificação para hello@exemplo.com.br usando o Resend, com a chave em RESEND_API_KEY. Defina o reply-to como o e-mail de quem enviou, para que eu possa responder diretamente. Se o envio falhar, mantenha a mensagem salva e registre o erro sem expor a chave.

Proteção contra spam:

Adicione proteção contra spam ao formulário de contato: um campo oculto de armadilha que deve permanecer vazio, um limite de 5 envios por IP por hora no servidor e rejeite mensagens com mais de 3 links. Descarte silenciosamente os envios com a armadilha preenchida, mas ainda mostre a mensagem de sucesso.

Uma caixa de entrada:

Adicione uma página administrativa protegida por senha que liste as mensagens de contato das mais recentes para as mais antigas, com uma caixa de seleção "respondida" e um filtro para mensagens não respondidas.

Passo a passo

Decida para onde as mensagens vão: quem recebe as notificações e quem responde.
Construa o formulário com os campos acima, rótulos acessíveis e campos adequados a celular (use o tipo de entrada de e-mail para que os celulares mostrem o teclado certo).
Crie a rota do servidor. Ela verifica os campos obrigatórios, o formato do e-mail e os limites de tamanho. Nunca confie apenas na validação do navegador.
Salve no banco de dados primeiro. Veja como adicionar um banco de dados ao seu app.
Configure um provedor de e-mail. Crie uma conta, verifique seu domínio de envio e guarde a chave de API como segredo. Como enviar e-mails pelo seu app explica em detalhes a configuração do domínio (SPF, DKIM).
Envie a notificação a partir do servidor, depois de salvar. Use seu domínio verificado como remetente e o e-mail do visitante como reply-to — não envie "de" o endereço do visitante, pois isso provavelmente será rejeitado como falsificação.
Opcionalmente, envie uma resposta automática ao visitante, mas mantenha-a curta; respostas automáticas para endereços de spam podem prejudicar a reputação do seu envio.
Adicione proteção contra spam: armadilha (honeypot), limitação de taxa e, se necessário, uma verificação tipo CAPTCHA.
Teste no site publicado: envie uma mensagem, confira o banco de dados, confira sua caixa de entrada e a pasta de spam, clique em responder.

Como barrar spam

Formulários de contato atraem robôs em poucos dias após entrarem no ar. Coloque as defesas em camadas, da menos para a mais intrusiva:

Campo de armadilha (honeypot). Um campo oculto para humanos; robôs o preenchem. Não custa nada aos visitantes reais.
Limitação de taxa no servidor. Limita quantas mensagens um mesmo endereço pode enviar em um período.
Regras de conteúdo. Rejeite mensagens cheias de links, ou com um campo de mensagem vazio ou absurdamente longo.
Uma verificação tipo CAPTCHA, como Cloudflare Turnstile ou Google reCAPTCHA. O token precisa ser validado no seu servidor; uma verificação que roda só no navegador pode ser contornada.

Erros comuns

Mostrar "Enviado!" quando nada foi enviado. A interface indica sucesso antes ou independentemente da resposta do servidor. Sempre espere pela resposta do servidor.
Só e-mail, sem banco de dados. Uma chave mal configurada e os contatos somem por semanas sem que ninguém perceba.
Chave de API no código do front-end. Qualquer pessoa pode usá-la para enviar e-mails em seu nome.
Domínio de envio não verificado. As notificações caem no spam ou nunca chegam.
Enviar "de" o e-mail do visitante. Use reply-to.
Sem limites de tamanho. Robôs colam blocos enormes de texto.
Nunca testar o site no ar. Chaves e domínios costumam ser diferentes entre a prévia e a produção.

Checklist

Formulário curto, com rótulos visíveis e erros claros
Validação no servidor e limites de tamanho
Toda mensagem salva no banco de dados
E-mail de notificação enviado a partir de um domínio verificado, com reply-to definido
Chave de API de e-mail guardada somente como segredo no servidor
Armadilha (honeypot) e limitação de taxa ativas
Mensagem de sucesso aparece somente após a confirmação do servidor
Aviso de privacidade com link para sua política de privacidade
Testado de ponta a ponta no site publicado, incluindo a pasta de spam

Formulários de contato na Mythex

Na Mythex, você pode construir tudo isso pelo chat. Peça o formulário e um banco de dados no mesmo prompt (ou digite /database) para que os envios sejam persistidos. A Mythex não tem um produto próprio de envio de e-mails, então para as notificações você traz um provedor como Resend, SendGrid ou Postmark, adiciona a chave com /secrets ou nas configurações do projeto e pede ao agente que envie a partir do servidor — veja Enviar e-mail pelo seu app. Antes de confiar nisso, execute o App Testing (/test) no formulário na Prévia, depois publique e teste na URL ao vivo.

Um formulário de contato é parte essencial da maioria dos sites para pequenos negócios e das landing pages. Confira a lista de verificação de segurança antes do lançamento.

Perguntas

Como faço um formulário de contato me enviar um e-mail?

O formulário envia os dados para uma rota do servidor, que salva a mensagem e depois envia uma notificação para você por meio de um provedor de e-mail, como Resend, SendGrid ou Postmark, usando uma chave de API guardada como segredo no servidor. Só o navegador não consegue enviar e-mails de forma confiável.

Por que não estou recebendo os e-mails do formulário de contato?

As causas comuns são uma chave de API ausente ou errada, um domínio de envio não verificado, notificações caindo na caixa de spam ou o formulário mostrar sucesso sem que a chamada ao servidor tenha funcionado. Salvar cada envio no banco de dados primeiro significa que você nunca perde uma mensagem enquanto corrige o e-mail.

Como impedir spam no formulário de contato?

Comece com um campo oculto de armadilha (honeypot) e limitação de taxa no servidor. Se o spam continuar, adicione uma verificação tipo CAPTCHA, como Cloudflare Turnstile ou Google reCAPTCHA, validada no servidor.

Devo usar um link mailto em vez de um formulário?

Um link mailto é simples, mas abre o aplicativo de e-mail do visitante, o que falha para muitas pessoas em computadores compartilhados ou de trabalho, e expõe seu endereço a robôs de spam. Um formulário é mais confiável para o visitante e permite controlar os campos que você recebe.