Considerações especiais para simplificar o checkout móvel no WooCommerce

Embora os dados nos digam que muitos sites estão vendo mais tráfego móvel do que tráfego de desktop, as conversões em dispositivos móveis ainda estão muito atrasadas. Então, as pessoas estão usando mais seus telefones, mas usam um computador para realmente fazer a compra, o que é um ponto de atrito.

Hoje, veremos algumas coisas que você pode fazer para facilitar a conversão de usuários móveis em clientes pagantes em sua loja WooCommerce. Ao experimentar essas sugestões, lembre-se de testá-las A/B para o seu site. Só porque eles trabalharam para outros não significa que eles terão um impacto positivo no seu processo de checkout específico.

Torne os campos de formulário fáceis

Os dispositivos móveis têm essa grande coisa chamada teclado de software. Isso significa que, se identificarmos com precisão nossos campos de formulário, os usuários de dispositivos móveis receberão um teclado adequado aos dados que precisam ser inseridos.

Como você pode ver acima, o WooCommerce faz isso por padrão quando identifica um campo de email. Para facilitar a inserção do meu e-mail, o símbolo @ é facilmente acessível, em vez de ficar oculto atrás de outro conjunto de chaves.

Outros campos a serem revisados ​​são os campos CEP/Código Postal e Telefone. Se você quiser esses campos em um formato específico, é melhor pré-programar o formato, em vez de deixá-lo para o usuário. Mais de uma vez, meu checkout foi negado porque um dos campos foi formatado incorretamente. Já é irritante ter que alternar entre letras e números em um teclado de telefone. Portanto, não frustre ainda mais seus usuários, forçando-os a inserir os dados desejados em um formato exato.

Seus usuários nunca deveriam ter que lidar com isso. Reserve um tempo para escrever algum JavaScript para formatar o campo como você deseja depois que eles terminarem de digitar ou lidar com a formatação do lado do servidor. Qualquer outra opção está sobrecarregando o usuário, tornando-o menos propenso a comprar.

Formatar bem os erros do campo

Você já clicou em “checkout” depois de percorrer os campos do formulário apenas para ser recebido por uma pilha de erros que o site diz que você cometeu? O WooCommerce é tão culpado por fazer os usuários procurarem problemas com suas informações de checkout, assim como qualquer outra plataforma por aí.

Claro, eles fornecem aquele pequeno * vermelho ao lado dos campos obrigatórios, mas se você perder um, tudo o que você obterá é uma grande caixa vermelha no topo da página. Você está sozinho para procurar o problema com a notificação fornecida.

Existem abordagens melhores para este sistema, sendo o meu favorito validar os campos à medida que você os insere. Não faça o usuário esperar, mostre logo se o campo está certo ou não.

A segunda opção que eu gosto é mostrar os erros de campo diretamente em linha. Isso significa que quando ocorrer um erro, destaque o campo em vermelho e explique qual é o problema na mesma visualização. Se você deseja implementar isso, o Business Bloomer tem um ótimo tutorial sobre como adicionar erros em linha com os campos do WooCommerce. Eu usei isso em alguns sites de clientes e fiquei muito feliz com os resultados.

Não esconda seu checkout com notificações

Embora você possa se safar com algumas táticas de upsell em uma experiência de checkout em desktop, é muito fácil arruinar uma experiência de checkout móvel. Os alvos de toque geralmente são muito pequenos e às vezes até fora da tela quando os pop-ups são exibidos em dispositivos móveis.

Em vez de pop-ups ou outra confusão visual, veja as Ofertas inteligentes para aumentar o valor total do seu pedido. Em vez de pedir a um usuário que adicione algo ao carrinho antes de fazer uma compra, o Smart Offers pede a ele depois de concluir sua ação inicial de checkout.

Verifique a acessibilidade

Existem pesquisas sobre como os usuários interagem com seus telefones, mas ainda não encontrei nada sobre como o gênero afeta a interação com o telefone. Essa é uma lacuna crítica na pesquisa, pois as mulheres, em geral, têm mãos menores que os homens, afetando potencialmente a acessibilidade.

Como os programadores são predominantemente do sexo masculino, isso significa que as pessoas que constroem lojas online não estão testando a acessibilidade de suas interfaces para 50% da população.

Testar como as pessoas interagem com seu formulário de checkout é crucial para garantir que você tenha conversões sólidas. Mas, não caia na armadilha de testar apenas com aqueles que são convenientes. Certifique-se de se esforçar para testar em um amplo espectro de tamanho de mão e tamanho de dispositivo.

