6 táticas para ganhar dinheiro para aumentar a taxa de conversão de comércio eletrônico para celular

As estimativas indicam que, em 2018, 50% da receita do comércio eletrônico virá de usuários de celular.

É por isso que é crucial para os proprietários de lojas online se concentrarem em como otimizar as versões móveis de seus sites e como aumentar a taxa de conversão móvel.

Alguns de nossos clientes obtêm até 80% do tráfego do comércio móvel. E não nos referimos àqueles que vendem aplicativos, mas sim bens físicos. Não é à toa que o m-commerce é uma das tendências do comércio eletrônico.

Aqui, reunimos 5 erros principais que você pode corrigir para melhorar a taxa de conversão do seu site para celular de comércio eletrônico durante o processo de otimização de CRO para celular:

1. Página inicial e cabeçalho para celular, que darão as boas-vindas aos seus clientes
2. Menu de hambúrguer móvel de fácil utilização
3. Página de categoria fácil de navegar
4. Página de produto móvel que incentiva os clientes a comprar
5. Confira o estágio - o passo “rei” que vende
6. Botões que seus clientes irão tocar com prazer

Pssst… você está procurando mais conhecimento sobre CRO móvel? Não procure mais, mas clique aqui: O que fazer e o que não fazer no design de carrinho de compras para celular, 9 maneiras simples de melhorar os formulários de check-out do celular para comércio eletrônico, 10 elementos do seu check-out móvel que precisam ser melhorados, como projetar a página de detalhes do melhor produto para celular!

1. Página inicial e cabeçalho para celular, que receberão calorosamente seus clientes

Sua página inicial é o seu cartão de visita. Você tem apenas 7 segundos para atrair a atenção do cliente. Ou até menos. E pela nossa experiência - as páginas iniciais são tão fáceis de estragar. Um dos erros mais comuns que os sites de comércio eletrônico cometem: a página inicial não é amigável, nem visualmente acolhedora. Vamos comparar dois e-shops.

Aqui, o design é, simplesmente dito, antiquado. Você não pode ver qual é a oferta mais quente ou mais recente no momento. O menu de hambúrguer deve ser colocado no canto superior esquerdo. Mas, como você pode ver, não está aí!

Uma página inicial de comércio eletrônico para celular não otimizada em um aparelho celular: é antiquada, não é amigável, não há menu de hambúrguer no canto esquerdo acima.

Quando você pressiona o botão “Ordem”, ele abre em uma nova janela. Não é amigável, nem amigável para sua conexão de internet. Não deve abrir em uma guia adicional.

Exemplo de checkout móvel não otimizado e não amigável: ele abre em uma nova guia, mas deveria abrir para o jogador.

Agora, vamos ver a aparência de uma página inicial otimizada: Zalando.com. O menu de hambúrguer tem uma legenda. Há uma barra de pesquisa visível - o que é essencial para grandes eshops com muitos SKUs.

Página inicial otimizada para celular: os elementos do menu são mostrados, há fácil acesso à pesquisa, o menu hambúrguer é visível e está localizado no canto esquerdo. Este é um ótimo exemplo de como aumentar a taxa de conversão para celular.

Outro exemplo pode ser encontrado em AlexisBittar.com. Observe o ícone de finalização da compra no menu principal: você pode ver claramente quantos itens existem na sacola de compras móvel. E, como bônus, você também pode ver as promoções mais quentes do momento.

No entanto, também existem alguns aspectos que podem ser melhorados: os ícones são muito pequenos - pode ser difícil para mãos maiores tocarem. E deve haver descrições abaixo dos ícones (assim como no Zalando).

Página inicial de e-commerce otimizada para celular com elementos a serem melhorados: você pode ver a sacola de compras, quantos itens existem e o menu principal. Mas o que pode ser melhorado inclui o tamanho dos elementos e os ícones devem ser rotulados.

Quando você toca no ícone “checkout”, há uma camada superior que mostra o que está em sua sacola de compras e quantos itens existem. Você pode facilmente ir para sua sacola de compras ou para o caixa. Aqui está uma dica de otimização de taxa de conversão ainda melhor para celular - há uma tela separada exibida sobre a tela normal (sem recarregar sua página normal) - assim como na Amazon, quando você tenta adicionar um produto à sua lista de desejos.

Sacola de compras otimizada: ao pressionar o ícone, uma camada superior aparece mostrando a sacola de compras.

Outra versão da experiência de compra móvel aprimorada na Amazon.com que pode ser facilmente adaptada à otimização do carrinho de compras: quando você pressiona o link "Adicionar à lista" na página do produto, há uma tela separada pairando sobre a tela normal (sem recarregar a página).

Quer mais informações como essa?

Obtenha dicas semanais de comércio eletrônico, estratégias e conhecimentos líderes do setor.
Entregue direto na sua caixa de entrada.

em Li a política de privacidade e aceito os termos e condições da newsletter.

Selecione esta caixa de seleção para continuar

Uau! Você acabou de se inscrever. Verifique sua caixa de entrada para confirmar a inscrição.

