Como projetar e criar formulários para aprimorar UX no WordPress

Publicados: 2019-04-08

Apesar de ser um aspecto crucial em cada site, é um segredo aberto que todo mundo odeia preencher formulários na web.

Mas surge a dúvida…

Por que esses formulários online estão sendo odiados? O que os torna tão irritantes?

A resposta é um tanto simples e direta. Em resumo, é o resultado de um design ruim e posicionamento inadequado; em uma palavra, a má forma UX é o principal culpado. Hoje, neste artigo, você aprenderá a projetar formulários melhores e, em seguida, criar de acordo com o que garante uma excelente experiência do usuário.

Como projetar formulários melhores e criá-los com um bom UX?

A maioria das interações online tem acontecido com formulários online e torna-se indispensável para qualquer tipo de negócio online. Portanto, se você tem um negócio online, precisa cuidar do design e estar atento ao melhor uso dos formulários.

Antes de irmos ao fundo, vamos fazer uma lista em formato tabular:

1. Formulários com design autêntico
2. Layout da Coluna e Alinhamento da Seção
3. Mantenha seu formulário simples e direto
4. Faça as perguntas mais relevantes
5. Forneça Opções Alternativas
6. Criando formulários de várias etapas
7. Validação de formulário em linha
8. Colocação de formulários em conformidade
9. Defina um forte apelo à ação
10. Colocação da etiqueta
11. Adicionando preenchimento automático
12. Layout da Coluna e Alinhamento da Seção
13. Formulário amigável do GDPR
14. Diversos

Agora, dê uma olhada nas táticas dentro detalhes que devem ser seguidos quando se trata de projetar e usar formulários para ter um melhor UX.

Crie formulários autênticos

Na maioria das vezes, os formulários parecem chatos e carecem de autenticidade porque são projetados de maneira descuidada e pouco profissional. É necessário que você faça com que seus usuários conheçam a finalidade do formulário.

O primeiro passo para fazer com que os usuários preencham um formulário é ganhar sua confiança e fornecer um propósito!

Os usuários não tendem a fornecer informações sobre si mesmos. E por que alguém confiaria seus dados valiosos a um estranho que não consegue construir um senso de confiança? Nesse caso, você precisa garantir que as informações fornecidas estejam em boas mãos e como elas serão usadas por você.

Ao projetar formulários melhores, você pode implantar o Google Captcha ou o Goggle reCAPTCHA, pois eles evitam que formulários da web sejam manipulados por spam. Você verá que o resultado do spam será removido e, o mais importante, os usuários se sentirão à vontade para preencher os formulários.

Voltar ao índice

Layout de coluna e alinhamento de seção

Estudos sobre rastreamento ocular mostraram que os formulários de coluna única são melhores do que os formulários de várias colunas. Geralmente, tendemos a preencher o formulário à medida que rolamos para baixo em um site: movendo-se de cima para baixo, e é assim que nos concentramos no conteúdo que acessamos através gh.

UX no WordPress, formulários de contato
Mantenha o alinhamento em todas as seções

Nesse caso, um formulário com várias colunas pode desviar os usuários e distraí-los do conteúdo. Um formulário com colunas paralelas pode quebrar o fluxo e interromper, mas mantê-lo em um único layout pode ser mais conveniente. Além disso, o formulário de coluna única é mais rápido de preencher e aumenta o nível de confiança em até 95%.

Voltar ao índice

Mantenha seu formulário simples e direto

A simplicidade tem o poder inato de fazer qualquer coisa parecer autêntica e amigável. O mesmo vale para o design de formulários da web. Tente simplificar os formulários da web e tornar a comunicação fácil e simples. Faça um estudo e, se necessário, faça uma breve pesquisa sobre o que torna o formulário um empecilho para seus usuários.

Há estudos que indicam apatia do usuário em enviar as informações no formulário. Isso significa que você corre o risco de perder sua conversão se o formulário não for projetado e gerenciado adequadamente. É por isso que seria sensato manter os formulários simples e fáceis de preencher.

Voltar ao índice

Faça as perguntas mais relevantes

Para garantir o interesse do usuário em preencher formulários, peça apenas o que você realmente precisa para que ele não fique entediado. Isso deve ser implementado imediatamente para garantir uma melhor UX. Torná-lo mínimo para obter o resultado máximo.

WordPress, formulários de contato
Faça perguntas relevantes

Uma coisa, você deve se lembrar ao projetar formulários, o comprimento e o número de campos de entrada em um formulário são alguns dos principais componentes que precisam ser considerados. Porque o comprimento de um formulário é proporcional à taxa de desistência. Isso significa que quanto mais formulários você mantém em seu site, maior a taxa de desistência que você pode esperar.

Certa vez, Neil Patel divulgou em um de seus artigos onde disse que conseguiu aumentar a conversão em 26% removendo apenas um único campo de formulário de seu formulário de contato. Portanto, certifique-se de que seu formulário de contato inclua as perguntas mais relevantes.

