9 práticas recomendadas de design de formulários da Web para aumentar as conversões

Publicados: 2022-09-02

Você está usando as melhores práticas de design de formulários para aproveitar ao máximo seus formulários do WordPress?

Ao projetar formulários, é crucial criar formulários simples, simplificados e responsivos que seus usuários gostem de preencher.

É provável que você receba mais envios e capte mais leads se seus formulários estiverem seguindo as principais práticas recomendadas que resistiram ao teste do tempo ao longo dos anos.

Este artigo mostrará as melhores práticas de design de formulários da Web para aumentar a conversão e fazer com que os visitantes amem seus formulários.

Neste artigo

  • 1. Use lógica condicional
  • 2. Adicionar campo de upload de arquivo para formulários de inscrição
  • 3. Interrompa envios de spam com CAPTCHA personalizado
  • 4. Permita que os visitantes escolham os valores de doação personalizados
  • 5. Deixe alguns campos como opcionais
  • 6. Use o campo de telefone inteligente WPForms
  • 7. Use o preenchimento automático de endereço
  • 8. Use o layout de várias páginas para formulários mais longos
  • 9. Use o tipo certo de campo para uma determinada finalidade

O que faz um bom design de formulário?

Quando se trata de um bom design de formulário, a melhor prática é manter seus formulários o mais simples possível, tendo apenas os campos necessários que sejam relevantes para o respondente.

Quanto maior for o seu formulário, maior a probabilidade de um usuário abandoná-lo antes de preenchê-lo completamente.

WPForms é o melhor plugin WordPress Form Builder. Obtenha gratuitamente!

Se você não puder evitar criar um formulário longo, existem táticas como dividir seu formulário em várias páginas ou permitir que os usuários salvem um formulário para acesso posterior que você pode usar.

Vamos analisar detalhadamente as melhores práticas de design de formulários que você deve seguir para fornecer a melhor experiência do usuário aos seus visitantes.

Práticas recomendadas de design de formulários para aumentar as conversões

Antes de começarmos com as melhores práticas de design de formulários, verifique se você está usando WPForms para criar seus formulários.

WPForms é o melhor plugin de criação de formulários para WordPress que permite criar formulários responsivos para desktops e celulares. É amado por mais de 5 milhões de empresas baseadas em WordPress.

WPForms

Com uma interface fácil de arrastar e soltar do construtor de formulários e mais de 400 modelos de formulários, o WPForms tem todas as ferramentas necessárias para criar formulários que seguem as práticas recomendadas de design de formulários.

Obtenha WPForms agora

1. Use lógica condicional

A lógica condicional permite criar formulários dinâmicos, exibir texto personalizado ou definir valores de campo personalizados com base na seleção do usuário.

A razão pela qual a lógica condicional é um ótimo recurso para um design de formulário eficiente é que ela permite que você mostre campos extras somente quando as respostas de um usuário os exigirem.

conditional job application form

Sem lógica condicional, muitas vezes você se verá forçado a incluir os mesmos campos para todos os visitantes, mesmo que esses campos não sejam relevantes para eles. Isso introduz distrações desnecessárias para esses visitantes, aumentando as chances de abandono.

Os casos de uso mais comuns para lógica condicional em formulários do WordPress são:

  • Adicione um usuário à sua lista de e-mail apenas se ele marcar a caixa para se inscrever na lista de e-mail do formulário de contato (ótimo para empresas).
  • Oculte perguntas inteiras se o cliente não selecionar uma opção específica (ótimo para pesquisas de formato longo).
  • Mostrar um bloco HTML com uma oferta exclusiva se o usuário comprar a opção de preço mais alto (Ótimo para upsells).

WPForms inclui um sistema de lógica condicional fácil que você pode usar para controlar o comportamento de exibição de qualquer campo em seu formulário.

Habilitar lógica condicional para um campo

Você pode definir sua lógica para ser tão simples ou tão complexa quanto quiser,