Vamos resumir as melhores e piores práticas para criar uma página inicial e um cabeçalho para celular:

O que fazer:

• Página inicial moderna, acolhedora e fácil de usar
• Ícones que são confortáveis ​​de tocar
• O carrinho de compras se abre em uma camada superior ou tela, pairando sobre a guia normal
• Promoções mais populares e mais recentes sempre no topo da página inicial

Não é:

• Página inicial antiquada e não intuitiva
• Menu e carrinho de compras que são difíceis de encontrar
• Ícones, que não são legendados
• Sem acesso à barra de pesquisa

2. Menu de hambúrguer móvel de fácil utilização

Agora vamos imaginar a seguinte situação: quando você entra em uma loja de calçados online, você nunca procura sapatos, de uma forma geral. Você sempre procura um determinado tipo de sapato: sapatilhas, salto alto, botas de neve etc. Com um cardápio pobre, você não conseguirá encontrar facilmente o que procura. Se você abrir um menu, deverá ser capaz de encontrar facilmente as subcategorias (elas devem abrir imediatamente).

Primeiro, vamos ver um exemplo ruim. O que acontece depois que você toca em “móveis” no menu principal:

Um exemplo de menu difícil de usar - quando você clica em uma das categorias acima, é recarregado e uma nova página em vez de uma visualização rápida da lista de subcategorias disponíveis.

O novo menu abre em uma nova guia em vez de mostrar as subcategorias imediatamente. Não é amigável. Aqui, na parte superior da tela, você tem os tipos de móveis e, abaixo, fotos dos móveis. Você não tem ideia de como os dois se relacionam.

Menu não otimizado: na parte superior da tela estão os nomes dos móveis e as fotos abaixo. O usuário não tem ideia de qual é qual. Esses já são produtos ou o quê?

Agora, vamos dar uma olhada em AlexisBittar.com. Quando você toca em joias, você tem todos os tipos de subcategorias. Você também pode explorar todos os produtos da categoria. Está tudo na mesma guia, é fácil de encontrar. Você sempre pode ver a sacola de compras e o ícone do menu principal também.

Bom exemplo de menu principal em sites de comércio eletrônico: você tem categorias e subcategorias. Tudo fácil de navegar. Ao mesmo tempo, você pode ver o ícone do menu principal e o ícone do carrinho de compras. Isso o ajudará a aumentar a taxa de conversão do comércio eletrônico móvel e a reduzir a taxa de abandono do carrinho de compras.

Vamos resumir as melhores e piores práticas dos menus de hambúrguer para celular:

O que fazer:

• Menu de hambúrguer com legenda
• Ícone grande o suficiente para ser confortável de tocar
• Menu com subcategorias mostrando sem a necessidade de recarregar

Não é:

• Ícones muito pequenos para tocar e sem legendas
• Menu sem subcategorias

Descubra mais exemplos de como construir um excelente menu em dispositivos móveis no episódio de Otimização de comércio eletrônico do tamanho da mordida!

3. Página de categoria fácil de navegar

Quando um cliente entra em uma página de categoria, ele deve sempre ver o seguinte: um menu principal com um carrinho de compras, um cabeçalho informando ao comprador em qual categoria ele está navegando, filtros e produtos.

Vejamos um exemplo pobre primeiro:

Mau exemplo de página de categoria em sites de comércio eletrônico: não há menu principal, não há filtros, as fotos não são descritas ou legendadas. O usuário não vê preço. E não é fácil voltar ao menu principal.

Não há preço, não há informações sobre o produto e você não pode voltar ao menu principal.

Para ver um bom exemplo, veja abaixo em Macys.com: há ícone do menu principal, sacola de compras, a capacidade de visualizar itens em sua sacola de compras, nomes de categorias e filtros que permitem restringir facilmente sua seleção. Lembre-se: nas páginas de categoria, mostre pelo menos dois produtos próximos um do outro ao mesmo tempo. Imagine que você tem 2.738 casacos em sua loja online. Com apenas um produto visível por vez, o cliente teria que deslizar o dedo indefinidamente para ver todos eles.

Exemplo de UX de página de categoria otimizada em um site de comércio eletrônico móvel afetando positivamente seu CRO de comércio eletrônico: você pode encontrar facilmente o menu principal e o carrinho de compras, o cabeçalho informa em qual categoria você está, filtros e produtos. O que também recomendamos é o uso de navegação por gestos - onde você pode deslizar o “Estilo” para a esquerda ou direita para encontrar o produto certo.

Melhores e piores práticas da página de categoria:

O que fazer:

• Mostrando menu principal com link para carrinho de compras, cabeçalho informando em qual categoria você está, filtros e produtos.
• Navegação por gestos
• Exibindo dois ou mais produtos próximos um do outro

Não é:

• Sem menu principal, filtros ou ícone de sacola de compras
• Sem navegação intuitiva por gestos
• Exibindo muitos produtos ou um produto em uma tela
• Mostrar produtos não descritos e sem preço.

4. Página de produto móvel que incentiva os clientes a comprar

Incentivos de compra são seus melhores amigos aqui. Portanto, use-os generosamente. Alguns bons exemplos são:

