você está aqui: Home  → Arquivo de Mensagens

Teste de compatibilidade com dispositivos móveis

Colaboração: Rubens Queiroz de Almeida

Data de Publicação: 09 de junho de 2015

É um fato, o uso de dispositivos móveis para navegar na web vem crescendo assustadoramente, e o acesso convencional, por meio de computadores desktop ou notebooks, vem caindo na mesma razão.

A Dicas-L é um site feito artesanalmente e, é claro, não estava preparado para dispositivos móveis. O que eu fiz, alguns meses atrás, foi direcionar o usuário de dispositivos móveis para uma página mais enxuta, contendo principalmente o texto, e eliminando imagens e outros elementos que não fossem essenciais para a compreensão da mensagem.

Mas mesmo assim, ao rodar o teste de compatibilidade oferecido pelo Google, eu não conseguia uma boa avaliação. O resultado dizia que a letra do texto era muito pequeno e os links eram muito próximos uns dos outros, dificultando a navegação.

Por incrível que pareça, tudo que precisei fazer para passar no teste foi acrescentar a seguinte linha no cabeçalho das páginas:

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

A meta tag viewport orienta o navegador sobre como ajustar as dimensões e escala da página de acordo com a largura do dispositivo, ou seja, o texto é formatado levando em conta o dispositivo em que será exibido. Para saber mais sobre a diretiva viewports, consulte a documentação sobre design responsivo do portal Google Developers.

É claro que muita coisa ainda precisa ser feita para melhorar o visual da Dicas-L, que já está bem velhinho, mas já é um começo, não?

Referências



Veja a relação completa dos artigos de Rubens Queiroz de Almeida

 

 

Opinião dos Leitores

Daniel Chepuck
09 Jun 2015, 09:24
Utilíssima e prática a dica.
*Nome:
Email:
Me notifique sobre novos comentários nessa página
Oculte meu email
*Texto:
 
  Para publicar seu comentário, digite o código contido na imagem acima
 


Powered by Scriptsmill Comments Script