Making It Descubra
Voltar

Como deixar o seu site de comércio pronto para a versão móvel

Baixe nosso manual gratuito e comece um plano de ação para abrir sua empresa

O e-mail informado é inválido.

Obrigado por se cadastrar.

Depois que você abrir uma loja on-line, há alguns fatores adicionais a considerar se você quiser otimizar seu site para clientes do Squarespace Commerce na versão móvel (mcommerce). Dificuldades que podem não ser um problema em um site para desktop, como um processo de finalização de compra mais longo, podem causar frustração para alguém navegando em uma tela menor e fazer com que desista da compra.  

Saiba o que torna um site compatível com dispositivos móveis, como testar os recursos de otimização para versão móvel de seu site, e por que preparar seu site para o Squarespace Commerce na versão móvel é importante para o relacionamento com os clientes e o crescimento das vendas.

O que significa para um site ser compatível com dispositivos móveis?

Otimizar sua loja on-line para o Squarespace Commerce na versão móvel é apenas uma parte de tornar todo o seu site compatível com dispositivos móveis. Existem alguns fatores comuns que influenciam no bom desempenho de um site em aparelho móvel / celular / smartphones.

Design compatível com dispositivos móveis

O design existente de seu site é importante. A maioria das ferramentas de construção de sites, incluindo o Squarespace, inclui algum tipo de otimização para versão móvel, assim você não terá que se preocupar com muito trabalho técnico. Todavia, é útil entender suas opções, especialmente se você quiser criar uma versão exclusivamente móvel de seu site. 

As opções de design mais comuns incluem:

  • Design responsivo: sites com design responsivo se adaptam ao tamanho exato da tela que você está usando. Por exemplo, se você diminuir ou aumentar a janela do seu navegador, as imagens e o texto do site se ajustarão à janela sem comprometer o design do site. Todos os sites do Squarespace tem um design responsivo

  • Design adaptativo: os sites com design adaptativo são similares à opção responsiva. Uma diferença está no fato de o design adaptativo ter um conjunto limitado de tamanhos de exibição, geralmente iguais aos tamanhos comuns de tela. Sites com design adaptativo exibem automaticamente no tamanho que mais se aproxima ao da tela que você está usando.  

  • Site exclusivamente móvel: Um site exclusivamente móvel é uma versão separada e simplificada de seu site para desktop. Um "link no bio site" como um Unfold Bio Site é uma forma de baixo investimento para criar um site exclusivamente móvel onde você pode criar links para produtos e recursos importantes do site, como sua página para contato.

  • App distinto: Um app independente pode apresentar uma versão simplificada, exclusivamente móvel, de seu site para desktop. Normalmente não vale a pena para um pequeno empresário criar um app devido ao tempo e investimento necessários para seu desenvolvimento e lançamento.

Quando se trata de otimizar sua experiência com dispositivos móveis para melhorar sua classificação em resultados de buscas, o mais importante é que seu site esteja otimizado para uso em versões móveis. O método específico utilizado para otimizar seu site não tem demonstrado ser de grande impacto em sua classificação de buscas.

Elementos visuais que se traduzem nos dispositivos

Seu construtor de sites pode se encarregar de exibir suas imagens e texto em um tamanho de tela diferente, mas você está no controle da experiência visual propriamente dita. Ao projetar seu site, escolha fontes e combinações de cores que sejam claras e legíveis para que informações importantes ou links não se percam na tela de um telefone ou de um tablet.

Lembre-se de que uma imagem ou descrição que pareça clara e não toma muito espaço em um laptop ou desktop, pode parecer muito diferente em uma tela menor. Se você estiver vendendo produtos, faça upload de várias fotos para mostrar os detalhes ou características que os tornam exclusivos. As descrições dos produtos devem se adequar à voz da sua marca e incluir detalhes relevantes como dimensões, sem tomar muito tempo. 

Capturas de tela de dispositivos móveis de uma lista de produtos para uma loja on-line de vegetais em conserva e uma tela "editar produto" de um pote de picles, sobre um fundo azul-esverdeado escuro

Carregamento rápido

O tempo que seu site leva para carregar é um fator importante na experiência do cliente. Os clientes esperam que os sites sejam carregados rapidamente e são mais propensos a abandonar uma página lenta. Esse tempo de carregamento lento pode afetar negativamente a impressão de alguém sobre sua marca e sua capacidade de competir nos resultados dos motores de busca.

Os sites do Squarespace são projetados para carregar rapidamente, mas a velocidade de sua página também depende do que você mesmo introduziu nesta. Arquivos grandes ou páginas com conteúdo empacotado podem aumentar o tamanho de uma página e torná-la mais lenta. Você pode aumentar a velocidade de seu site analisando o tamanho de cada página e identificando o que pode estar causando a lentidão no carregamento. Em seguida, remova ou divida seu conteúdo em múltiplas páginas menores.

