8 belos exemplos de formulários de contato + como adicioná-los ao seu site

Cinco dicas para aprimorar o design do seu formulário de contato

Antes de entrarmos nos exemplos reais de formulários de contato, vamos fazer um rápido desvio e falar sobre o que torna um ótimo formulário de contato. Esse desvio definirá o cenário enquanto discutimos o que cada exemplo de formulário de contato faz bem na próxima seção.

Você provavelmente tem um formulário de contato porque deseja que as pessoas o preencham. Então, como você consegue que mais pessoas o usem? Aqui estão algumas práticas recomendadas ...

1. Comunique claramente para que serve o seu formulário

Se você tem uma empresa ou site muito ocupado, pode ter vários formulários de contato para diferentes usos. Por exemplo, pode ser:

• Formulário de consultas de vendas

• Formulário de suporte ao cliente

• Formulário de pedido online

• Formulário de solicitação de retorno

• Etc.

Existem duas abordagens básicas para lidar com isso e você verá ambas nos exemplos de formulário de contato da vida real abaixo:

1. Formulários separados. Crie formulários separados para cada caso de uso e adicione texto que deixe claro exatamente o que cada formulário faz.

2. Um campo suspenso. Adicione um campo suspenso na parte superior do formulário que lista os diferentes casos de uso e direciona automaticamente o formulário de contato para o local certo.

De qualquer forma, use as etiquetas do formulário e o texto ao redor para tornar a finalidade de cada formulário de contato absolutamente clara para os visitantes.

2. Limite o comprimento do formulário para mais conversões (mas não se esqueça da qualidade)

Se todas as coisas forem iguais, os dados parecem sugerir que formulários de contato mais longos significam menos envios.

Por exemplo, a HubSpot analisou mais de 40.000 páginas de destino e percebeu uma correlação clara entre as taxas de conversão e o número de campos do formulário.

A taxa de conversão de pico gira em torno de três campos. A taxa de conversão cai continuamente até oito campos de formulário, antes de se nivelar:

Fonte

Em uma nota mais anedótica, Marketo testou três formulários com resultados semelhantes ao HubSpot:

• 5 campos - taxa de conversão de 13,4%

• 7 campos - taxa de conversão de 12,0%

• 9 campos - taxa de conversão de 10,0%

É claro que simplesmente receber mais envios de formulários de contato pode não ser seu objetivo real, portanto, não é tão simples quanto cortar o número de campos em seus formulários ao mínimo.

Por exemplo, embora você possa obter mais envios reduzindo os campos, esses envios podem não ser de alta qualidade porque a barreira para a entrada é muito baixa.

No geral, uma boa regra prática é eliminar todos os campos desnecessários , mas não elimine os campos que coletam informações importantes apenas para encurtar seu formulário, especialmente se essas informações servirem para qualificar seus leads.

3. Use a microcópia inteligente para explicar os campos

Se o seu formulário de contato tiver mais do que apenas os campos padrão “nome, e-mail, mensagem”, você corre o risco de confundir os visitantes.

Por exemplo, se você tiver um campo “orçamento”, pode não ficar claro para que serve esse orçamento. É para todo o projeto? É apenas para uma parte específica?

Para evitar essa confusão, você pode adicionar “microcópia” ao seu formulário de contato.

A microcópia é basicamente um pequeno texto explicativo que acompanha os campos do formulário para torná-los mais claros. Por exemplo, observe o campo Volume de pagamentos abaixo (você verá este exemplo mais tarde também):

4. Experimente diferentes formatos

Quando a maioria das pessoas pensa em um formulário de contato, elas imaginam o mesmo formulário incorporado básico que você vê na maioria dos sites. Mas se você quiser tornar mais fácil para as pessoas entrarem em contato com você, às vezes vale a pena experimentar diferentes métodos de exibição, como um pop-up ou barra de notificação.

Por exemplo, ter um botão de contato flutuante na lateral do seu site pode ser ótimo para um formulário de contato de suporte. Isso torna muito fácil para os usuários entrarem em contato com você assim que encontrarem um problema, sem exigir que eles procurem sua página de contato:

5. Diga às pessoas as próximas etapas e defina as expectativas

