Campos de email e validação: apanhar endereços errados

A validação do campo de email importa. Aprende a verificar em tempo real, a escrever mensagens úteis e a reduzir erros de escrita e rejeições.

Rascunho

Um campo de email parece simples à superfície. Uma caixa de texto com a etiqueta "Email." Mas o que pões dentro desse campo determina se as tuas mensagens de seguimento chegam à caixa de entrada certa ou voltam como não entregues. Um campo de email fraco aceita erros de escrita. Um forte apanha-os antes de se tornarem um problema teu.

Pega em qualquer formulário de alta conversão e vê como trata a introdução do email. A maioria deixa de validar no momento em que alguém escreve um endereço de email no campo. Esperam pela submissão. Nessa altura, um erro de escrita já entrou na tua base de dados. Envias a mensagem de boas-vindas para um endereço falso. O contacto nunca chega. Perdes um lead que já tinhas convertido. Algumas verificações de validação no próprio campo, antes da submissão, impedem que isto aconteça.

O que torna um campo de email diferente de outros campos de texto

Um campo de email não é só mais uma caixa de texto. Os dados que lá entram importam mais. Um erro num número de telefone pode significar que contactas a pessoa errada uma vez, e segues em frente. Um erro num endereço de email significa que toda a tua sequência de seguimento volta devolvida. Um endereço de email mau na tua base de dados é peso morto. Não pode ser corrigido. Não pode ser recuperado. Fica ali, a distorcer a tua lista de contactos e as tuas taxas de entrega.

É por isso que os campos de email precisam de validação ativa. Não depois da submissão. Durante a escrita.

Porque importa a validação em tempo real na introdução do email

A validação em tempo real observa o que alguém escreve e dá feedback imediatamente. Escrevem um email. O campo verifica-o em tempo real. Se algo parecer errado, diz-lhes antes de submeterem. Isto é diferente da validação de todo o formulário, que só corre depois de clicar no botão de envio.

A validação em tempo real funciona porque apanha o momento em que alguém comete um erro. As mãos ainda estão no teclado. Veem a mensagem de erro e corrigem logo. Não ficam a perguntar-se porque é que a submissão foi rejeitada depois de já terem clicado em enviar. Nunca têm de voltar e repetir o formulário. O atrito desaparece.

Que validações deve realmente fazer o teu campo de email

Nem toda a validação de email é igual. Níveis diferentes apanham problemas diferentes. A maioria dos formulários salta os que mais importam.

Verificação básica de sintaxe

A validação mais simples confirma que o email tem a estrutura básica de um endereço de email verdadeiro. Algo pelo menos como username@domain.com. Isto apanha erros óbvios, como faltar o símbolo @ ou esquecer o domínio por completo. Mas a sintaxe básica sozinha não chega. Alguém podia escrever valid@madeupaddress.com e passar nesta verificação, mesmo que esse domínio não exista.

Validação do domínio

A validação do domínio verifica se a parte do domínio do email realmente existe. gmail.com é um domínio real? Sim. gmai1.com (com um 1 em vez de l) é um domínio real? Não. Acrescentar a validação do domínio apanha uma enorme classe de erros de escrita. Alguém escreve gamil.com por engano. A validação falha. Corrigem logo. Isto trava dados maus antes de entrarem no teu sistema.

Verificação da caixa de correio

O nível mais profundo de validação verifica realmente se a caixa de correio existe nesse domínio. Isto exige ligar ao servidor de email do domínio e perguntar se esse endereço de email específico está ativo. É o padrão de ouro. Apanha o caso em que alguém escreveu um endereço de email válido que simplesmente não pertence a ninguém. Mas este nível de validação também é mais lento e exige serviços de terceiros. Usa-o quando a qualidade dos dados mais importa, como em leads de alto valor ou confirmações de pagamento.

Como desenhar um campo de email para feedback em tempo real

Os teclados de telemóvel importam mais do que pensas

No telemóvel, mostra o teclado de email automaticamente. Diz ao navegador type="email" e ele mostra um teclado com o símbolo @, o ponto e o .com predefinidos. Não é só comodidade. Evita erros de escrita desde o início, porque os utilizadores veem o símbolo @ e a disposição lembra-lhes em que formato estão a escrever. Sem este teclado, alguém a tocar num ecrã pequeno de telemóvel pode esquecer-se completamente de onde vai o @.

Texto de ajuda que diz o que realmente precisas

A etiqueta deve dizer "Email." Não sejas criativo. O texto de ajuda por baixo do campo pode acrescentar contexto. "Vamos enviar-te aqui uma ligação de confirmação" ou "Usa o email que consultas com regularidade." Estas pequenas dicas lembram às pessoas que vais usar este endereço para as contactar, por isso os erros de escrita têm consequências.

Mostra feedback de validação sem bloquear o formulário