Se páginas do blog estiverem tornando seu site mais lento, você também pode considerar ativar Páginas Móveis Aceleradas (AMP), que pode criar uma versão mais simples dessas páginas para um carregamento mais rápido no celular. A desvantagem de Páginas Móveis Aceleradas é que a versão de carregamento mais rápido de sua página não incluirá todos os recursos e imagens que a página apresenta em um navegador de desktop.

Navegação simples

Além de facilitar a localização e leitura ao navegar em seu site, o próprio menu deve simplificar a localização do que você precisa. Se seu site tem várias seções ou sua loja tem categorias diferentes, deixe essas categorias claras e facilite a alternância entre elas. Chamadas para ação (CTAs) devem indicar claramente seu propósito (por exemplo, "Adicionar ao carrinho" ou "Cadastrar-se agora") e ser fáceis de entrar ou sair.

A navegação em seu site também deve ser fisicamente simples, ou seja, se alguém estiver segurando o telefone com uma mão, o ideal é que ele possa acessar seu menu e encontrar o que está procurando, tudo isso com um polegar. 

Loja compatível com dispositivos móveis

As otimizações para versão móvel mencionadas acima irão melhorar a experiência com dispositivos móveis de sua loja on-line. Entretanto, lembre-se de abordar também as otimizações específicas para comércio na versão móvel, como o processo de finalização de compra e as opções de pagamento. 

Os clientes devem poder adicionar itens rapidamente ao seu carrinho e passar para a finalização de compra. A partir daí, o processo de finalização de compra deve ser intuitivo e fácil de concluir, mesmo com o espaço limitado na tela. Por exemplo, tente coletar informações de faturamento e envio em etapas mais curtas e graduais, em vez de utilizar um formulário longo. Oferecer várias opções de pagamento, incluindo opções de pagamento expresso onde não há a necessidade de procurar e digitar dados de cartão de crédito para finalizar a compra.

Como testar a otimização para a versão móvel de seu site

À medida que você cria e atualiza seu site, é importante testá-lo periodicamente para garantir que você ainda esteja oferecendo uma boa experiência aos visitantes que o acessam através de dispositivos móveis. 

Há algumas maneiras simples de testar rapidamente seu site:

  • Use uma ferramenta de teste para versões móveis: há várias ferramentas que permitem digitar o link de qualquer site para analisar sua compatibilidade com dispositivos móveis. Uma busca rápida o levará a algumas opções populares, e não custa testar seu site com mais de uma ferramenta.

  • Teste em seu navegador ou construtor de sites: muitas ferramentas de construção de sites oferecem uma opção de prévia da versão móvel, que lhe mostra uma aparência muito próxima de como ficará seu site em um telefone ou tablet. Se seu site tiver um design responsivo ou adaptativo, você também pode reduzir o tamanho de seu navegador para ver a aparência do design em diferentes tamanhos de exibição.

  • Teste-o em um aparelho móvel / celular / smartphone: Coloque-se no lugar do cliente visitando seu próprio site através de um telefone ou tablet, e peça a amigos ou colegas de mercado que façam o mesmo. Observe quaisquer inconvenientes que uma ferramenta de teste possa não detectar, como um prompt de cadastro complexo ou uma chamada para ação (CTA) difícil de ler.

Por que um site de eCommerce na versão móvel é importante 

Com mais navegação na web acontecendo por telefone e tablet e motores de busca mais propensos a classificar sites compatíveis com dispositivos móveis, ter um site otimizado para versão móvel deve ser importante para todos, não apenas para os proprietários de empresas de eCommerce. Mas a subcategoria de comércio na versão móvel de eCommerce cresceu significativamente à medida que a tecnologia melhorou, com clientes gastando trilhões de dólares em compras através de dispositivos móveis a cada ano

Um site que não esteja otimizado para o mcommerce pode perder sua participação nessas compras. Uma loja on-line que tem lentidão no carregamento, que é difícil de navegar ou visualizar e tem um longo processo de finalização de compra em dispositivos móveis, cria bloqueios para os clientes, tornando-os mais propensos a mudar, perdendo a venda e a confiança do cliente.

É relativamente simples projetar uma loja on-line para o comércio na versão móvel. Depois de escolher sua plataforma de eCommerce e fazer upload de seus produtos, decida quais seções de seu site você precisa otimizar para usuários de dispositivos móveis e como você pode melhorá-las.

Artigos relacionados

  1. Descubra

    Como otimizar sua loja on-line para a versão móvel

    Como otimizar sua loja on-line para a versão móvel

  2. Descubra

    Checklist: como criar a versão móvel da sua loja on-line

    Checklist: como criar a versão móvel da sua loja on-line

Assine

Cadastre-se para receber as últimas publicações do blog MAKING IT, além de atualizações, promoções e parcerias do Squarespace.

O e-mail informado é inválido.

Obrigado por se cadastrar.