Como posso ver a aparência do meu site em vários navegadores?

46

Como posso ver a aparência do meu site em vários navegadores?

Além de realmente ter todas as versões diferentes do navegador instaladas, existe alguma ferramenta ou serviço que pode fornecer uma visualização?

Chris W. Rea
fonte

Respostas:

38
vmarquez
fonte
2
Eu gosto dos comentários entre parênteses, boa resposta.
Larry Smithmier 08/07/19
32

BrowsersShots e BrowserLabs são o que eu consigo pensar em cima da minha cabeça. Acho que também usei outra coisa, mas não consigo lembrar o nome agora.

Edit: Infelizmente, a Adobe encerrou seu projeto BrowserLab em 13 de março de 2013.

Rebecca Chernoff
fonte
1
Apenas certifique-se de que, com o BrowserShots, desmarca tudo e apenas selecione os poucos que deseja (como o IE6). Quem diabos está usando "Dillo" ?!
usar o seguinte
10

LitmusApp é um novo jogador em campo. Seu principal valor agregado atual é o teste de clientes de email (33 clientes, incluindo dispositivos móveis), mas eles também realizam testes de navegador "na nuvem" de até 24 navegadores. De fato, o teste do navegador foi o primeiro produto e ainda está disponível de forma independente por meio da ferramenta Alkaline .

Eu uso alcalino rotineiramente. É bem legal.

A melhor coisa é: você não precisa possuir ou instalar nenhum dos navegadores que deseja testar. Eles cuidam de tudo isso e oferecem capturas de tela do navegador em execução em um sistema real isoladamente. Eu mesmo sendo uma pessoa terrível de administrador de sistemas, isso é ideal.

Andres Jaan Tack
fonte
sim, eles são amigos nossos - eles também correm doctype.com que está no rodapé (embora propensos a ter colidido em breve)
Jeff Atwood
6

Isso é muito bom: http://browsershots.org/

Veja como fica em vários navegadores e resoluções. Precisa estar na web.

Damien
fonte
6

Eu recomendo testar o IE no IETester , disponível aqui . É leve, rápido, preciso e suporta todos os IEs a partir de 5,5.

Nat Ryall
fonte
1
O IETester fornece uma boa referência sobre a aparência do seu site nos navegadores IE. No entanto, tivemos ocorrências em que a renderização do IE6 era diferente do mecanismo de renderização real do IE6.
Rickjaah
5

Ter os navegadores locais oferece mais flexibilidade. Se você possui um site interativo em que precisa clicar em vários botões para testar, não é possível verificar isso com uma imagem.

Aaron
fonte
5

A Microsoft também possui (como parte do kit de ferramentas Expression) um produto chamado SuperPreview, que permite trabalhar lado a lado ou sobreposto com uma versão interativa do seu site em todas as versões do IE e da versão mais recente do Firefox.

Também inclui acesso a um serviço da web que mostra a aparência do seu site no Safari em um Mac - isso gera uma imagem da saída, mas também usa um arquivo de metadados que permite ver quais partes da marcação geraram quais partes da imagem, por isso ainda é bastante poderoso.

Zhaph - Ben Duguid
fonte
4

Esse é um dos principais motivos para o desenvolvimento em um computador Apple. Usando o VMWare Fusion ou outros softwares de emulação, é o único computador em que você pode instalar legalmente todos os principais sistemas operacionais.

Em seguida, você pode testar os navegadores reais nos sistemas operacionais reais, sem depender de fontes externas para fazer seu trabalho sujo, onde você pode usar as ferramentas de depuração nativas para corrigir / diagnosticar erros.

Dan Gayle
fonte
Porquê a Apple? Você também pode usar um virtualbox.org no Linux ou Windows ...
mbrochh
1
Porquê a Apple? Porque você não pode instalar o OSX no Linux ou Windows sem violar os Termos de Serviço.
Dan Gayle
1
Isso me parece um pouco tolo, você está dizendo que um dos principais motivos para se desenvolver em uma Apple é que você não pode usar o OSX em outros computadores.
Se eu pudesse legitimamente executar um Hackintosh, provavelmente o faria, deixando de lado os problemas de hardware. Mas, novamente, é apenas uma consideração.
Dan Gayle
4

Usar uma visualização para o design geral é bom, mas não se esqueça de testar também o comportamento do seu site. Isso é especialmente útil se você estiver usando muitos efeitos de foco, ajax ou java-script, que você não pode ver na imagem.

Eu uso o VmWare com diferentes máquinas virtuais com os navegadores mais importantes instalados separadamente.

Se você estiver usando o Windows 7 Ultimate, consulte um tutorial com o Virtual PC e o Xp Mode, que é uma solução para executar diferentes versões do IE em um host .

Sven
fonte
4

Você pode verificar o segmento no StackOverflow chamado: Testando um site em navegadores móveis .

Casebash
fonte
1
Acho que não há problema em duplicar o tópico aqui, porque é de especial interesse para os webmasters.
11138 Jeff Atwood
1
@ Jeff: É por isso que eu usei uma resposta, em vez de marcação como duplicado
Casebash
3

O MogoTest é uma startup TechStars muito recente que faz isso bem. Ele fornece capturas de tela de diferentes navegadores e sistemas operacionais e valida seu HTML e CSS também.

Jay Neely
fonte