O design do seu formulário de contato não termina quando as pessoas clicam em Enviar!

Para oferecer uma melhor experiência do usuário, você deseja dizer às pessoas exatamente o que acontecerá a seguir e quanto tempo levará. Por exemplo…

• Você responde a todas as perguntas ou apenas a algumas?

• Quanto tempo você vai demorar para responder?

• Você responderá por e-mail ou outro método?

Se você definir expectativas claras, seus visitantes não se perguntarão o que está acontecendo e se seu formulário está funcionando.

Oito excelentes exemplos de formulários de contato de sites reais

Agora que você conhece as práticas recomendadas, vamos examinar alguns designs de formulário de contato do mundo real para inspirar o seu e mostrar essas práticas recomendadas em ação.

1. Stripe

O formulário de contato de vendas do Stripe é um ótimo exemplo de como às vezes a coleta de algumas informações extras pode fazer com que seus formulários de contato gerem leads mais qualificados (mesmo que isso diminua um pouco a taxa de conversão da linha de base).

Além dos campos de informações padrão, o Stripe adiciona um campo de volume de pagamentos para que eles possam entender melhor a qualidade potencial de cada lead.

Além disso, existem algumas outras boas opções de design, incluindo:

• Prova social - os logotipos laterais adicionam prova social ao exibir todas as empresas de sucesso que usam o Stripe.

• Microcópia - o termo “Volume de pagamentos” pode ser um pouco confuso, então Stripe adiciona uma microcópia útil explicando como preencher o campo.

• Objetivo - o Stripe deixa bem claro que este formulário é apenas para consultas de vendas. Isso evita que as pessoas tentem usá-lo para fins de suporte ou outros usos não comerciais.

2. Getsitecontrol

Aqui na Getsitecontrol, lidamos com nosso design de formulário de contato de uma maneira um pouco diferente.

Em vez de criar uma página “Fale conosco” dedicada para a qual os visitantes precisam navegar, simplesmente incluímos um link Fale conosco que abre um pop-up ali mesmo - sem a necessidade de recarregar a página.

Isso é realmente conveniente para as pessoas porque elas podem ...

• acesse nosso formulário de contato em qualquer página do site,

• enviar uma mensagem sem interromper o que mais eles estavam fazendo (como ler esta postagem do blog!).

O formulário de contato Getsitecontrol é simples e fácil de preencher. Além disso, ele comunica claramente as próximas etapas após as pessoas enviarem o formulário, junto com um CTA para verificar o blog Getsitecontrol.

3. Kinsta

O Kinsta tem uma única página “Fale conosco” que orienta automaticamente os usuários para o formulário de contato adequado, sem exigir que eles recarreguem a página.

Kinsta lista as cinco solicitações de contato mais populares:

1. Preços ou planos

2. Recursos ou informações técnicas

3. Solicite uma migração ou qualquer pergunta relacionada

4. Postagem de convidado, postagem patrocinada ou solicitação de backlink

5. Algo mais

Quando os usuários selecionam seu objetivo, o Kinsta exibe um formulário de contato personalizado ou uma mensagem.

Isso permite que o Kinsta colete exatamente as informações de que precisam, sem sobrecarregar os visitantes com campos estranhos.

Por exemplo, no formulário de contato de preços ou planos , o Kinsta adiciona campos extras para entender quantos sites e visitantes a pessoa está procurando hospedar, mas esses campos não aparecem no formulário “Qualquer outra coisa”.

Kinsta também define expectativas claras no topo - “Entraremos em contato em um dia útil”.

4. Seleção de escolha

O Choice Screening tem um formulário de contato longo . À primeira vista, você pode pensar que isso eliminará as taxas de conversão do formulário. E isso é uma espécie de verdade - Escolha Screening, sem dúvida, receber menos submissões de forma que fariam com uma forma mais curta.

Mas vamos falar sobre por que às vezes não há problema e por que esse é um ótimo exemplo de formulário de contato.

A Choice Screening opera em um espaço business-to-business muito especializado. Eles estão tentando obter leads qualificados que se transformarão em clientes de longa data, não apenas envios de formulários de contato.

