Um formulário de checkout de loja online fica entre o cliente e a compra. Sete em cada dez clientes que chegam ao checkout nunca acabam de comprar. Normalmente a culpa é do próprio formulário. Este capítulo explica o que um formulário de checkout realmente precisa, que campos te custam vendas e como desenhar o caminho até ao pagamento para que os clientes cheguem ao fim.
Um formulário de checkout de loja online é onde o cliente conclui uma compra no teu website. Ao contrário dos outros formulários do teu site, o formulário de checkout lida com dinheiro e compromisso. Recolhe moradas de envio, dados de pagamento e detalhes da encomenda. Cada campo a mais, cada etiqueta pouco clara, cada passo inesperado afasta os clientes exatamente quando estavam prontos para comprar.
O abandono de carrinho tem em média 70 por cento nas lojas online. Isto quer dizer que cerca de sete em cada dez clientes põem produtos no carrinho e saem sem pagar. Uma investigação de um instituto de estudos de usabilidade mostra que os custos inesperados, os processos de checkout complicados e a criação de conta obrigatória são os três principais motivos para as pessoas abandonarem no formulário. São todas escolhas de design que controlas.
Que campos precisa mesmo um formulário de checkout?
A primeira regra do design de checkout é pedir apenas a informação que muda a forma como cumpres a encomenda. A morada de envio muda para onde vai. Os dados de pagamento mudam se vai ou não. O endereço de email permite enviar atualizações. Tudo o resto é ruído.
1. Morada de envio
Nome, rua, cidade, estado ou província, código postal e país. Para produtos digitais que não precisam de envio, saltas esta secção por completo. Para bens físicos, mantém estes campos obrigatórios e oferece sempre o preenchimento automático de moradas, em que o cliente começa a escrever e o formulário sugere moradas correspondentes. O preenchimento automático reduz para metade o tempo de escrita e diminui os erros de morada que causam problemas nos envios.
2. Dados de pagamento
Número do cartão, data de validade e código de segurança. Estes campos têm de ser encriptados e tratados por um processador de pagamentos com certificação PCI. Não guardes estes dados no teu próprio servidor. Um checkout moderno deve também oferecer carteiras digitais. As carteiras digitais, como o Google Pay, e os serviços de carteira online permitem aos clientes concluir o checkout com um toque, sem voltar a escrever o número do cartão inteiro. No telemóvel, as carteiras digitais representam mais de 40 por cento das transações. Se o teu formulário não as suportar, perdes vendas para concorrentes que as suportam.
3. Morada de faturação
Pede-a apenas se for diferente da morada de envio. Uma caixa que diz "Morada de faturação igual à de envio" elimina uma secção inteira do formulário para a maioria dos clientes. Se a morada de faturação for diferente, usa outro campo com preenchimento automático. A maioria dos clientes não vai escolher esta opção, porque a maioria das pessoas manda entregar em casa ou no trabalho, onde recebe correio.
4. Email de contacto
É assim que envias confirmações de encomenda, atualizações de envio e informação de localização. Torna-o obrigatório e valida-o. Envia um email de confirmação automático poucos minutos depois da compra, para o cliente saber que a encomenda foi aceite. Não o deixes na dúvida se a transação correu bem.
5. Resumo da encomenda
Mostra ao cliente exatamente o que está a comprar, a quantidade, o preço unitário, o subtotal, o custo de envio, os impostos e o total final. Todos os valores devem estar visíveis antes de ele introduzir os dados de pagamento. Os custos escondidos são o principal motivo para os clientes abandonarem o checkout no último passo. Se os clientes virem o total enquanto preenchem o formulário, podem tomar uma decisão informada e é muito menos provável que desistam quando chegam ao campo de pagamento.
Campos que parecem necessários mas te custam vendas
Estes campos aparecem em muitos formulários de checkout de lojas online, mas não têm nada que lá estar.
Número de telefone
Quase nunca precisas dele no checkout. As transportadoras não o exigem. As atualizações de localização vão para o email. Se houver um problema na entrega, mandas email ao cliente, não ligas. Este único campo reduz as taxas de conclusão em 5 a 10 por cento, porque parece intrusivo precisamente quando alguém está a partilhar os dados de pagamento. Se precisares mesmo do telefone por alguma razão, torna-o opcional e explica porquê num texto de ajuda.
Nome da empresa
Pertence a formulários de checkout B2B, não a lojas online para consumidores. Mesmo em B2B, pede-o apenas se o nome da empresa afetar o cálculo de impostos ou o envio. A maioria das lojas junta este campo e nunca usa os dados. Os clientes veem-no como desnecessário e saltam-no ou abandonam o formulário.
Hora de entrega preferida
Isto pertence a um segundo passo, depois de o checkout estar concluído, e não ao formulário em si. Deixa os clientes concluir primeiro a compra. Depois de pagarem, o teu sistema pode enviar um email automático a perguntar quando querem a entrega. Assim o formulário de checkout fica focado e rápido.
Mensagem de oferta
Nas lojas online que aceitam presentes, oferece isto como extra opcional depois de a encomenda ser feita, não durante o checkout. Alguns clientes vão querer. A maioria vai saltar. Juntá-lo ao formulário de checkout aumenta a extensão do formulário e reduz a conclusão. O pós-compra é o sítio certo.
Subscrição da newsletter
Não peças aos clientes que entrem na tua lista de email enquanto estão concentrados em concluir uma compra. Estão a pensar no pagamento e na entrega, não em marketing. Depois de comprarem, envia um email separado a oferecer-lhes a inscrição na lista. Vais ter taxas de adesão mais altas de pessoas que acabaram de ter uma boa experiência de compra do que de pessoas distraídas a preencher um formulário.
Como estruturar o formulário de checkout para os clientes concluírem
O layout e o fluxo do formulário afetam as taxas de conclusão tanto como o número de campos.
Checkout numa só página para encomendas simples
Se a tua encomenda média tem dois a quatro artigos e o checkout exige três a cinco campos, um formulário numa só página funciona. Os clientes veem o formulário completo de uma vez, preenchem tudo e submetem. Não têm de pensar na progressão. Simplesmente concluem. Funciona especialmente bem para artigos mais baratos e para clientes habituais, que se movem depressa.
Checkout em vários passos para encomendas complexas ou compras de valor elevado
Se os clientes encomendam muitos artigos, se escolhem opções de envio, se têm vários métodos de pagamento entre os quais escolher, divide o checkout em passos. O passo um é a informação de envio. O passo dois são os dados de pagamento. O passo três é a revisão da encomenda. Uma barra de progresso a mostrar "Passo 2 de 3" mantém os clientes a avançar, em vez de se sentirem sobrecarregados por um formulário longo. O checkout em vários passos é especialmente importante no telemóvel, onde um único formulário longo sai do ecrã e parece interminável.
Mostra o resumo da encomenda em todos os passos
Seja qual for a estrutura que escolheres, mantém o resumo da encomenda visível durante todo o checkout. Os clientes devem saber sempre o que estão a comprar e quanto custa. Se o teu formulário usa passos, o resumo aparece em todos os passos ou numa barra lateral fixa. Se o formulário é numa só página, o resumo aparece do lado direito no computador ou acima do formulário no telemóvel. Esta visibilidade tranquiliza os clientes e evita o choque de um custo inesperado, que desencadeia o abandono.
Faz o botão de submissão ser óbvio e de confiança
O texto do botão deve dizer "Concluir compra" ou "Pagar agora", não "Submeter" ou "Continuar". Usa uma cor distinta que se destaque do fundo do formulário. Inclui ao lado um ícone de confiança, se aplicável, como um cadeado SSL, um selo de segurança ou o logótipo do processador de pagamentos. Os clientes precisam de ver que o pagamento vai ser encriptado e tratado com segurança.
Opções de pagamento que reduzem o abandono do checkout
O maior indicador isolado da conclusão do checkout é a disponibilidade de opções de pagamento. Os clientes esperam ter escolha.
Cartões de crédito e débito
É o mínimo. Aceita Visa, Mastercard e American Express. Torna simples introduzir os dados do cartão, com formatação automática dos espaços do número do cartão e deteção automática do tipo de cartão quando começam a escrever.
Carteiras digitais (como o Google Pay)
No telemóvel, oferece as carteiras digitais, como o Google Pay, como primeira opção. Os clientes tocam num botão e o pagamento fica concluído. Estas conversões são 30 a 50 por cento mais altas do que a introdução tradicional do cartão, porque o atrito é muito baixo. Um cliente que tem o Google Pay guardado no telemóvel consegue fazer o checkout em cinco segundos. Não o obrigues a escrever um número de cartão em vez disso.
Carteiras online e outros serviços de pagamento de terceiros
Os serviços de carteira online são de confiança para clientes habituais que já têm conta. Oferecê-los como opção aumenta a conclusão entre os teus clientes que preferem não introduzir os dados do cartão diretamente no teu site. Confiam mais nesse serviço do que em ti para os seus dados de pagamento. Respeita essa preferência e faz a venda.
Serviços de comprar agora, pagar depois
Os clientes mais novos e os clientes que compram artigos mais caros escolhem cada vez mais opções de pagamento em prestações. Oferecer serviços de comprar agora, pagar depois aumenta a conversão, porque alarga o teu mercado a clientes que não conseguem pagar o preço total à cabeça. Tornam-se clientes que não terias sem esta opção.
Métodos de pagamento locais
Se vendes a nível internacional, pesquisa os métodos de pagamento dos teus países de destino. Na Alemanha, os clientes preferem a transferência bancária. No Japão, o pagamento em lojas de conveniência. Na Índia, o UPI e carteiras móveis locais. Oferecer métodos de pagamento locais no mercado de origem deles aumenta muito a conversão. Um cliente que não encontra o método de pagamento que prefere não vai inventar outro. Vai comprar noutro sítio.
Design de checkout para telemóvel que converte
Mais de 60 por cento do tráfego das lojas online vem agora do telemóvel. Se o teu formulário de checkout não funciona num telemóvel, perdes a maioria das vendas.
Layout de uma só coluna no telemóvel
Nunca mostres campos de formulário lado a lado no telemóvel. Empilha tudo numa só coluna. Os clientes precisam de deslizar pelo formulário, não de lado. Isto parece fácil de gerir. Campos lado a lado num ecrã pequeno parecem desarrumados e confusos.
Áreas de toque grandes para botões e campos
Os campos do formulário e os botões devem ter pelo menos 44 por 44 píxeis. Botões mais pequenos são difíceis de tocar sem acertar no alvo errado. Um cliente frustrado por tocar três vezes no botão errado vai abandonar o checkout em vez de continuar a tentar.
Foco automático em cada campo
Quando um campo é obrigatório, o teclado deve abrir automaticamente quando o cliente lá chega. Quando termina um campo, o foco deve passar para o seguinte. Isto elimina o toque manual e acelera o preenchimento do formulário.
Resumo da encomenda fixo no telemóvel
Mantém o total no topo do formulário, para os clientes verem sempre o que estão a pagar. No telemóvel, o resumo da encomenda deve ficar fixo no topo enquanto os clientes deslizam pelos campos. Nunca devem deslizar e perder o preço de vista. Essa incerteza desencadeia o abandono.
Botão de pagamento fixo no telemóvel
O botão "Pagar agora" deve ficar fixo na parte de baixo do ecrã no telemóvel. Os clientes deslizam por todos os campos e o botão está sempre ao alcance de um polegar. Isto mantém o foco em avançar.
Como apresentar os custos para os clientes não abandonarem
A transparência sobre o custo total não é negociável. Os custos escondidos matam conversões.
Mostra os custos de envio antes do checkout
Nas páginas de produto e no carrinho, estima o envio com base na localização do cliente. Diz-lhe mais ou menos quanto vai custar o envio antes de entrar no checkout. Isto evita a surpresa no passo de pagamento que causa o abandono. Se o envio for grátis, diz isso em destaque. O envio grátis é o fator número um que leva os clientes de ver para comprar.
Calcula os impostos com exatidão no checkout
Assim que o cliente introduz a morada no checkout, calcula e mostra o valor dos impostos. Não o obrigues a chegar ao ecrã final para ver o total de impostos. As surpresas matam conversões. Assim que conhece o total, pode decidir se avança.
Mostra logo todas as taxas
Se cobras uma taxa de processamento para certos métodos de pagamento, mostra-a antes de o cliente escolher esse método. Não cobres taxas por cima do total que ele esperava pagar. Os clientes sentem-se enganados e muitos abandonam o carrinho em vez de avançar.
Sem vendas adicionais inesperadas no checkout
Isto é um formulário de checkout, não uma página de vendas. Não ofereças embrulho para presente, garantias ou donativos no passo de pagamento. Os clientes estão concentrados em concluir a transação. As vendas adicionais parecem truques e reduzem a conclusão. Se queres oferecer extras, faz isso na página do carrinho antes de o checkout começar.
Sinais de segurança que criam confiança
Quando os clientes introduzem os dados de pagamento, precisam de se sentir seguros. Os sinais de confiança contam.
Mostra o cadeado SSL
Garante que a tua página de checkout tem um certificado SSL ativo. O cadeado deve aparecer na barra de endereço do navegador e o URL deve mostrar https e não http. Muitos clientes procuram isto. Se faltar, não vão introduzir os dados de pagamento.
Mostra os selos de segurança relevantes para o teu processador de pagamentos
Se usas um processador de pagamentos, mostra o selo dele. Se usas uma carteira online, mostra o logótipo dela. Se usas um processador de pagamentos de terceiros, inclui o selo dele. Os clientes reconhecem estes logótipos e confiam que o pagamento vai ser tratado com segurança por uma empresa que conhecem.
Inclui uma garantia de confiança ou uma promessa de reembolso
Perto do botão de pagamento, inclui uma única frase a tranquilizar os clientes de que a compra está protegida. "O teu pagamento é encriptado e seguro" ou "Com garantia de reembolso de 30 dias." Isto remove a última hesitação que impede alguém de clicar no botão de pagamento.
Erros comuns nos formulários de checkout que matam conversões
Estes erros aparecem em muitas lojas online e custam vendas todos os dias.
Obrigar a criar conta antes do checkout
É a forma mais rápida de perder uma venda. Alguns clientes querem criar conta para compras futuras. A maioria quer comprar uma vez e sair. Torna a criação de conta opcional e oferece o checkout como convidado como caminho predefinido. Podes enviar um email aos clientes depois da compra e convidá-los a criar uma conta. Um cliente que acabou de te comprar tem muito mais probabilidade de criar conta do que um desconhecido obrigado a criá-la antes de comprar.
Exigir mais campos do que o necessário
Algumas lojas exigem número de telefone, nome da empresa e código postal além dos campos habituais. Cada campo obrigatório que não afeta o cumprimento da encomenda reduz as taxas de conclusão. Testa com menos campos obrigatórios. Vais ver mais conclusões e menos abandono de carrinho.
Etiquetas de campo vagas
Não escrevas "Estado/Província/Outro." Escreve o que queres. "Estado ou província." Não escrevas "zona do código postal." Escreve "Código postal ou ZIP." Etiquetas claras eliminam a confusão e mantêm os clientes a avançar.
Não validar os campos enquanto o cliente escreve
Quando um cliente introduz um email com um erro de escrita, o formulário deve assinalá-lo logo, não esperar até ele submeter o formulário todo. Mostra visto verde quando um campo está correto e mensagens de erro quando está errado, em tempo real. Isto evita que os clientes percam tempo a preencher um formulário que não vai ser submetido.
Mensagens de erro fracas
Não mostres "Entrada inválida." Mostra "O endereço de email tem de incluir o símbolo @." Não mostres "Este campo é obrigatório." Mostra "Introduz a tua morada." Mensagens de erro específicas dizem aos clientes exatamente o que está errado e como corrigir. Mensagens vagas frustram os clientes e aumentam o abandono.
Tornar o checkout lento
Testa o teu formulário de checkout numa ligação 3G lenta. Carrega depressa. O cliente consegue preenchê-lo sem grandes demoras. Se o teu formulário carrega imagens, executa scripts pesados ou faz chamadas de API desnecessárias, vai parecer lento. As páginas lentas aumentam o abandono. Otimiza para a velocidade.
Criar formulários de checkout com o WEMASY
O sistema de loja online do WEMASY inclui formulários de checkout pré-construídos e otimizados para conversão. O formulário adapta-se ao telemóvel, suporta vários métodos de pagamento, mostra resumos da encomenda durante todo o checkout e integra-se com o teu inventário e o teu sistema de email. Os clientes podem fazer checkout como convidados, guardar métodos de pagamento para encomendas futuras e receber confirmações automáticas e notificações de envio. O teu checkout fica ativo assim que ligares o teu processador de pagamentos. Vê o que está incluído em cada plano em /pricing.