Página inicial de comércio eletrônico: 16 práticas recomendadas

A página inicial geralmente é a página mais visitada de um site de comércio eletrônico.

O papel desta página é construir confiança, fazer vendas e reter clientes.
Criar uma landing page eficaz pode ser uma tarefa difícil. Se você tiver centenas ou milhares de produtos em dezenas de categorias, pode ser difícil configurar uma página de destino que exiba seus produtos com eficiência sem ser muito agressivo.

A tentação muitas vezes é colocar tudo o que você tem, o que leva a uma certa bagunça que faz com que os usuários saiam do site em questão. Por tudo isso, optamos por traduzir um artigo de Takeshi Young para o blog Optimizely, 36 práticas recomendadas de design de página inicial de comércio eletrônico dos especialistas. 
tráfego
Para ajudá-lo a criar uma homepage eficaz, encontre abaixo as recomendações de vários especialistas na área de comércio eletrônico, que compartilham seus melhores conselhos.

Alejandra Meza
Diretor de UX, Stella & Dot

As partes interessadas sempre querem um novo design excelente, mas muitas vezes não entendem por que ou quais são os problemas realmente.

#1 Comece identificando os problemas

Entenda por que seus stakeholders querem mudar o site. Crie metas e suposições claras antes de projetar. É importante que todos concordem sobre quais serão os indicadores de sucesso. Faça uma investigação completa do que está errado com seu site. Trabalhe na conversão, na taxa de rejeição e na obtenção de feedback qualitativo dos usuários. Observe os diferentes segmentos de público para identificar quais são os problemas.

#2 Tenha em mente o que você aprendeu

O primeiro instinto é jogar tudo no lixo, quando muitas vezes foram feitas boas ações. Prioritizar Teste A / B Exemplo: crie XNUMX textos de email > XNUMX pessoas na sua lista, XNUMX receberao XNUMX email e XNUMX receberão outro e veja qual email converteu mais, entrevistas e dados, quais são as melhores maneiras de ver quais partes da sua página estão tendo um bom desempenho.

#3 Obtenha feedback qualitativo e quantitativo

Obtenha feedback qualitativo antes do redesenho e antes de sua Teste A / B Exemplo: crie XNUMX textos de email > XNUMX pessoas na sua lista, XNUMX receberao XNUMX email e XNUMX receberão outro e veja qual email converteu mais. Os testes A/B geralmente não atingem o objetivo desejado, e somente por meio de avaliações qualitativas você descobrirá o porquê. Fazer isso antes do teste potencialmente economiza uma série de testes posteriores.

#4 Teste várias variações

Muitas vezes, seus stakeholders querem testar apenas a nova versão em relação à antiga. O problema é que você não saberá interpretar os resultados do teste. Foi o desenho? Foi o conteúdo? Teste o conteúdo antigo no novo design e o novo conteúdo no design antigo. Testar seções da página também é outra maneira de entender por que um design funciona ou falha.

#5 Tenha uma visão dos próximos passos

Todos nós gostaríamos de uma taxa de sucesso de 100%, mas planeje o que considerar se os resultados não forem os esperados. As partes interessadas ainda podem querer lançar o novo design por causa de todo o trabalho e esforço investidos. Ao invés disso, tente se concentrar em como você pode iterar no design ou como aceitar que o design antigo funciona melhor. Em seu resumo de teste, faça a distinção entre querer seguir em frente e manter um design rudimentar. A perspectiva de conversão para induzir a compra sendo a prioridade.
O lançamento da página inicial é apenas o primeiro passo. Em seguida, é importante manter a página atualizada regularmente com novos conteúdos para manter os usuários interessados ​​o suficiente para fazê-los voltar. Crie espaços onde o conteúdo possa ser atualizado com facilidade, regularidade e rapidez. Use módulos de conteúdo automatizados para destacar artigos novos ou recomendados.
e loja

Teresa Kokot
Arquiteto Sênior, LYONSCG

A página inicial geralmente é a primeira impressão que os usuários terão do seu site. por isso, é importante comunicar a mensagem da sua marca em alto e bom som. Quais são as estratégias para uma landing page de sucesso no e-commerce?