Com a lógica condicional, seus formulários parecem mais limpos, focados e simplificados. Portanto, sempre que você tiver um formulário em que precisa de campos que possam ser relevantes apenas para uma fração de seus visitantes, tente adicionar lógica condicional para oferecer uma melhor experiência ao usuário.

2. Adicionar campo de upload de arquivo para formulários de inscrição

Se você estiver criando um formulário de solicitação de emprego, faz sentido dar aos candidatos a capacidade de fazer upload de seus currículos e outros arquivos diretamente por meio de seu formulário.

O WPForms vem com um campo de Upload de Arquivo que permite coletar arquivos por meio de seus formulários online.

Example of multiple files uploaded to the Modern File Upload field

Quando um usuário envia uma entrada, você pode acessar facilmente os arquivos que ele enviou enquanto também visualiza o restante dos detalhes do aplicativo na mesma interface.

Isso é bom para manter seus aplicativos organizados com os arquivos completos e detalhes de cada candidato armazenados separadamente em seu painel do WordPress.

Além disso, simplifica as coisas para os candidatos, pois eles podem fornecer todos os detalhes e anexar todos os documentos necessários no mesmo local.

3. Interrompa envios de spam com CAPTCHA personalizado

O spam de formulários é um problema importante com o qual todo site precisa lidar. Embora o reCAPTCHA do Google tenha ajudado a combater o spam de formulários de contato, ele também pode ser invasivo à privacidade e frustrante para os usuários resolverem seus desafios de imagem.

O WPForms está equipado com muitas ferramentas anti-spam além do reCAPTCHA. Um método eficaz que também é muito fácil de usar é usar o captcha personalizado.

O addon Custom Captcha do WPForms permite que você crie uma pergunta simples e defina sua resposta. Isso pode ser algo tão simples quanto uma soma matemática, que os humanos podem resolver sem esforço, mas os bots de spam geralmente não conseguem.

A custom maths question in a form field

Confira este guia sobre como criar formulários de contato WordPress sem spam para aprender mais maneiras de evitar envios indesejados de formulários.

4. Permita que os visitantes escolham os valores de doação personalizados

Ao coletar fundos em sua página de destino de doação, você não deseja forçá-los a doar uma determinada quantia. Em vez disso, é melhor dar a eles a liberdade de escolher quanto eles gostariam de doar, dependendo do que é gerenciável para eles.

WPForms oferece diferentes tipos de campos de pagamento. O campo Item único pode ser configurado para aceitar entradas definidas pelo usuário, o que permite que um usuário insira qualquer valor de doação de sua escolha e seja cobrado exatamente pelo mesmo.

A simple donation form

Como uma organização sem fins lucrativos, sua página de doação deve incentivar os visitantes a contribuir da forma que puderem, e especificar valores fixos de doação pode, às vezes, impedi-los de fazer doações livremente.

5. Deixe alguns campos como opcionais

Você deve sempre se esforçar para manter seus formulários tão curtos e simples quanto possível. Isso significa garantir que você marque apenas os campos obrigatórios que são absolutamente necessários para suas necessidades.

Marcar muitos campos de formulário como obrigatórios é uma prática ruim de design e pode desanimar os visitantes que desejam preencher o formulário rapidamente.

form fields required

No WPForms, você pode marcar qualquer campo como obrigatório ou deixá-lo opcional usando um botão de alternância em Opções de campo.

mark as required

Se você quiser que os visitantes preencham mais informações, você pode marcar os opcionais em vez de marcar os campos obrigatórios.

6. Use o campo de telefone inteligente WPForms

Para aumentar as conversões, você deve tornar o processo de preenchimento de formulários sem esforço, exigindo o menor número de cliques e pressionamentos de botão do usuário.

O campo Telefone do WPForms pode exibir automaticamente o formato de número de telefone correto com base em sua geolocalização. Portanto, não importa de onde seu usuário seja, o campo Telefone adicionará automaticamente o formato de número de telefone usado no país do visitante.