Com sua lista de serviços detalhada e muitas caixas de seleção, o formulário eliminará as pessoas que ainda não têm certeza do que desejam e só permitirá a passagem de leads qualificados que têm uma grande chance de se tornarem clientes.

Você poderia dizer que o Choice Screening está rastreando seus clientes em potencial com este formulário de contato!

5. Joel Klettke / Redação de negócios casuais

Joel é um redator profissional, então você pode apostar que o design e a cópia do formulário de contato serão adequados.

O formulário de Joel em si é simples, com os campos padrão mais alguns campos de qualificação extras para o orçamento de uma pessoa. É tudo o que acontece ao lado do formulário que torna este um bom exemplo de formulário de contato, no entanto.

Nesse texto, Joel faz um ótimo trabalho em definir expectativas e qualificar seus leads. Ele também afasta propositadamente clientes de baixo orçamento ao discutir suas taxas mínimas. Embora Joel pudesse remover essas menções para obter uma taxa de conversão inicial mais alta, isso levaria a uma porcentagem menor de leads qualificados e acabaria perdendo o tempo de Joel.

6. Neil Patel

Neil Patel administra um dos sites de marketing digital mais populares do mundo, então você pode ter certeza de que ele recebe muitos envios de formulários de contato.

Para ajudar a encaminhar esses envios para o lugar certo, Neil inclui uma lista suspensa “Eu gostaria de conversar sobre” , onde as pessoas podem escolher entre uma variedade de opções predefinidas. Ele também usa microcópia na caixa de espaço reservado para implorar às pessoas que mantenham suas mensagens curtas e diretas.

Este é simples - mas às vezes simples é tudo que você precisa em seu design de formulário de contato.

7. Laboratório de foco

Ok, este é divertido, extravagante e definitivamente não funcionará para todos os negócios. Mas se você está em um espaço criativo (que é o Focus Lab), criar um design de formulário de contato caprichoso como este pode mostrar que você é capaz de pensar fora da caixa.

Em vez de criar uma forma tradicional, o Focus Lab usa mais uma abordagem do estilo Mad Libs, onde os visitantes inserem suas informações em um parágrafo existente. Usando essa abordagem, o Focus Lab também é capaz de coletar mais informações (como metas e orçamento) sem a aparência imponente que um design de formulário de contato mais tradicional pode ter.

8. CAMICB

CAMICB, abreviação de Community Association Managers International Certification Board, oferece certificação para associações comunitárias nos EUA.

O que é notável sobre o formulário de contato CAMICB é que ele usa uma abordagem híbrida de pop-up / página “Fale conosco”. Quando os usuários acessam a página Fale Conosco , o site CAMICB abre instantaneamente um formulário de contato pop-up simples onde os visitantes podem enviar suas mensagens.

Com apenas três campos, CAMICB mantém seu formulário curto e direto ao ponto. Em seguida, a abordagem pop-up cria uma interface agradável e livre de distrações, onde o foco está inteiramente no formulário.

Isso torna o envio de uma consulta o mais simples possível.

E para tornar as coisas ainda mais fáceis , CAMICB também exibe um formulário de contato deslizante que os usuários podem acessar em seu rodapé:

Como criar seu próprio design de formulário de contato personalizável

Depois de navegar por esses oito exemplos de formulários de contato, você provavelmente terá um monte de ideias surgindo sobre como aplicar esses princípios aos seus próprios designs de formulário de contato.

Se você quiser começar, [Getsitecontrol] (/ feedback-popup / pode colocá-lo em funcionamento em um piscar de olhos.

Ao contrário da maioria das soluções de formulário de contato, Getsitecontrol permite que você escolha entre quatro posições flexíveis e dezenas de modelos para o seu formulário. Você pode criar um pop-up tradicional como o que viu no CAMICB e no site Getsitecontrol. Ou você pode agitar as coisas com slides, barras de notificação, botões e muito mais.

Você poderá adicionar quantos (ou poucos) campos precisar para obter inscrições qualificadas e também pode inserir uma microcópia para ajudar os visitantes a preencher o formulário.

Inscreva-se no Getsitecontrol hoje e você terá um formulário de contato em funcionamento em apenas alguns minutos.