#6 MANTENHA-O SIMPLES 

Mantenha simples! Tradicionalmente, os varejistas usam o site como um local para se comunicar sobre a empresa e seus produtos. No entanto, estudos mostraram que quanto mais mensagens houver na página, mais o usuário terá que processá-las e maior será a carga cognitiva. O resultado final é que todas as mensagens são diluídas e o usuário não é orientado sobre o que fazer a seguir.
Fornecer uma mensagem forte e unificada representa sua marca e usá-la para orientar seus usuários pode ajudá-los a iniciar o processo de compra rapidamente. a Teste A / B Exemplo: crie XNUMX textos de email > XNUMX pessoas na sua lista, XNUMX receberao XNUMX email e XNUMX receberão outro e veja qual email converteu mais pode ajudar a direcionar mensagens que melhoram a conversão.

#7 Facilite a pesquisa

Uma página inicial sem navegação global e nenhuma maneira óbvia de encontrar o que você está procurando? Estudos mostraram que quando os usuários não conseguem encontrar o que estão procurando, eles saem rapidamente do site.
No mínimo, a navegação global deve aparecer na página inicial e em todas as páginas como uma forma de os usuários encontrarem produtos. Mas também é muito importante planejar a apresentação dos produtos mais procurados. Não espere que seus usuários sejam detetives!

#8 Pensar responsivo

Antigamente, os varejistas on-line tinham sites separados para dispositivos móveis e desktop. Cada vez mais, vemos uma evolução dos sites de e-commerce em direção ao responsivo, onde a mesma base de código é usada, e o conteúdo definido de acordo com a mídia.
Há vários benefícios nessa abordagem, incluindo pesquisa aprimorada, atualizações de conteúdo sem perdas em diferentes dispositivose, acima de tudo, uma experiência de usuário consistente. Mas, além disso, o Teste A / B Exemplo: crie XNUMX textos de email > XNUMX pessoas na sua lista, XNUMX receberao XNUMX email e XNUMX receberão outro e veja qual email converteu mais é muito mais fácil de fazer com uma base de código unificada.
compras

Kenny Rosenberg
Designer/Desenvolvedor, Acelerador de Valor de Marca

Os usuários precisam entender instantaneamente o que diferencia sua marca de seus concorrentes no mercado. Por que o consumidor deve escolher comprar de você: Seus preços estão baixos? Você tem um envio mais rápido? Você tem melhor qualidade do produto?

#9 Estabeleça uma proposta de valor clara

A partir do momento em que o usuário chega ao seu site, você precisa perceber instantaneamente o impacto. Um bom exemplo claro de uma proposta de valor está em Indochina.
O primeiro banner que o usuário vê diz "Ternos modernos sob medida feitos com as melhores lãs, bem a tempo do outono", então um botão de ação "Compre agora" está associado a ele e "Economize 50% em uma seleção de trajes de banho para o outono ”.
Portanto, os usuários não apenas estão cientes de que podem ter ternos sob medida de qualidade, mas também sabem que podem obter um bom preço por isso. Isso instantaneamente atrai o usuário um passo mais perto de uma conversão.

#10 Use imagens cativantes que apontam diretamente para coleções de produtos

Por que direcionar o tráfego para as páginas de coleções? É importante não isolar o usuário em um produto específico, dar a ele a oportunidade de explorar vários produtos e navegar livremente em suas coleções sem apertar o botão voltar. Eles precisam chegar nas páginas de suas coleções através de imagens dos modelos ou algum outro tipo de imagem, você precisa tornar a experiência do usuário ainda mais agradável para eles.
Um bom exemplo com relógios de MVMT. Depois de acessar o site, você pode clicar facilmente na sua categoria de produto favorita.

#11 Simplifique sua navegação, adicione uma barra de pesquisa

Ajude os usuários a encontrar o que procuram com o mínimo de esforço. Considere adicionar uma barra de pesquisa e dar ao seu alvo uma abordagem minimalista. É o que você coloca na navegação que fará a diferença. Muitas marcas vão querer colocar muitas coisas na navegação pensando que mais opções são melhores. O inverso é verdadeiro. Quanto mais opções, mais difícil é comprar.
estradas

