Google/YouTube

Como testar o seu site em vários dispositivos… sem os ter

17 Comentários

Um dos desafios actuais dos webdesigners é criarem sites altamente responsivos, capazes de se adaptarem a qualquer dispositivo/ecrã.

Como é muito complicado ter todos os equipamentos físicos para testar o trabalho realizado, a Google dá uma ajuda ,através do Google Chrome, oferecendo uma ferramenta para esse efeito.

chrome_06


Se é webdesigner e precisa de testar o seu site em tudo o que é equipamento então basta que tenha o Google Chrome instalado. Para isso basta aceder ao Modo Programador, carregando em F12 no Windows ou Cmd + Opt + I no Mac OS X.

chrome_00

Já dentro do Modo Programador, o utilizador pode escolher o dispositivo no qual que testar o seu site. Na lista podemos encontrar smartphones de todos os tamanhos, tablets e até Notebooks

chrome_01

Ao nível da rede é também possível emular várias tecnologias. GPRS, EDGE, 3G, Wifi, entre outras.

chrome_03

Para quem precisava de uma ferramenta deste tipo e não conhecia esta funcionalidade do Chrome aqui fica uma boa oportunidade para testarem. Lembrem-se que não é preciso instalar qualquer software adicional, a funcionalidade é nativa do Chrome.

PUB
Autor: Pedro Pinto
Partilhar:
Tags:
responsivos sites web

PUB.

Questão Semanal

Deveria haver uma marca obrigatória em todas as imagens geradas por IA?

Ver Resultados

Loading ... Loading …
Arquivo de Questões

PUB.

Velocímetro Pplware

Teste a velocidade da sua Internet
#TileArt: Dê uma vida nova ao ecrã iniciar do Windows Phone
Artigo anterior

#TileArt: Dê uma vida nova ao ecrã iniciar do Windows Phone
Gigante Alibaba lança-se nos dispositivos móveis com a Meizu
Próximo artigo

Gigante Alibaba lança-se nos dispositivos móveis com a Meizu
PUB

Comentários

17

Deixe um comentário

O seu endereço de email não será publicado. Campos obrigatórios marcados com *

  1. Avatar de Joaquim
    Joaquim

    Outra opção também muito útil

    https://developer.chrome.com/devtools/docs/remote-debugging

    Responder
    1. Avatar de ptpedropt
      ptpedropt

      mais importante ainda é funcionar em todos os browsers conhecidos

      http://browsershots.org/https://pplware.sitedev.pt/

      Responder
      1. Avatar de DSpinola
        DSpinola

        Muito bom… mas onde esta’ o Safari?

        Responder
        1. Avatar de ptpedropt
          ptpedropt

          dá para selecionar no inicio em http://browsershots.org

          Responder
      2. Avatar de tekMan
        tekMan

        O BrowserShots não tem qualquer versão do IE, e só 1 versão do Safari.

        Este sim é mais completo: http://www.browserstack.com/screenshots

        Responder
  2. Avatar de Luis Franqueira
    Luis Franqueira

    Ola,
    Sou Software Tester e já necessitei desta ferramenta e ela é sem dúvida muito útil, mas há algumas coisas a nivel de javascript e css que ainda não emula lá muito bem, mas dá para o gasto.
    Mas ainda assim: Excelente POST! Congrats!

    Responder
    1. Avatar de Mega
      Mega

      Experimenta iPhone, Android browser nativo, Safari para Windows e Internet Explorer no Surface. Depois podes rolar para o lado e chorar… :'(

      Responder
  3. Avatar de ChromeUser
    ChromeUser

    Atenção que isto apenas simula o tamanho do ecrã e não o aparelho em si… Mas não deixa de ser útil…

    Responder
  4. Avatar de Eduardo Pires
    Eduardo Pires

    Para mim não há nada melhor que Firefox Developer, traz tudo o que é preciso para desenvolvimento web! Traz também essa funcionalidade…

    Responder
  5. Avatar de Daniel M.
    Daniel M.

    Não sei quem as disponibilizou primeiro, mas eu uso isso no Firefox developer edition desde o dia em que foi lançado. É muito útil.

    Responder
  6. Avatar de Marc Solèr
    Marc Solèr

    Chrome Canary. Case closed

    Responder
  7. Avatar de jedi
    jedi

    no opera Também dá. Ma o primeiro a ter esta opção de raíz foi o firefox. e Já agora quando foi lançado o IE 11, já inclui essa possibilidade. A diferença entre eles é que Opera e Chrome ( webkit foi buscar a ideia a extensões como window Resizer e Responsive Site View) enquanto Firefox e IE 11 vão pela dimensões standards em vez do nomes de dispositivos.

    No firefox basta clickar na website que estiver, rato lado direito inspecionar elemento e clickar num dos incons que estão mais á direita , no penultimo da direita para esquerda ou ir a menu do firefox > Desenvolvedor >Vista de Desenho Imediato.

    no IE 11 basta click f12.

    Por isso, o google chrome não é o unico e nem foi o primeiro a disponibilizar esta funcionalidade. Era importante referir os outros browsers também. 😉

    Responder
  8. Avatar de Modem
    Modem

    No Firefox tb existe, basta pressionar CTRL+Shift+M

    Responder
  9. Avatar de João Dias
    João Dias

    Então e a versão nova do pplware, para quando está o lançamento disso?

    Responder
  10. Avatar de Rui Morais
    Rui Morais

    Bem mais fácil…

    http://www.responsinator.com/?url=PPLWARE.COM

    Responder
  11. Avatar de António
    António

    Alguém me ajuda, quando estou a escrever e escrevo certas palavras aparece-me isto
    profile.php Ferramentas de Programador F12
    DOM Explorer-Consola-Depurador-Rede- Capacidade de Resposta de programador da IUF12
    Como faço para me deixar de aparecer isto? Alguém me sabe dizer o que tenho de fazer? Agradecia que me ajudasse. é que eu não sei trabalhar com esta ferramenta

    Responder
  12. Avatar de Carlos Reis
    Carlos Reis

    Eu uso o Firebug e estou satisfeito

    Responder
Aviso:

Todo e qualquer texto publicado na internet através deste sistema não reflete, necessariamente, a opinião deste site ou do(s) seu(s) autor(es). Os comentários publicados através deste sistema são de exclusiva e integral responsabilidade e autoria dos leitores que dele fizerem uso. A administração deste site reserva-se, desde já, no direito de excluir comentários e textos que julgar ofensivos, difamatórios, caluniosos, preconceituosos ou de alguma forma prejudiciais a terceiros. Textos de caráter promocional ou inseridos no sistema sem a devida identificação do seu autor (nome completo e endereço válido de email) também poderão ser excluídos.