Criando formulários de várias etapas

Projetar formulários da web para criar formulários de várias etapas pode ser outra ótima maneira de aumentar o envolvimento do usuário e tornar os formulários menos irritantes. Isso significa que a divisão de formulários em várias etapas garante menos fadiga ao preencher o formulário.

Ao projetar para criar um formulário de várias etapas, tente manter no máximo 2-3 campos na primeira etapa. Além disso, a barra de progresso do formulário motiva os usuários a completarem também todo o processo de preenchimento do formulário. Isso não criará nenhuma distração ao preencher o formulário.

Voltar ao índice

Validação de formulário em linha

Seus formulários on-line devem ser projetados de forma a garantir a coleta das informações mais válidas dos usuários. Por exemplo, se alguém fornecer informações inválidas, o formulário mostrará um sinal vermelho após o erro. Este evento, em última análise, ajuda os usuários durante o preenchimento do formulário.

Há uma série de benefícios se você colocar a validação dentro do formulário. Alguns deles são dados abaixo:

  • A validação ajuda os usuários a entender os erros ao preencher o formulário. Isso garante a precisão dos dados que eles fornecem usando o formulário.
  • Ele também fornece uma sensação de confiança entre os usuários. O preenchimento bem-sucedido do formulário apresenta polegares para cima com feedback visual encorajador.
  • Os usuários fornecem informações precisas e válidas, ao mesmo tempo, os destinatários também obtêm dados autênticos.

Fornecer opções alternativas

Enquanto você fornece aos usuários uma maneira de se inscrever em seu site, mantenha uma ou mais formas alternativas de fazer isso acontecer. Isso certamente aumentará o interesse de seus usuários em preencher o respectivo formulário.

Plugin UX & UI WordPress
Dê opção alternativa

A melhor maneira de fornecer opções alternativas é permitir que seus usuários façam login pelo Google, Facebook, Twitter ou pode ser outra mídia. No geral, você pode definir a ideia como uma filosofia “menos é mais” que você precisa colocar em prática enquanto projeta formulários.

Voltar ao índice

Colocando formulários de acordo

Depois de criar formulários da web, é hora de colocá-los na posição correta. Isso aumentará o envolvimento dos usuários e ajudará a fazer com que as pessoas certas confiem nos serviços que você fornece.

Algumas estatísticas mostram que o tempo de engajamento geralmente atinge o pico quando você coloca os formulários na posição superior. Isso chama a atenção de seus usuários em primeiro lugar quando eles visitam seu site.

Mas, novamente, colocar um formulário de inscrição antes que os usuários vejam o conteúdo da sua página pode ser muito insistente e incomodar os usuários. Em poucas palavras, não existe uma regra definida sobre onde você deve colocar seu formulário em uma página. Depende de várias variáveis, como o objetivo dessa página específica, sua meta de negócios, o comportamento genérico do público etc.

Basicamente, você precisa equilibrar sua meta e o que seus usuários podem precisar; e coloque o formulário de acordo.

Voltar ao índice

Defina um forte apelo à ação

As estatísticas mostram um fato surpreendente de que 72% dos profissionais de marketing B2B não têm uma chamada para ação em suas páginas internas. Certifique-se de que você tenha uma chamada à ação forte e cativante. Ao criar um formulário, lembre-se de que o CTA é um ponto de inflexão entre as conversões e a taxa de rejeição.

chamada para ação, WordPress
Adicione um forte apelo à ação

Um CTA adequado acaba com muitos cliques porque leva os usuários a agirem positivamente. Além disso, muitos CTAs também deixam as pessoas confusas e você precisa ter certeza do que está oferecendo e a cópia do CTA precisa mostrar isso.

No geral, o tamanho, a cor e o texto do CTA precisam ser significativos para que possam causar impacto. Você pode alinhar o CTA com a voz e o tom da sua marca. Tente criar um senso de urgência que possa impactar os usuários brutos.

Voltar ao índice

Posicionamento da etiqueta

Os rótulos informam aos usuários sobre as informações que eles precisam colocar no campo de entrada. Basicamente, eles são posicionados fora do campo do formulário. Assim como o próprio posicionamento do formulário, o posicionamento do rótulo não possui nenhum guia definido sobre onde e como alinhá-lo e posicioná-lo. Depende principalmente da situação e dos requisitos.

Os designers de formulários podem ocultar o rótulo para animar formulários em vez de usar espaços reservados. Mas o mais comum é posicionar fora do campo do formulário. Você também pode alinhar o rótulo para obter mais atenção dos usuários. O rótulo justificado à esquerda geralmente recebe mais atenção dos usuários. Portanto, certifique-se de ter projetado o rótulo do formulário de acordo.

Voltar ao índice

Adicionando preenchimento automático

Considere o preenchimento automático se os usuários já estiverem cadastrados em seus serviços nos campos relevantes. Isso economizará tempo e encargos desnecessários que você pode enfrentar ao preencher qualquer formulário específico.