Rick wilson
Presidente COO, Miva, Inc.

As primeiras impressões são cruciais para uma marca. As escolhas de design que você faz podem determinar se os usuários continuam comprando ou deixam seu site para sempre. Tornar-se consciente de papel importante da página inicial é a chave para a criação de uma loja online próspera.

#12 Afaste seus usuários da página inicial

Isso pode parecer contradizer a frase acima, mas é verdade. Você quer que os usuários façam compras, a menos que você esteja apenas vendendo um produto, essas compras não serão feitas na página inicial.
Sua página inicial deve oferecer uma navegação clara e um fluxo suave para manter o usuário intrigado o suficiente para descobrir mais.

#13 Não oprima o usuário

Todos nós já ouvimos os argumentos sobre se você deve ou não manter todo o conteúdo importante do seu site acima da dobra. Não importa onde você esteja, o fato é que a maior visibilidade de uma página é a parte superior dela.
Isso deve lhe dar mais um motivo para não vincular cada pixel a links, mensagens ou até promoções. Quanto menos você der ao usuário, mais fácil será para ele tomar uma decisão sobre o que fazer a seguir. Simplifique a navegação e as mensagens para limitar a tomada de decisões a categorias mais amplas e deixe a filtragem complexa para suas páginas de subcategoria.

#14 Conheça o seu alvo

Antes de tomar decisões de design, mergulhe em seus dados e saiba mais sobre seus clientesQuais navegadores ou 'dispositivos' eles usam? Quais termos de pesquisa eles usam para encontrar você? Quais produtos ou categorias são os mais populares? Conhecer essas informações ajudará você a exibir o conteúdo mais relevante em sua página inicial.

#15 Ser lembrado

O que torna sua loja online melhor do que qualquer outro concorrente? Se um cliente faz uma compra, o que deve ser feito para incentivá-lo a fazer outra?
A página inicial é o lugar perfeito para mostrar sua vantagem competitiva, sua personalidade ou algo realmente legal e único sobre o seu negócio. Deixe uma impressão duradoura e dê uma alma à sua página inicial! A página inicial é uma poderosa porta de entrada para o seu negócio e pode ser um grande diferencial para suas vendas online, se alavancada corretamente.
contação de histórias

James Spence
Designer líder de Web/UX, Bonanza

Aqui na Bonanza, lançamos recentemente uma reformulação completa da nossa plataforma de e-commerce. Estudamos e praticamos com sucesso um ponto importante que você deve achar útil para seus próprios projetos de redesenho gráfico de página inicial.

#16 Conte uma história

Sua página inicial é uma chance de criar uma boa imagem sobre sua empresa, não apenas sobre o que você está vendendo. Mostre quem você é e por que as pessoas deveriam comprar de você. À medida que os usuários navegam, faça com que eles aprendam mais sobre o que diferencia sua marca das outras.
Se o seu catálogo for rico, equilibre suas páginas com avaliações, depoimentos, coleções exclusivas e conteúdo específico da marca. Use a navegação para destacar o que você oferece de diferente dos seus concorrentes.

LEVAR EM FORA

Mesmo uma página inicial lindamente projetada falhará se não for útil para os usuários que visitam o site. Descubra quem está acessando seu site, o que eles estão procurando e por que eles escolherão você em vez de seus concorrentes. Use esse insight para determinar o que está acontecendo na página e medir o desempenho deles.
Não hesite em compartilhar conosco seus conselhos para criar uma página inicial que não seja apenas bem projetada do ponto de vista ergonômico e gráfico, mas que também ajude a reter usuários ativos. O objetivo é sempre otimizar o processo de conversão.
Convido você também a ler o artigo Boas práticas de e-commerce que o ajudará a identificar quais são os diferentes perfis de usuário.

FONTE

36 práticas recomendadas de design de página inicial de comércio eletrônico dos especialistas, Takeshi Young, @Optimizely

Contextualização e tradução: Kaouthar, UX-Activist @UX-República