opresponsivo

Páginas Responsivas com OptimizePress – Saiba como Resolver questões Mobile

0 Flares Twitter 0 Facebook 0 Pin It Share 0 Google+ 0 LinkedIn 0 Filament.io 0 Flares ×

O OptimizePress é uma ferramenta fantástica, e disso não há dúvidas, e ele também é responsivo, porém… Ás vezes lidamos com algumas páginas totalmente desalinhadas e deformadas no mobile.

Nesse post quero abordar a questão das páginas totalmente responsivas com OptimizePress, com algumas dicas e soluções para algumas questões, vamos lá?

1ª Dúvida e Dica: Como saber como a página está abrindo nos dispositivos móveis?

Diante de tantos aparelhos móveis, fica difícil ter certeza de como as páginas estão abrindo em cada um, quando temos a mão apenas nosso celular ou o tablet. Para resolver essa primeira questão, existem 2 maneiras:

1º Inspecionar a página e ver como ela se adapta nos diversos aparelhos móveis.
Para isso, basta clicar a tecla F12 do seu teclado, ou com o botão direito do mouse, escolher a opção Inspecionar elemento, e escolher a opção de dispositivos.
Dessa forma você consegue ver como a página fica em qualquer dispositivo.

opresponsivo2

 

2º Fazer o Teste de Compatibilidade do Google Chrome
O Google oferece um teste de compatibilidade, que você pode fazer clicando AQUI, onde ele confere não apenas a questão mobile da página mas mais alguns outros recursos, para realizar o teste, basta colocar a url no local indicado, como no print abaixo:

opresponsivo3

 

2ª Dúvida e Dica: A página não está alinhada, e alguns elementos não estão funcionando, o que fazer?

O OptimizePress possui uma variedade enorme de elementos, e todos eles são responsivos, o que pode acontecer é que na hora que editamos, mexemos em algumas configurações para “deixar a página com uma estética melhor” e nisso podemos interferir sim no funcionamento dos elementos e por consequência isso afetará quando acessado por dispositivos móveis.

Por isso vou falar sobre algumas práticas que devemos nos atentar na hora de editar as páginas:

1º Crie uma página mais simples para o mobile, caso a sua contenha muitos elementos e efeitos.

O menos é mais, e quando falamos de mobile, isso se encaixa ainda melhor. Quanto menos atrativos e elementos que possam pesar e tirar o foco de suas páginas melhor. Por isso criar uma página mais simples para os dispositivos móveis é muito importante para garantir que todos poderão ver seu conteúdo, por que no fim, o que importa é sua oferta, não é mesmo?

Para redirecionar uma página, basta ir até as Configurações de Página, e escolher a opção de redirecionamento mobile:

opresponsivo67png

 

2º Usar os elementos de Texto sem alterar suas configurações
Primeiro precisamos sempre definir o proprósito do texto que estamos usando, se você precisa de uma headline, deve usar o elemento headline e não o bloco de texto.

Uma outra coisa bastante importante, é não mudar as configurações, e usar apenas os recursos que o Op oferece na edição, como mostro abaixo não altere essas configurações:

opresponsivo4

Para alinhar seu texto, escolher tamanho da fonte e demais detalhes, utilize apções do OptimizePress:

opresponsivo5

Atente-se também em relação a códigos que possam existir dentro da sua área de texto, e apague códigos desnecessários.

opresponsivo6

 

3º Observe suas imagens de background

Quando colocamos uma imagem no background, mexemos nas configurações para que ela se alinhe, porém, nos aparelhos móveis, ela pode ficar cortada, desajustada ou simplesmente não abrir.

E fica ainda pior quando você está usando uma imagem escura e as letras claras, se a imagem não abrir, não será possível ler os textos.

Para solucionar essa questão, para suas páginas mobile, utilize sempre essa configuração em suas imagens de background:

opresponsivo8png

Outra coisa importante é sempre colocar uma cor que seja parecida com sua imagem na opção de cor da linha, para que caso a imagem não abra, ainda seja possível ler e entender o conteúdo:

opresponsivo9png

4º Retire códigos de efeitos das páginas

A cada dia que passa vemos mais páginas criativas e inovadoras, sendo necessário inserir códigos para efeitos, no caso da página mobile, é melhor deixá-la o mais natural possível para evitar qualquer dificuldade de navegação.

Eu acredito que essas sejam as maiores causas de páginas desalinhadas nos dispositivos móveis e seguindo essas instruções, sem dúvidas você não terá problemas com a navegabilidade das suas páginas.

Se você gostou desse post, não deixe de deixar seu like e postar seu comentário abaixo!

E se você quer aprender mais, com quem realmente entende do assunto, não deixe de conferir o Curso OptimizePress na Prática!

Grande abraço, Camila

 

0 Flares Twitter 0 Facebook 0 Pin It Share 0 Google+ 0 LinkedIn 0 Filament.io 0 Flares ×

Sobre o autor 

Empreendedora (ou aventureira) online há 4 anos, iniciei com e-commerce, hoje trabalho com Marketing Digital e me apaixonei pelo Optimizepress desde quando comecei a quebrar a cabeça com ele!

About The Author

Camila Schneider

Empreendedora (ou aventureira) online há 4 anos, iniciei com e-commerce, hoje trabalho com Marketing Digital e me apaixonei pelo Optimizepress desde quando comecei a quebrar a cabeça com ele!

2 Comentários

  • Jussara

    Responder Responder 28 de junho de 2017

    Olá Camila!

    Tudo bem?

    Está Ferramenta eu posso comprar e usar em três sites diferentes, dois que estão no meu nome e outro não?

    Ele é um tema que utilizado dentro WordPress?

    • Camila Schneider

      Responder Responder 14 de agosto de 2017

      Oi Jussara, tudo bem?
      Pode usar sim, sem problemas.

      Para cada site, uma licença diferente.

      Grande abraço

Deixe um Comentário

* Indicar Campos Obrigatórios