Como otimizar a minha landing page para dispositivos móveis?
O editor de páginas de destino do GetResponse gera automaticamente uma visualização amigável para dispositivos móveis. Isso garante que sua página de destino seja responsiva em diferentes tamanhos de tela, tanto em layouts verticais quanto horizontais.
Você pode personalizar a visualização para dispositivos móveis usando as seguintes opções:
Ocultar em dispositivos móveis
Este recurso está disponível para todos os elementos em sua página de destino. Use-o para ocultar objetos específicos quando sua página for visualizada em um dispositivo móvel, garantindo uma experiência mais simples e rápida.
Você encontrará essa opção na parte inferior da barra de configurações do objeto.
Ela é especialmente útil para ocultar divisores e espaçadores na visualização para dispositivos móveis.
Nota: Os divisores verticais têm essa opção ativada por padrão.
Dimensionar para largura de tela cheia em dispositivos móveis
Quando ativada, essa opção faz com que sua imagem ou vídeo ocupe toda a largura das telas móveis. Isso ajuda a maximizar o uso do espaço limitado da tela móvel enquanto permite um arranjo alternativo para a versão de desktop.
Nota: Esta opção está disponível apenas para imagens e vídeos.
Otimização da visualização móvel
Você pode definir os tamanhos das fontes e os espaçamentos do seu site para dispositivos móveis. A visualização de desktop não será afetada pelas mudanças.
Para abrir o otimizador, clique no ícone de celular à direita na barra de ferramentas superior e ajuste os valores nos controles deslizantes.
Clique em Restaurar para o padrão para restaurar cada seção para os padrões.
Passos para páginas de destino legadas
Nosso espaço de trabalho para dispositivos móveis no criador de páginas de destino legadas permite que você visualize e modifique a versão móvel de sua página de destino. Ele oferece a capacidade de personalizar a versão móvel de:
- redimensionar e ajustar o texto e imagens
- ocultar e restaurar elementos
- reposicionar elementos
- substituir imagens de fundo
Você pode usar o espaço de trabalho móvel para modificar:
- templates em branco que você usa para construir sua página do zero,
- templates de página prontos que você pode personalizar para atender às suas necessidades de marketing,
- suas páginas de destino existentes que você gostaria de atualizar.
Clique em Visualizar para abrir uma aba separada onde você pode verificar como as alterações que você fez aparecerão nos dispositivos de seus clientes.
Como acessar o espaço de trabalho para dispositivos móveis da página de destino?
Se você está criando uma nova página de destino, basta clicar no ícone do espaço de trabalho para dispositivos móveis para abrir o espaço de trabalho.
Para suas páginas de destino existentes, clique no ícone do espaço de trabalho para dispositivos móveis no criador de páginas de destino. Um módulo pop-up será aberto pedindo para você confirmar se gostaria que convertêssemos a página. Após sua confirmação, o espaço de trabalho para dispositivos móveis será aberto.
Após a conversão da página de destino, sua versão móvel poderá ser visualizada em dispositivos móveis. O ponto de corte para versões móveis no GetResponse é 600 px. Portanto, se sua página de destino aparecer em uma tela de 600 px ou menor, serviremos sua versão móvel.
Nota: Se você não acessar o espaço de trabalho para dispositivos móveis para todas as variantes de sua página de destino e da página de agradecimento antes de salvá-la, pediremos para confirmar se você gostaria que as convertêssemos para versões móveis.
Como posso organizar minha página de destino para dispositivos móveis automaticamente?
Como nosso espaço de trabalho de desktop e espaço de trabalho para dispositivos móveis são versões diferentes do mesmo layout, não é possível editar um manualmente sem afetar o outro. Em vez disso, oferecemos a opção de organizar sua página de destino para dispositivos móveis automaticamente. Para concluir este processo:
- Clique no ícone do espaço de trabalho para dispositivos móveis.2. Click anywhere in the mobile workspace.
- Clique em qualquer lugar no espaço de trabalho para dispositivos móveis.
- Se estiver usando Windows, selecione Control + O no seu teclado. Se estiver usando Mac, selecione Command + O no seu teclado.
- Uma nova janela aparecerá perguntando se você deseja otimizar o layout móvel. Clique em Sim, faça isso para prosseguir.
Sua página de destino será organizada automaticamente para dispositivos móveis.
Nota: Isso reverterá quaisquer alterações feitas no design móvel. Não será possível desfazer essa ação. O histórico de edições não estará disponível.
Como reposicionar elementos no espaço de trabalho para dispositivos móveis?
Arraste e solte os elementos para mover objetos no espaço de trabalho para dispositivos móveis. Observe que algumas alterações no espaço de trabalho para dispositivos móveis podem afetar a versão de desktop:
- Mover elementos para uma seção diferente ou remover um objeto de uma caixa afeta também a versão de desktop da página de destino.
- Mover elementos dentro de uma seção afeta apenas a versão móvel, não altera nada na versão de desktop.
Notificaremos você sempre que isso ocorrer, mostrando um número ao lado do ícone do espaço de trabalho para dispositivos móveis.
O número indica quantas de suas alterações afetam a versão de desktop. (O mesmo acontece para as alterações feitas na versão de desktop que afetam a versão móvel.)
Você pode mover elementos dentro de uma área específica do espaço de trabalho. Não é possível colocar elementos nas extremidades do espaço de trabalho (elas são cobertas por listras diagonais), pois eles podem não ser visíveis imediatamente na área visível dos dispositivos móveis. Seus clientes precisariam rolar para ver objetos colocados lá. Queremos garantir que sua página de destino seja exibida corretamente em telas pequenas, por isso informamos onde não é recomendável colocar objetos.
Como escalar e redimensionar elementos no espaço de trabalho para dispositivos móveis?
Você também pode redimensionar para alterar a largura do quadro de texto. Em seguida, pode escalar um objeto para aumentar ou diminuir o tamanho do texto no espaço de trabalho para dispositivos móveis.
Redimensionar e escalar permite modificar os campos de texto no espaço de trabalho para dispositivos móveis para que eles apareçam na área visível exatamente como você deseja. Aqui está como fazer:
1. Clique no objeto para exibir as alças de redimensionamento.
2. Para redimensionar, clique e arraste as alças de redimensionamento nas laterais para alterar a largura do quadro de texto.
3. Para escalar, clique e arraste as alças de redimensionamento nos cantos para aumentar ou diminuir o texto.
Escalar e redimensionar objetos no espaço de trabalho para dispositivos móveis não causará alterações no espaço de trabalho de desktop.
Posso remover elementos no espaço de trabalho para dispositivos móveis?
Você pode ocultar elementos no espaço de trabalho para dispositivos móveis. Para fazer isso, clique no ícone de visibilidade que aparece após selecionar um elemento.
Para visualizar os elementos ocultos, clique no botão Mostrar ocultos na barra de ferramentas superior. A área de trabalho ficará sombreada e o objeto oculto ficará visível. Você pode agora:
- Restaurar o elemento. Para isso, basta clicar novamente no ícone de visibilidade.
- Manter o elemento oculto. Para isso, clique no botão Ocultar elementos agora visível ao lado do ícone do espaço de trabalho para dispositivos móveis.
Nota: Não é possível adicionar ou excluir elementos no espaço de trabalho para dispositivos móveis. Para isso, você precisa alternar para o espaço de trabalho de desktop.
Posso editar campos de texto e substituir imagens de fundo no espaço de trabalho para dispositivos móveis?
Você pode editar campos de texto e substituir imagens de fundo no espaço de trabalho para dispositivos móveis. Veja como fazer:
- Para elementos de texto, clique duas vezes em um elemento para abrir a barra de ferramentas com as opções de edição. Você pode alterar tamanho do texto, cor e alinhamento.
- Para imagens de fundo, clique duas vezes na imagem para abrir a barra de ferramentas com opções de edição. Clique no ícone da imagem de fundo para substituir a imagem atual ou no ícone x para removê-la.