Melhorando o check-out no celular - Por que você deve desligar a autocorreção do iPhone
Publicados: 2021-08-19Uma das razões pelas quais os novos empreendedores hesitam em abrir uma loja online é porque temem o suporte ao cliente.
Steve, terei que instalar uma linha de suporte para minha loja? Prefiro não ter que lidar com os clientes diretamente pelo telefone. Posso apenas colocar um endereço de e-mail e encerrar o dia?
Embora ter que lidar com a inconveniência do suporte por telefone seja definitivamente uma preocupação válida, não temo o suporte ao cliente de forma alguma. Na verdade, eu aceito isso. E se eu pudesse falar com todos os clientes, eu o faria .
Por quê? É porque coisas boas sempre acontecem quando falo diretamente com um cliente. Não apenas as chances de converter uma venda aumentaram drasticamente , mas as ligações dos clientes resultaram em muitas correções de bugs importantes para o meu site.
Hoje, quero compartilhar com vocês um bug assassino em meu site para celular que está afastando clientes há quase um ano!
Dica: envolve checkout móvel e autocorreção do iPhone!
Obtenha meu mini curso grátis sobre como iniciar uma loja de comércio eletrônico de sucesso
Se você está interessado em começar um negócio de comércio eletrônico, reuni um pacote abrangente de recursos que o ajudarão a lançar sua própria loja online do zero. Certifique-se de pegá-lo antes de sair!
Droga, AutoCorreção!
Um dia, por acaso, estava perseguindo um cliente online quando notei um comportamento muito estranho. Essa pessoa tinha uma tonelada de mercadorias em seu carrinho de compras, mas continuou indo e voltando entre 2 páginas do site.
Em um momento eles estariam na página de checkout e então voltariam para a página do carrinho de compras e então voltariam para a página de checkout ... repetidamente. Na verdade, esse padrão inexplicável de navegação na web continuou por cerca de 10 minutos.
Agora, em circunstâncias normais, eu teria ligado para essa pessoa imediatamente, mas eu não tinha suas informações ainda porque ela não havia completado a primeira página do checkout. Então tudo que pude fazer foi esperar.
E, embora não pudesse ver o rosto do cliente, percebi que ele estava ficando frustrado e que provavelmente perderíamos a venda.
Felizmente, o cliente finalmente decidiu nos ligar por telefone para fazer seu pedido online.
Esposa: Lamentamos muito. Como posso ajudá-lo?
Cliente: Meu filho me disse que comprar no meu iPhone deveria ser fácil e direto, mas pela minha vida, não consigo pagar pelo seu site
Esposa: Ficarei feliz em anotar seu pedido por telefone.
Cliente: Muito obrigado. Já estou com tudo por aqui. Esse telefone idiota não me deixava entrar na minha cidade e endereço de e-mail corretamente !!! E eu estava ficando tão frustrado que queria jogar meu telefone do outro lado da sala.
Esposa: Sentimos muito por isso. Você se importaria de descrever seu problema exato para nosso conhecimento?
Acontece que essa simpática senhora morava em uma cidade chamada “Southborough”. Mas o seu IPhone não a deixava entrar na cidade corretamente porque continuava transformando “Southborough” em “South borough” .
Seu IPhone pensava que estava fazendo um favor a ela ao corrigir a digitação, mas não a deixava entrar em sua cidade corretamente.
Resolvendo o problema da autocorreção
Com certeza, quando tentei entrar em “Southborough” no IPhone da minha esposa, ele continuou tentando corrigir automaticamente a cidade também. E, como essa senhora, eu estava ficando um pouco frustrado por ter que fazer tanto esforço para que o telefone registrasse minha digitação corretamente.
Depois de fazer uma pequena pesquisa na web, descobri que tinha uma falha crítica de design em meu site para celular. Para evitar que um navegador da web interfira com a entrada de um cliente, você deve desligar a correção automática em todos os formulários de smartphones e tablets.
Felizmente, desligar a correção automática foi fácil de fazer ...
Para todos os seus formulários, você simplesmente precisa adicionar a seguinte tag a todos os seus campos de entrada de texto.
E para uma boa medida, você também deve desativar a capitalização automática e o preenchimento automático adicionando capitalização automática = ”off” e preenchimento automático = ”off” a todos os seus formulários também.
Depois de fazer essas alterações, foi muito simples inserir o endereço correto. Tivemos a sorte de esse cliente decidir ligar, porque provavelmente eu não teria pensado nesse problema potencial.
E embora eu tenha testado nosso site para celular completamente, não pensei em testar nomes e formas que o iPhone tentaria corrigir automaticamente.
Tornando os números de telefone clicáveis
Depois desse fiasco com o cliente, decidi fazer uma análise mais completa dos meus formulários da web para celular, prestando atenção especificamente à usabilidade e aqui está o que eu descobri.
Em primeiro lugar, é apenas um palpite, mas acredito que teríamos perdido esse cliente com certeza se não tivéssemos nosso número de telefone exibido em destaque no rodapé de nosso site para celular .
Mas eu tive muita sorte e aqui está o porquê. O Android e o iOS fazem um ótimo trabalho ao tornar os números de telefone clicáveis automaticamente por padrão.
Mas, como não escrevi nenhum código para tornar o número clicável explicitamente, nosso número clique para ligar pode não funcionar em todos os telefones .
Em geral, é melhor errar e não confiar na detecção automática, então aqui está o código para tornar os números de telefone clicáveis em um telefone.
Em primeiro lugar, você deseja desativar qualquer detecção automática que o telefone já oferece, porque deseja evitar que o sistema operacional torne números aleatórios clicáveis acidentalmente.
Então, você deseja transformar seu número de telefone em um link
Tornando a entrada de formulários ainda mais fácil
Outra coisa que notei ao tentar fazer um pedido foi que digitar meu número de telefone foi um pouco desajeitado . Como o teclado padrão do meu telefone coloca todos os números na linha superior do meu telefone, é muito fácil cometer um erro de digitação.
Felizmente, existem algumas construções HTML5 que tornam a digitação de números mais fácil.
Ao adicionar as seguintes tags ao campo de entrada do telefone, você pode fazer com que certos telefones (mais importante, o IPhone) usem um teclado de telefone em vez do teclado padrão ao inserir números.
Adicionar essas marcas aos campos de entrada de número de telefone abrirá o teclado numérico para tornar a entrada de número muito mais fácil.
Conclusão
Quando se trata de usabilidade de celulares e tablets, claramente tenho muito a aprender :) Mas agora que estou mais ciente dos possíveis problemas, estou mais apto a detectar bugs e problemas com nosso design.
Mas, se há uma lição a ser aprendida, sempre vale a pena conversar com os clientes e pedir a opinião deles sobre usabilidade. Afinal, são eles que pagam as contas e é do seu interesse que eles tenham a experiência de compra mais tranquila possível.
Boa sorte com sua loja!