Com um cliente, houve um retrocesso em ajustar o checkout para mãos menores porque eles não tinham uma ampla base de clientes do sexo feminino que compravam no celular. Eu os convenci a fazer alguns pequenos ajustes para ajudar a melhorar o processo de checkout para mãos menores e, em algumas semanas, vimos um aumento nas compras de clientes do sexo feminino em seus dispositivos móveis. Nós não víamos clientes do sexo feminino antes, porque o checkout não foi construído com elas em mente.

Velocidade do site

Outra consideração que você precisa levar em conta para o checkout móvel é entender a velocidade do site no contexto de onde está seu mercado-alvo. Enquanto os usuários nas cidades terão velocidades 4G, os usuários rurais podem ter apenas conexões 3G e planos de dados severamente limitados.

Mesmo olhando para os países que você está segmentando pode significar que você precisa pensar em coisas diferentes em termos de velocidade do site. No Canadá, temos velocidades decentes, mas planos de dados anêmicos em comparação com muitos outros lugares do mundo.

Ao desenvolver sua experiência de checkout móvel, certifique-se de testá-la em conexões de internet limitadas. É bastante fácil no Firefox e no Chrome.

Se você estiver testando no Safari, precisará procurar uma ferramenta de terceiros como o Charles Proxy ou instalar a ferramenta Network Link Conditioner para xCode para simular conexões mais lentas. Você pode até usar essa ferramenta em conjunto com seu dispositivo de teste iOS para acelerar a conexão ao vivo enquanto testa seu site em um dispositivo móvel adequado, em vez de um simulado no navegador.

Certifique-se de testar seu site em relação às conexões lentas que seus usuários podem ter, em vez de verificar apenas a conexão que você tem no trabalho.

Marcas de Confiança Visíveis

Uma marca de confiança é uma imagem do seu provedor de SSL ou algum outro ícone que mostra que você tem um provedor de pagamento seguro e confiável. Muitas vezes, eles são relegados ao final de um site para usuários de desktop, mas vale a pena reavaliar onde você os coloca para seu layout móvel.

Para um cliente com quem trabalhei, experimentamos colocá-los bem no topo do caixa. Dessa forma, quando o usuário chegou ao checkout em seu telefone, a primeira coisa que viu foram as pequenas marcas que diziam que tínhamos um site seguro sem malware. Essa pequena mudança produziu um aumento de 1 a 2% nas conversões, o que resulta em vários ganhos extras ao longo do ano.

Aplicativos de preenchimento de senha

Uma das maneiras finais de ajudar a aumentar o número de usuários que concluem seu processo de checkout móvel é garantir que todos os campos de conta de usuário funcionem com ferramentas como 1Password, Dashlane e LastPass.

As senhas já são bastante chatas sentadas na frente de um teclado completo, mas ficam ainda piores quando você impõe senhas seguras que exigem alternar entre os diferentes teclados.

Testar isso é bastante fácil; Pegue uma cópia gratuita de todas as ferramentas acima e coloque sua senha nelas. Em seguida, tente fazer o checkout usando-os para preencher as senhas ou campos de usuário que estão no seu formulário de checkout. Não se esqueça de usar cada um desses aplicativos para criar uma conta no checkout também.

Possivelmente, o pior erro que você pode cometer aqui é bloquear a capacidade de copiar e colar senhas nos campos da sua conta. É assim que os aplicativos de senha funcionam, e qualquer usuário que esteja criando senhas seguras provavelmente sairá quando perceber que não pode adicionar sua boa senha aleatória longa sem digitá-la manualmente.

Construir um bom processo de checkout é crucial para ter um site de comércio eletrônico lucrativo. Com o aumento das compras por celular, é ainda mais importante garantir que você forneça uma experiência de alto nível aos compradores de celular.

Ao seguir as etapas aqui, você pode garantir uma excelente experiência para seus usuários móveis. Eles ficarão felizes e você converterá mais compras, o que o deixa feliz.

Construa uma loja WooCommerce de alto desempenho

Crie uma loja que converte tráfego com as soluções de hospedagem WooCommerce gerenciada da Nexcess. Eles vêm de fábrica com o Jilt para ajudá-lo a recuperar carrinhos abandonados, testes de desempenho sempre que você precisar deles, e a plataforma reduz as cargas de consultas em 95%, levando a uma loja mais rápida.