Quando a validação em tempo real encontra um erro, mostra uma pequena mensagem junto ao campo. "Querias dizer gmail.com?" é melhor do que "Formato de email inválido." Dá-lhes a correção específica de que precisam. A mensagem aparece enquanto escrevem, não depois de submeterem. Veem-na e corrigem sem atrito. Este tipo de feedback não deve bloquear totalmente a submissão do formulário. Deixa alguém passar ao campo seguinte. Se voltarem ao email com um erro ainda visível, é nessa altura que impedes a submissão.

Codificar por cor não chega para a acessibilidade

Quando um campo de email tem um erro, usa cor e um ícone. Texto vermelho sozinho não ajuda quem não vê cores. Um fundo vermelho sozinho não ajuda quem usa um leitor de ecrã. Combina uma borda vermelha, um pequeno ícone vermelho e o texto da mensagem de erro, para que todos percebam que há um problema.

Como integrar a validação de email no fluxo do teu formulário

Não peças às pessoas que confirmem o email escrevendo-o duas vezes

Muitos formulários pedem o email e depois a confirmação do email. Isto duplica o atrito. Alguém tem de escrever o endereço de email duas vezes sem errar em nenhum dos campos. Isto aumenta o abandono. Uma abordagem melhor é enviar-lhes um email de confirmação depois da submissão. Um clique numa ligação na caixa de entrada prova que o email é real e funciona. Isto valida o email, reduz erros de escrita e corta o abandono do formulário para metade.

Valida no cliente, mas também no servidor

O feedback em tempo real acontece no navegador enquanto escrevem. É a validação do lado do cliente. Mas tens também de validar no teu servidor depois de submeterem. Alguém pode desativar a validação do lado do cliente. Alguém pode submeter dados maus através de uma API. O teu servidor valida tudo. A validação em tempo real é para comodidade do utilizador. A validação do servidor é para a integridade dos dados.

Usa validação progressiva enquanto escrevem

Não esperes que acabem de escrever o email todo. Começa a validar a sintaxe enquanto escrevem. Quando acrescentam um símbolo @, começa a verificar se o domínio existe. Mostra os erros progressivamente. Isto dá-lhes feedback sem os fazer esperar até terem escrito um endereço completo. Alguém escreve john@g e começa a ver "querias dizer gmail.com?", mesmo sem ter acabado de escrever. É útil, não intrusivo.

Que erros comuns prejudicam a qualidade dos teus dados de email

Aceitar endereços obviamente falsos

Alguns formulários aceitam test@test.com ou admin@localhost ou any@example.com. Não são endereços de email reais que alguém use. São entradas de teste ou submissões de spam. A validação deve rejeitar estes endereços. Muitos serviços de validação têm listas incorporadas de endereços falsos comuns. Usa-as.

Mostrar erros de validação só depois da submissão

Se esperas que alguém clique em enviar para lhe dizer que o email é inválido, já criaste atrito. Clicam em enviar, veem um erro, corrigem o email e submetem de novo. Isto são duas interações em vez de uma. A validação em tempo real acontece enquanto escrevem, por isso o email está correto quando clicam em enviar.

Fazer a mensagem de erro culpar o utilizador

Mensagem ERRADA "Formato de email inválido" ou "Entrada de email incorreta." Estas culpam. Mensagem CERTA "Querias dizer gmail.com?" ou "Este domínio de email não existe." O segundo conjunto é útil e específico. Diz-lhes o que está realmente errado e como corrigir. É a diferença entre atrito e fluidez.

Ignorar problemas de maiúsculas e minúsculas

Tecnicamente, os endereços de email não distinguem maiúsculas de minúsculas, mas a validação deve aceitar maiúsculas e minúsculas indiferentemente. Alguém pode escrever JOHN@GMAIL.COM e deve validar como verdadeiro. Mas muitos formulários rejeitam letras maiúsculas. Aceita ambas ou converte para minúsculas automaticamente.

Como podes implementar estratégias de validação avançadas

Apanha os erros de escrita mais comuns

Gmail, Google, Yahoo e Hotmail representam uma enorme percentagem dos endereços de email. Quando alguém escreve gmai1.com ou gmial.com ou gmai.com, quase de certeza queria dizer gmail.com. Os bons serviços de validação reconhecem estes erros comuns e sugerem a correção. Alguém comete um erro. O formulário diz "Querias dizer gmail.com?" Clicam em sim ou fazem mais uma tecla para corrigir. O atrito fica quase nulo.

Percebe a diferença entre sintaxe válida e realmente entregável

Um endereço de email pode ser perfeitamente válido segundo as normas de email, mas totalmente inexistente. john@corporatecompany.com pode passar todas as verificações de validação, mas essa caixa de correio específica pode não existir. A validação profunda liga-se realmente ao servidor de email desse domínio e verifica. É a mais exata, mas também a mais lenta. Usa-a seletivamente.

Trata endereços descartáveis e catch-all

Serviços de email descartável como tempmail.com permitem às pessoas criar endereços temporários. Os domínios catch-all aceitam qualquer email enviado para eles. Nenhum é útil para comunicação real. A validação deve assinalá-los. Alguém usa um endereço de email temporário? Assinala-o durante a validação. Alguns formulários deixam as pessoas submeter na mesma, mas sabes que o endereço é de alto risco. Outros rejeitam-no de imediato. A escolha depende da importância do contacto por email para o teu caso de uso.

