Escrever uma morada num telemóvel é um dos momentos mais lentos que um visitante passa no teu formulário. Vários campos. Teclado pequeno. É fácil enganar-se no nome da rua ou no número. Metade das pessoas salta os campos de morada opcionais porque a fricção não compensa. Depois entra o autocompletar de moradas. Escreve algumas letras. Vê o formulário sugerir a tua morada completa. Um clique e a morada preenche-se corretamente em todos os campos. Os formulários com pesquisa de moradas têm conclusões 35 a 40 por cento mais rápidas e 70 por cento menos abandono. É a diferença entre um formulário que converte e um que deixa fugir contactos.
Pega em qualquer formulário que exija uma morada e observa o que acontece. As pessoas escrevem a morada à mão. Enganam-se no número do prédio. Abreviam quando deviam escrever por extenso. Perguntam-se se o campo quer Rua ou R. Alguns formulários têm três campos de morada separados. Outros têm um. Quando acabam, estão cansadas. Saltam os campos opcionais. Repensam se devem enviar. A fricção acumula-se. Agora acrescenta o autocompletar de moradas a esse mesmo formulário. No momento em que escrevem as primeiras letras da morada, o formulário sugere a morada completa. Um clique confirma. A morada preenche-se sozinha em todos os campos certos. Bem formatada. Sem erros. Sem fricção.
O que torna os campos de morada fundamentalmente diferentes de outros campos de texto
Uma morada não é uma informação simples. É uma estrutura complexa com várias partes. Rua. Número do prédio. Cidade. Distrito ou província. Código postal. País. Cada parte tem regras. Algumas partes são obrigatórias em certos países e opcionais noutros. A formatação varia consoante a região. Uma morada válida no Canadá está estruturada de forma diferente de uma nos Estados Unidos. Uma morada que funciona em Londres tem um formato de código postal diferente de uma em Tóquio.
A introdução manual falha porque as pessoas têm de se lembrar de todas estas regras enquanto escrevem. Têm de decidir como abreviar. Têm de saber se o país delas usa um código postal, um postcode ou um zip code. A pesquisa de moradas resolve isto pensando por elas. O sistema conhece a estrutura. Conhece as regras de formatação. A pessoa que preenche o formulário só escreve as primeiras letras e escolhe entre as sugestões.
Porque é que o autocompletar de moradas importa para a conclusão do formulário
Os números são impressionantes. Os formulários com autocompletar de moradas são concluídos 35 a 40 por cento mais depressa do que os formulários sem ele. O abandono desce 70 a 80 por cento. A conversão em telemóvel sobe 25 por cento ou mais só por acrescentar a pesquisa de moradas. Não são melhorias pequenas. É a diferença entre um formulário que converte e um que perde metade dos teus contactos.
A razão é simples. Escrever moradas é lento e dá azo a erros. As pessoas enganam-se. Ficam frustradas com vários campos. Começam a perguntar-se se precisam mesmo de enviar. O autocompletar de moradas remove os três problemas de uma só vez. A velocidade sobe. Os erros desaparecem. A frustração evapora-se.
Como a pesquisa de moradas funciona por trás dos bastidores
A pesquisa de moradas não é magia. É um serviço que conhece todas as moradas válidas de uma região. Começas a escrever a tua morada. O formulário envia o que escreveste ao serviço de pesquisa de moradas. Esse serviço compara as tuas letras com a sua base de dados de moradas reais. Devolve as correspondências mais próximas. Vês uma lista pendente de sugestões. Clicas na que corresponde à tua morada. A morada inteira preenche-se no formulário, bem formatada e verificada.
Este passo de verificação é essencial. Quando alguém escreve a morada à mão, os erros podem passar. Uma letra a menos. Uma abreviatura de rua escrita por extenso. Quando o formulário vai buscar a morada a um serviço de pesquisa, ela foi verificada numa base de dados de moradas reais. O resultado são dados limpos. Sem erros. Sem inconsistências de formatação. A morada que entra no teu sistema é a morada que os correios vão reconhecer.
A abordagem do campo de texto único versus formulários de morada com vários campos
Alguns formulários de morada pedem que escrevas a morada numa única caixa de texto e depois usam a pesquisa para separar os componentes. Outros começam com um único campo só para o número da porta e o código postal, e depois usam a pesquisa para preencher tudo o resto. Ambos funcionam. A escolha depende do teu público e do teu âmbito geográfico.
A abordagem do campo único
Dá às pessoas um campo de texto. Chama-lhe Morada. Escrevem a morada completa. O autocompletar sugere correspondências. Escolhem uma. O sistema separa essa morada em rua, cidade, distrito e código postal. Isto funciona melhor quando serves bem uma região específica. Os formulários dos Estados Unidos podem usar esta abordagem porque o sistema de moradas dos EUA é consistente e o serviço de pesquisa tem dados completos. Um campo parece sem fricção. O sistema trata da complexidade.
A abordagem do número da porta e do código postal
Começa com dois campos. O primeiro campo é o número da porta e a rua. O segundo campo é o código postal. Alguém escreve o número da porta e a rua. Aparecem sugestões. Escolhem uma. O campo do código postal preenche-se automaticamente. Esta abordagem funciona bem em países que têm bons dados de códigos postais e estruturas de moradas consistentes. As moradas do Reino Unido usam muitas vezes este método porque os postcodes do Reino Unido são rigorosos e completos.
A abordagem completa com vários campos e revelação progressiva
Alguns formulários ainda usam rua, cidade, distrito e código postal como campos separados, mas melhoram-nos com autocompletar no campo da rua. Quando alguém escreve a rua e o número da porta, o campo da rua completa-se. Quando escolhem uma morada, a cidade e o código postal preenchem-se automaticamente. O distrito pode ser opcional ou preencher-se sozinho, consoante a morada seja ambígua. Isto equilibra a clareza dos campos separados com a comodidade do autocompletar.
Como desenhar campos de morada para telemóvel e computador
Os campos de morada têm restrições diferentes em dispositivos diferentes. O ecrã de um telemóvel é estreito. O monitor de um computador é largo. Nenhum é ideal para escrever uma morada de memória.
Desenho do campo de morada no telemóvel
Num telemóvel, o campo de morada deve ter a largura total. O campo de texto deve ser alto o suficiente para ser fácil de tocar. O teclado deve ser o de texto, com acesso fácil a números e pontuação. Quando alguém escreve os primeiros caracteres, a lista de autocompletar deve aparecer por cima do teclado, para que se vejam as sugestões sem o teclado as tapar. Os botões de sugestão devem ser grandes o suficiente para um polegar tocar com facilidade. Quando escolhem uma morada, o teclado deve fechar e o formulário deve passar automaticamente ao campo seguinte. Reduz ao mínimo o número de toques.
Desenho do campo de morada no computador
No computador, o campo de morada pode ser mais estreito, porque o cursor é mais preciso do que um polegar. A lista de autocompletar deve aparecer por baixo do campo para não empurrar o resto do conteúdo. Mostra várias sugestões de uma vez. Deixa as pessoas usar as setas para navegar entre sugestões. Deixa-as carregar em Enter para escolher. Faz o autocompletar parecer reativo e amigo do teclado para quem prefere não pegar no rato.
Tamanho dos campos e hierarquia visual
O tamanho de um campo deve refletir a quantidade de texto que espera. Um campo de código postal deve ser pequeno e estreito. Um campo de rua deve ser mais largo porque as moradas de rua são mais compridas. Faz o campo do código postal claramente mais pequeno. Esta pista visual diz às pessoas que este campo espera menos informação. O contraste nos tamanhos dos campos faz o formulário parecer lógico e reduz a confusão.
Desenho de campos de morada internacionais e flexibilidade
Os formatos de morada mudam consoante o país. Uma morada francesa tem cidade e código postal, mas não tem distrito. Uma morada canadiana tem província e código postal. Uma morada australiana usa postcodes. Uma morada alemã pode incluir um bairro. Um postcode do Reino Unido consegue identificar quase qualquer local sem precisar dos dados da rua.
Se o teu formulário serve apenas um país, desenha-o para a estrutura de moradas desse país. Se serve vários países, acrescenta flexibilidade. Deixa as pessoas escolher o país numa lista pendente. Com base na escolha, mostra os campos de morada relevantes para esse país. Um formulário de morada dos EUA mostra o estado e o ZIP code. Um formulário do Reino Unido mostra o postcode, mas pode nem mostrar um campo de estado. Isto reduz a confusão porque as pessoas preenchem os campos que realmente importam no país delas.
Os serviços de pesquisa de moradas variam consoante o país. Algumas regiões têm bases de dados completas. Outras não. Testa o teu serviço de pesquisa de moradas em cada país que suportas. Garante que cobre os bairros e as cidades mais pequenas onde vivem os teus clientes. Um serviço de pesquisa que só cobre grandes áreas metropolitanas cria fricção para quem vive em localidades mais pequenas.
A implementação técnica do preenchimento automático de moradas
Do lado do utilizador, o preenchimento automático de moradas parece mágico. Escreve algumas letras, vê sugestões, clica numa. Do lado técnico, isto exige uma estrutura HTML adequada e os atributos certos.
Atributos HTML que ativam o autocompletar
O navegador tem conhecimento incorporado dos campos de formulário comuns. Se disseres ao navegador que um campo é um campo de morada, o navegador pode preenchê-lo a partir da morada guardada do utilizador. Usa o atributo autocomplete do HTML. Define-o como address-line1 para a rua, postal-code para os códigos postais e valores semelhantes para outros campos. O navegador reconhece estes atributos e oferece-se para preencher a partir da informação guardada do utilizador.
Nem toda a gente tem uma morada guardada no navegador, mas para quem tem, atributos de autocompletar adequados significam que o formulário se preenche com um clique. O utilizador já ganhou. O campo está preenchido. Segue em frente. Isto funciona em conjunto com o serviço de pesquisa de moradas. O autocompletar do navegador é para quem guardou a sua informação. O serviço de pesquisa de moradas apanha todos os outros.
O atributo name também importa
Cada campo de morada precisa de um atributo name descritivo. name=street-address para o campo da rua. name=postal-code para o código postal. Estes atributos deixam o navegador perceber para que serve cada campo. Também tornam o formulário mais fácil de processar pelos programadores no backend. Um campo sem um atributo name claro é mais difícil de o navegador perceber e mais difícil de trabalhar no teu código de servidor.
Validação no cliente ou no servidor
A pesquisa de moradas devolve sugestões de uma base de dados de moradas verificadas. Isto significa que a sugestão de morada já foi validada contra uma morada conhecida e correta. Mas valida na mesma no servidor depois do envio. Alguém pode desativar o JavaScript no navegador. Alguém pode enviar o formulário por uma API. O teu servidor valida tudo. A pesquisa de moradas serve a comodidade do utilizador e a qualidade dos dados. A validação no servidor serve a segurança e a integridade.
Quando as pessoas precisam de uma opção de introdução manual da morada
A pesquisa de moradas é poderosa, mas não cobre todos os cenários. Alguém acabou de se mudar para uma morada que ainda não está na base de dados. Alguém está a introduzir uma morada numa zona rural que o serviço de pesquisa não cobre. Alguém está a introduzir uma morada de entrega que é tecnicamente uma alcunha e não uma morada formal. Inclui uma opção de introdução manual. Se a pesquisa de moradas não sugere nada parecido com o que estão a escrever, deixa-os escrever a morada à mão. Mostra uma ligação para introduzir a morada manualmente. Não obrigues as pessoas a usar a pesquisa se ela não está a funcionar para elas.
Erros comuns nos campos de morada que criam fricção
Etiquetas de campo confusas
Nunca uses linha de morada um, linha de morada dois e linha de morada três. Estas etiquetas confundem as pessoas. O que vai na linha um e o que vai na linha dois. O número do apartamento deve ir na linha dois. A linha três é sequer necessária. Usa etiquetas claras. Rua. Apartamento ou andar (opcional). Cidade. Distrito. Código postal. A etiqueta específica diz às pessoas exatamente o que vai em cada campo.
Exigir campos que deviam ser opcionais
Nem toda a gente tem um número de apartamento. Nem toda a gente precisa de um nome do meio. Algumas moradas não se encaixam na estrutura padrão. Torna o apartamento, o andar e campos semelhantes opcionais. Faz o formulário adaptar-se ao que a pessoa está realmente a introduzir, em vez de a obrigar a encaixar numa estrutura padrão que não se aplica.
Não mostrar que campos são obrigatórios
Se a rua e o código postal são obrigatórios mas o apartamento é opcional, deixa isso claro. Um simples asterisco ou a palavra obrigatório junto da etiqueta do campo diz às pessoas o que têm de preencher. Sem este sinal, as pessoas ficam a pensar se precisam de introduzir dados e onde estão os campos obrigatórios.
Pesquisa de moradas que não funciona em zonas rurais
Alguns serviços de pesquisa focam-se nas grandes cidades. Alguém numa localidade pequena escreve a morada e não recebe sugestões. Fica frustrado. Se o teu formulário serve zonas rurais, testa lá o teu serviço de pesquisa de moradas. Escolhe um serviço que cubra localidades mais pequenas e moradas de entrega rurais. Se não encontrares um serviço que funcione em todo o lado onde precisas, facilita a introdução manual.
Como melhorar a qualidade dos dados de morada e reduzir erros
Usa a verificação de moradas depois da escolha
Quando alguém escolhe uma morada nas sugestões de autocompletar, tens uma morada verificada. O serviço de pesquisa confirmou que existe. Mas verifica-a mais uma vez no servidor quando enviarem. Confirma que a morada ainda existe e continua formatada como o serviço de pesquisa a devolveu. Isto apanha casos limite e garante a integridade dos dados.
Guarda os componentes da morada em separado
Não guardes a morada completa num só campo de texto. Guarda rua, cidade, distrito, código postal e país como campos separados na tua base de dados. Isto torna os dados reutilizáveis. Podes ordenar por cidade. Podes filtrar por código postal. Podes gerar relatórios por distrito. Os campos separados também facilitam a validação. Podes verificar se o código postal corresponde à cidade e ao distrito.
Permite atualizar a morada
As pessoas mudam-se. Os bairros mudam. A morada de uma pessoa de há três anos pode já não ser válida. Deixa as pessoas atualizar a morada no teu sistema. Quando o fizerem, passa-a outra vez pela pesquisa de moradas para verificar que ainda é uma morada válida e para garantir que está formatada de forma consistente.
Autocompletar de moradas por tipo de formulário
A forma como aplicas a pesquisa de moradas muda consoante o objetivo do formulário.
Formulários de checkout
No checkout de uma loja online, o autocompletar de moradas é essencial. Cada segundo poupado no checkout é um segundo em que alguém não está a abandonar. Um cliente escreve uma morada. As sugestões aparecem de imediato. Clica na sua morada. Preenche os campos de envio e de faturação. O formulário parece rápido. Conclui o checkout. Usa o melhor serviço de pesquisa de moradas disponível. O custo de um serviço de pesquisa completo é pequeno comparado com o valor de um menor abandono no checkout.
Registo de conta e criação de perfil
Na criação de conta, a pesquisa de moradas ajuda, mas é menos crítica do que no checkout. As pessoas esperam que a configuração da conta demore um pouco. Mas torna-a o mais fluida possível. Deixa o autocompletar de moradas funcionar. Oferece a introdução manual como alternativa. Valida a morada no servidor.
Formulários de contacto e de captação de contactos
Na captação de contactos, a pesquisa de moradas cria confiança. Um formulário que preenche corretamente uma morada faz a pessoa sentir que a marca percebe onde ela está. Parece personalizado. Cria confiança de que o formulário de contacto funciona mesmo. Usa a pesquisa de moradas para impressionar potenciais clientes.
Como o WEMASY ajuda com o preenchimento automático de moradas
Os formulários do WEMASY incluem pesquisa de moradas incorporada, com verificação em tempo real numa base de dados. Cria um campo de morada no criador de formulários. O campo oferece automaticamente sugestões de morada enquanto alguém escreve. Quando escolhem uma morada, ela preenche com os dados corretos todos os outros campos de morada do formulário. Morada completa, bem formatada. Sem introdução manual. Sem erros. Funciona para moradas dos EUA e suporta a expansão internacional à medida que cresces. As estatísticas do formulário mostram quem tem dificuldades na introdução da morada e que sugestões são mais escolhidas. Ajusta o formulário com base em dados reais dos utilizadores. O criador de formulários trata de toda a complexidade técnica. Tu só te focas em recolher boas moradas.