Páginas Responsivas com OptimizePress - Saiba como Resolver questões Mobile | Optimizepress na Prática
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.
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:
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:
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:
Para alinhar seu texto, escolher tamanho da fonte e demais detalhes, utilize apções do OptimizePress:
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.
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:
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:
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!
Responder 28 de junho de 2017
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?
Para cada site, uma licença diferente.
Tem algum plugin que faça esse trabalho de responsividade para mobile? Não consegui deixar de maneira satisfatória.
Oi Hugo, um plugin específico em conjunto com o Op não sei se existe. Mas o OP lançou uma nova opção na coniguração de cada elemento, perguntando se você deseja que isso apareça nos aparelhos móveis. O que eu recomendo e eu particularmente faço é criar uma página específica para mobile e usar o redirecionamento móvel.