• se apresse - faltam apenas 3 peças
• 2 dias até o final da venda
• 5 pessoas estão assistindo este produto agora

Na galeria de produtos, é essencial usar movimentos naturais de deslizar com os quais as pessoas estão acostumadas (elas deslizam o Facebook e o Instagram constantemente). Portanto, deixe-os “deslizar” a galeria, em vez de “tocar” nela.

Aqui está um bom exemplo de uma página de produto que pode ser facilmente otimizada. Não há incentivos. Você tem que tocar nas fotos, em vez de deslizar a galeria.

Página do produto 4F.com que pode ser facilmente otimizada: sem incentivos de compra, sem informações sobre a disponibilidade, a galeria deve ser tocada (em vez de furada).

Agora vamos dar uma olhada no melhor exemplo. Você tem o incentivo, você pode facilmente deslizar a galeria, e tem, do ponto de vista do cliente, uma informação muito importante facilmente visualizável: o produto está disponível. Você precisa comunicar isso sempre que possível.

No entanto, ainda há espaço para mais otimização de cro móvel. As cores do apelo à ação (“Adicionar ao saco” e “Esta peça está a esgotar”) infoboxes. Melhoraria a taxa de conversão móvel se os botões e infoboxes estivessem em cores brilhantes e contrastantes.

Página do produto com incentivos de compra e galeria de produtos adequada. No entanto, há peças a serem aprimoradas para aumentar a taxa de conversão em celulares: os botões para “Adicionar à sacola” e “Esta peça está se esgotando” devem estar em cores brilhantes e contrastantes. Mas bom trabalho para implementar urgência na página do produto.

Melhores e piores práticas da página de produtos para celular:

O que fazer:

• Use incentivos de compra
• Mostrar informações sobre a disponibilidade do produto
• Use movimentos de deslizar na galeria de produtos
• CTA's em cores contrastantes

Não é:

• Não encorajar os clientes a comprar por não usar incentivos
• Manter seus clientes no escuro, não dizendo se seu produto está disponível ou não
• Tocar em vez de deslizar na galeria de produtos
• CTA's em cores opacas

5. Verifique o estágio - o passo "rei" que vende

Existem algumas etapas vitais que você deve usar para otimizar seu processo de check-out. Primeiro, certifique-se de que a fase de checkout inspire a confiança de seus clientes. Informe o quanto estão seguros ao comprar em sua loja online. Conquiste a confiança no checkout de comércio eletrônico móvel e use informações sobre checkout seguro, bloqueios e fonte verde.

Exemplo de checkout móvel otimizado da Abercrombie.com: há informações de “checkout seguro”, bem como um método de pagamento conhecido que leva você ao checkout do Paypal. Não se engane sobre os métodos de pagamento locais. Este foi um dos tópicos do Shoptalk durante esses anos.

Certifique-se de que não há nada na página de checkout que possa distrair ou impedir seus clientes de comprar. Não deve haver nenhuma informação adicional sobre outras promoções, nenhum outro produto. Deixe seus clientes se concentrarem em finalizar a compra.

Página de finalização da compra Sephora.com otimizada: sem informações adicionais, que poderiam impedir o seu cliente de comprar, incluída.

Práticas recomendadas de melhoria de checkout no celular:

O que fazer:

• Apresente os sinais de segurança
• Remova todas as informações desnecessárias da fase de checkout

Não é:

• Forneça qualquer informação desnecessária: ícones de mídia social, promoções adicionais, localizador de lojas etc.

6. Botões que seus clientes irão tocar com prazer

Para otimizar seu site de comércio eletrônico móvel, certifique-se de que todos os botões sejam grandes o suficiente para serem tocados facilmente por mãos pequenas, médias e grandes. Os botões devem ser facilmente tocados por usuários destros e canhotos. Veja os exemplos abaixo: os botões têm quase a largura da tela - podem ser tocados facilmente da esquerda e da direita. E visível.

Botões de tamanho adequado no site Nordstrom.com. No entanto, seria melhor se estivessem em cores contrastantes.

Botões móveis - práticas recomendadas:

• Botões grandes o suficiente para serem tocados facilmente
• Botões em cores contrastantes
• Fácil de usar para canhotos e destros

Não importa o que você venda online, lembre-se de que sua receita final é o que mais importa. Leia o estudo de caso da gigante europeia do vestuário Reserved.com para ver como eles aumentaram sua receita sem envolver o departamento de TI ou confira 51 Tendências de comércio eletrônico para 2018 para saber quais caminhos para o crescimento do comércio eletrônico são possíveis em 2018.

Além disso, confira nosso vídeo no YouTube sobre como obter 3 vezes mais receita com dispositivos móveis.

Quer mais dicas para aumentar suas taxas de conversão?

Baixe nossa lista de verificação de otimização de comércio eletrônico de 115 pontos para lojas online de mais de 7 pessoas. Use-o para aprimorar cada parte da sua loja, desde a página inicial até os formulários de checkout.

Ah, e não se preocupe, nós o dividimos em pedaços administráveis!