Você também pode preencher automaticamente alguns campos de entrada usando geolocalização. Isso irá ajudá-los a preencher o formulário rapidamente. Nesse caso, certifique-se de que todos os campos de entrada estejam disponíveis para personalização e forneça a eles o máximo controle enquanto estiverem preenchendo o respectivo formulário.

Voltar ao índice

Formulário amigável do GDPR

Torne seus formulários compatíveis com GDPR para que funcionem dentro dos regulamentos estabelecidos pela União Europeia (UE). Este é um dos aspectos mais importantes nos dias de hoje e evitará que a sua empresa seja afectada pela legislação da UE.

GDPR, formulário de contato amigável GDPR
Crie um formulário compatível com GDPR

Embora não seja aparente como você pode ser afetado pelo GDPR, pode ser a fonte de destruição para qualquer tipo de organização. Faça um estudo adequado sobre isso ou consulte um especialista que esteja lidando com o GDPR.Aprender mais sobre como tornar seu site compatível com GDPR.

Leia também: Como tornar seu site compatível com GDPR usando um plugin do WordPress.

Voltar ao índice

Diversos

Além dos problemas mencionados acima, existem alguns outros problemas a serem considerados para ter um melhor UX em seu site. Vamos dar uma olhada na listagem abaixo:

  • Algumas estatísticas mostram que os espaços reservados nos campos do formulário geralmente prejudicam a usabilidade, às vezes isso pode complicar o processo de preenchimento do formulário. Mas às vezes pode ser uma ótima opção manter o único espaço reservado no lugar do rótulo do campo. Depende da situação. Por exemplo, no caso de assinatura de newsletter, podemos usar apenas o placeholder em vez de um rótulo.
  • Não é necessário ou necessário manter o rótulo e o espaço reservado simultaneamente.
  • Se necessário, os rótulos dos campos e seus campos de entrada devem ser agrupados visualmente para ajudar os usuários a entender o formulário de maneira mais fácil. Neste caso, tenha cuidado com os enchimentos soltos, eles podem ser um zumbido às vezes.
  • Você pode enfatizar o foco automático para destacar o ponto de partida. Isso ajudará o usuário a começar corretamente.
  • Letras maiúsculas são difíceis de ler; seria sensato escrever o rótulo na combinação de ambos. Às vezes, os textos dos botões podem ser escritos em letras maiúsculas.
  • O botão é algo que se destina a realizar a ação direta do usuário. Portanto, o design do botão deve ser tratado com consideração especial. O botão deve ser projetado e criado após anexar os campos.
  • Não se esqueça de incorporar a entrada mascarada para facilitar o preenchimento do formulário.
  • É aconselhável usar um botão de opção em vez de usar um menu suspenso. Isso irá acelerar o processo de preenchimento do formulário. Isso torna o procedimento de preenchimento do formulário fácil e suave.
  • Mantenha uma opção de visualização de senha ou oportunidade para os usuários verificarem suas informações antes de pressionar o botão de envio. Nesse caso, você também notifica os usuários sobre o botão de caps lock pressionado.

Voltar ao índice

Antes de terminar

Os formulários são uma das partes mais indispensáveis ​​de um site. É por isso que projetar formulários e depois criar um pode ser o aspecto crucial de ter um bom UX em seu site. Antes de projetar formulários, você precisa ver as coisas da perspectiva do usuário.

1 novo NT BG

WP Fluent Forms Pro

Experimente o Fluent Forms hoje e veja você mesmo!

Baixe Agora

Torne todos os formulários concisos do início ao fim e forneça aos usuários alívio para preencher todo o formulário. Faça um estudo adequado dos recursos relevantes e faça o melhor esforço que você precisa. Como os formulários são uma parte importante da conquista da conversão, certifique-se de que os usuários possam acessá-los de maneira rápida e tranquila.

Conclusão

Como os formulários são uma parte crítica do seu site, você precisa ter cuidado ao projetá-los e criá-los. Ao projetar formulários da web, é sempre importante conduzir testes A/B e inspecionar todas as tendências atuais de marketing.

Além disso, você deve se certificar de que todos os formulários que você criou são compatíveis com dispositivos móveis. Enfim, pode-se dizer que se você seguir as táticas que discutimos aqui, definitivamente seria a melhor aposta para o seu site.

Como minha recomendação, se você quiser usar qualquer plugin do construtor de formulários do WordPress, certifique-se de estar usando o WP Fluent Forms para melhorar seu UX no WordPress. Espero que este artigo tenha ajudado você a saber mais sobre como criar formulários em seu site para melhorar a UX do site. Se você tiver alguma dúvida sobre o contexto, deixe-me saber sua preocupação deixando um comentário abaixo. Espero que eu volte para você em breve.

Algumas leituras legais recomendadas:

? Alternativas TypeForm

? Caldera Forms vs. WP Fluent Form

? Aumente o envolvimento do usuário