Skip to main content
2 de 4
adicionou 574 caracteres ao conteúdo
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Não é necessário extensões ou plugins, navegadores baseados no Chromium possuem ferramentas avançadas pra simular dispositivos como smartphones e tablets.

Simular navegadores mobile

Navegue até o site de interesse e usando o Google Chrome aperte:

  • Ctrl + F12

Ou no Opera:

  • Ctrl + Shift + I

Irá aparecer as ferramentas de desenvolvedor:

Developer tools

Então clique no icone que parece um celular:

device mode

Ao clicar irá aparecer esta tela e ele irá entrar em modo de seleção e simulação de dispositivos (no meu caso o padrão está Iphone4):

developer tools chrome e opera

Depois clique no combo e troque pro modelo de celular desejado:

developer tools chrome e opera

Observe que existe uma tarja laranja e que o User-agent muda (aonde está escrito UA), esta mensagem diz que alguns sites é necessário recarregar a página:

developer tools chrome e opera

Sendo um site não responsivo será necessário recarragar a página com F5 e dependendo se houver cache use o Ctrl+F5 (que irá ignorar o cache pra aba especifica), veja como ficou o site pt.stackoverflow.com depois do F5:

developer tools chrome e opera

Funções extras das ferramentas de desenvolvedor do Chrome e Opera

  • Simular conexões mais lentas:

    developer tools chrome e opera network

  • o Potrait troca a largura pela altura e vice-versa, ou seja simula a rotação e o ícone com o 2 ao troca o pixel ratio que simula telas com retina.

    inserir a descrição da imagem aqui

Syzoth
  • 100,5mil
  • 23
  • 169
  • 361