Smart phone field in WPForms

É uma conveniência simples, mas seus usuários certamente apreciarão a experiência personalizada de ter seu código de país correto pré-preenchido em seu formulário.

7. Use o preenchimento automático de endereço

O preenchimento automático de endereços é outro recurso que pode melhorar muito a experiência do usuário em seus formulários da web, tornando mais rápido para os usuários preencherem seus endereços.

Essa é uma maneira fácil de ajudar seus visitantes a economizar tempo para reduzir o abandono de formulários.

address autocomplete field in action wpforms

O WPForms funciona muito bem como um plugin de geolocalização para WordPress, pois é capaz de detectar a localização de seus usuários e, ao mesmo tempo, permitir que eles localizem sua localização em um mapa interativo.

Você precisará do complemento WPForms Geolocation para acessar essa funcionalidade. O WPForms pode ser integrado ao Google Places ou ao Mapbox para habilitar recursos de geolocalização para seus formulários.

8. Use o layout de várias páginas para formulários mais longos

Formulários longos podem ser esmagadores para seus visitantes. Uma das melhores práticas de design de formulários longos da Web é dividir seus formulários em várias páginas. Isso é muito bom para a conversão porque consegue prender a atenção do usuário por mais tempo.

O layout de várias páginas do WPForms também adiciona uma barra de progresso ao formulário, o que efetivamente incentiva os usuários a ultrapassar a linha de chegada e preencher o formulário completo. Isso tem um grande impacto na melhoria das taxas de conversão para formulários web mais longos.

Multi-Page form in WPForms

Uma boa regra é não incluir mais de 3-4 campos em uma única página do seu formulário da web. Aqui está um guia para criar formulários de várias etapas no WordPress.

9. Use o tipo certo de campo para uma determinada finalidade

Os formulários da Web geralmente contêm diferentes tipos de campos, dependendo da natureza da pergunta que o campo está fazendo.

Por exemplo, os campos Múltiplas Escolhas (também conhecidos como botão de opção) são ótimos quando você deseja que os usuários façam apenas uma seleção de uma lista de várias opções disponíveis.

multiple choice example

Por outro lado, os campos Checkboxes são ótimos se você quiser que um usuário selecione uma ou mais opções entre as opções disponíveis.

WPForms Checkboxes

E o campo Itens suspensos é mais adequado quando você deseja condensar várias opções em um único menu suspenso que só se expande quando um usuário clica nele. Isso é ótimo se você quiser reduzir a rolagem vertical do seu formulário.

Assim como o campo Múltiplas escolhas, você pode selecionar apenas uma opção por vez em um campo suspenso.

drop down menu in WPForms

Se você quiser saber mais sobre botões de opção e caixas de seleção, confira nosso artigo sobre botões de opção versus campos de caixa de seleção.

E aí está! Estas são algumas práticas de design de formulários da Web testadas pelo tempo que os principais profissionais de marketing têm usado para aumentar as conversões.

Use-os no próximo formulário da Web que você criar e provavelmente verá uma taxa de conclusão impressionante para seus formulários!

Em seguida, aplique as práticas recomendadas do formulário da página de destino

Quando alguém visita sua página de destino, você tem uma chance de convertê-lo, portanto, seu formulário precisa ser projetado para ter o máximo impacto.

Confira este artigo sobre as melhores práticas para formulários de landing pages para saber como obter ótimos resultados com sua landing page e evitar a perda de leads valiosos.

Além disso, confira esta comparação Gravity Forms vs Typeform vs WPForms para saber qual construtor de formulários é o mais adequado para o seu negócio.

Obtenha WPForms agora

Pronto para construir seu formulário web? Comece hoje com o plug-in mais fácil de criação de formulários do WordPress. O WPForms Pro inclui muitos modelos gratuitos e oferece uma garantia de reembolso de 14 dias.

Se este artigo o ajudou, siga-nos no Facebook e Twitter para mais tutoriais e guias gratuitos do WordPress.