Recomendações para facilitar o uso do seu site na versão móvel.

Todos os sites do Squarespace são projetados para funcionar bem na versão móvel desde o início. No entanto, adições como arquivos de mídia grandes, conteúdo demais em uma página e espaçamento estreito entre as letras podem causar problemas no carregamento do site e na exibição móvel. Este guia aborda nossas práticas recomendadas para que o seu site funcione bem na versão móvel.

Teste a compatibilidade móvel do seu site

Para ver como o site aparece no celular, acesse-o em um aparelho móvel ou use o recurso prévia por aparelho, que mostra uma prévia de como ele fica em uma tela menor. Nos sites com Editor Intuitivo, você precisa organizar o conteúdo no layout para versão móvel exatamente como ele deve aparecer.

Para também saber como os diferentes recursos aparecem na versão móvel, confira "Como meu site ficará na versão móvel?".

Use o Teste de compatibilidade com a versão móvel para fazer uma rápida avaliação da compatibilidade do seu site com os aparelhos móveis. Se o teste indicar que o site não funciona bem na versão móvel; ou se você tiver problemas ao testar o site em um aparelho móvel, siga as dicas deste guia.

Atenção: o Teste de compatibilidade com a versão móvel feito pelo Google é uma ferramenta externa e está fora do escopo do nosso suporte.

Cada aparelho móvel lida com websites de modo diferente

Celulares mais novos, por exemplo, lidam melhor com sites grandes, e o tempo de carregamento é geralmente mais rápido em uma rede wireless (em comparação à rede de celular).

Na versão móvel, alguns navegadores mostram uma mensagem de erro se o tamanho da página for grande demais. Siga estas dicas para reduzi-la.

Mantenha as páginas com menos de 5 MB

Quando o visitante carrega uma página, o aparelho baixa todo o conteúdo. Os aparelhos móveis usam um hardware simples e dependem da rede de celular para acessar a Internet. Portanto, solicitar grandes quantidades de dados pode sobrecarregá-los. Para evitar problemas, minimize a quantidade de conteúdo em cada página.

Como o tempo de carregamento depende do aparelho e da conexão, não há um limite exato. No entanto, páginas com mais de 5 MB de conteúdo podem demorar para carregar nas conexões de celular; portanto, quanto menor, melhor.

Para verificar o tamanho da página ou obter dicas para reduzir o tamanho da página, acesse Reduzir o tamanho da página para um carregamento mais rápido.

Deixe o espaçamento entre letras em 0 px ou maior

Se o espaçamento entre as letras for menor do que 0 px, elas poderão se sobrepor na versão móvel.

Não confie nos Blocos de Espaçamento

O bloco de espaçamento não aceita o Editor Intuitivo. Recomendamos criar um layout para versão móvel independente do layout para computador.

Os Blocos Espaçadores adicionam espaço vazio a uma página, criando layouts minimalistas ao visualizar um site em um computador. No entanto, no celular, os Blocos Espaçadores geralmente ficam ocultos. Isso pode alterar a aparência do layout do seu site para dispositivos móveis de maneiras que você não pretende. Em vez de recorrer a muitos Blocos Espaçadores, considere alterar o espaçamento para adicionar mais espaço em branco.

Certifique-se de que os estilos móveis estejam ativados (versão 7.0)

Estilos Móveis estão sempre ativados na versão 7.1. Para saber mais, acesse Como meu site ficará na versão móvel?

Na versão móvel do Squarespace, a maioria dos templates mostra o conteúdo em um layout empilhado exclusivo para que o visitante navegue facilmente pelo conteúdo. Com os Estilos móveis desativados, o visitante precisa usar os dois dedos para ampliar e navegar o site.

Para garantir que os estilos móveis estejam ativados:

1. Abra o painel "Design" e clique em Configurações do template.
2. Veja se Desativar estilos móveis está desmarcado.

Essa configuração só aparece nos templates que aceitam a desativação dos Estilos móveis.

Mais dicas de formatação

Para obter mais dicas de formatação para a versão móvel, acesse Como meu site ficará na versão móvel?, onde abordamos como o conteúdo é exibido em telas menores e como otimizar certos tipos de conteúdo para compatibilidade com a versão móvel.