Como difere a validação de email consoante o tipo de formulário

A estratégia de validação de email muda consoante o objetivo do formulário.

Formulários de newsletter e subscrição

Nas subscrições de newsletter, valida a sintaxe e o domínio. Precisas de endereços de email reais porque vais enviar newsletters com regularidade. Emails maus significam devoluções. As devoluções prejudicam a tua reputação de remetente. Verifica se o domínio existe. Não precisas necessariamente da verificação ao nível da caixa de correio, porque o custo de verificar cada subscritor abrandaria demasiado o formulário. A validação de sintaxe e domínio apanha 90 por cento dos problemas.

Registo de conta e início de sessão

No registo, usa a validação completa, incluindo a verificação da caixa de correio, se possível. Estás prestes a dar a alguém acesso a uma conta. Queres ter a certeza de que o email é real. Também vais enviar um email de confirmação logo a seguir. Validar que a caixa de correio existe significa que a confirmação não será devolvida.

Captação de leads e formulários de contacto

Para leads de alto valor, usa a validação mais profunda disponível. São pessoas que a tua equipa de vendas vai contactar diretamente. Um email mau desperdiça o tempo de um comercial. Investir na verificação ao nível da caixa de correio compensa. Pode abrandar o formulário um ou dois segundos. Para um lead que pode valer milhares, essa troca faz sentido.

Como o WEMASY ajuda na validação de campos de email

O criador de formulários do WEMASY inclui validação de campos de email incorporada. Cria um campo de email e escolhe o teu nível de validação. A validação básica, com verificação de sintaxe e domínio, corre automaticamente. As mensagens de erro em tempo real aparecem enquanto as pessoas escrevem. A validação funciona no telemóvel. As mensagens de erro são amigáveis, não técnicas. Toda a validação acontece no cliente e no servidor, para os teus dados ficarem limpos. Liga os teus formulários ao teu CRM e só emails limpos e validados entram nos teus registos de contactos. Vê as taxas de falha de validação na análise dos teus formulários e ajusta o campo se as pessoas tiverem dificuldades. O criador de formulários trata da complexidade técnica para te concentrares em recolher bons dados.

Perguntas frequentes

Devo pedir às pessoas que escrevam o email duas vezes para o confirmar?
Não. Pedir a confirmação do email no formulário duplica o atrito e aumenta o abandono. Em vez disso, envia um email de confirmação depois de submeterem. Clicam numa ligação na caixa de entrada. Um clique confirma que o email é real e funciona melhor do que pedir-lhes que o escrevam duas vezes. Isto reduz o abandono do formulário e valida o email ao mesmo tempo. Com o criador de websites do WEMASY, podes configurar isto diretamente no teu website.
Qual é a diferença entre validação de email do lado do cliente e do lado do servidor?
A validação do lado do cliente corre no navegador enquanto escrevem. Dá-lhes feedback em tempo real. A validação do lado do servidor corre depois de submeterem. Verifica os dados nos teus servidores e toma a decisão final sobre aceitá-los. Precisas de ambas. O feedback em tempo real melhora a experiência. A validação do servidor protege os teus dados caso alguém contorne as verificações do navegador.
Devo rejeitar endereços de email descartáveis?
Depende do objetivo do teu formulário. Em comunicações críticas, como registos de conta ou reposição de palavra-passe, rejeita os endereços descartáveis, porque as pessoas vão precisar desse email a longo prazo. Nas newsletters, podes aceitá-los, já que as pessoas podem sempre cancelar a subscrição se o endereço deixar de funcionar. Considera o teu caso de uso e a importância do endereço de email para a tua relação com o contacto.
Como apanho erros como 'gmial' em vez de 'gmail'?
Usa um serviço de validação que inclua correspondência aproximada. Estes serviços reconhecem erros comuns dos principais fornecedores de email e sugerem correções. Quando alguém escreve gmial.com, a validação sugere gmail.com. Veem a sugestão e corrigem com uma tecla. Isto apanha os erros mais comuns sem ser demasiado agressivo.
A validação em tempo real abranda o meu formulário?
Só se tentares verificar a existência da caixa de correio sempre que alguém escreve. A validação de sintaxe e domínio é instantânea. A verificação da caixa de correio demora um ou dois segundos, porque liga a servidores de email. Usa a validação básica pela velocidade e a verificação da caixa de correio só em formulários de alto valor, em que a qualidade dos dados importa mais do que a velocidade. A escolha é tua.
Posso usar a validação de email para evitar registos falsos e spam?
A validação de email apanha erros de escrita e endereços inexistentes. Mas spammers determinados podem usar endereços de email reais. A validação sozinha não previne o spam. Combina-a com CAPTCHA, limitação de pedidos ou passos de verificação, se o spam for um problema sério. A validação é sobre a qualidade dos dados. A prevenção de spam exige medidas adicionais.

Põe isto em prática
no teu próprio site.

Começa grátis com a WEMASY e cria o teu site em poucos minutos.