Web sitemin çeşitli tarayıcılarda nasıl göründüğünü nasıl görebilirim?


46

Web sitemin çeşitli tarayıcılarda nasıl göründüğünü nasıl görebilirim?

Aslında her farklı tarayıcı sürümünün yüklü olması dışında, önizleme sağlayabilecek herhangi bir araç veya hizmet var mı?

Yanıtlar:


38

2
Parantez içindeki yorumları beğenirim, iyi cevap.
Larry Smithmier,

32

TarayıcılarShots ve BrowserLabs başımın üstünden düşünebildiğim şey. Sanırım kullandığım başka bir şey daha var ama şu anda adı hatırlayamıyorum.

Düzenleme: Ne yazık ki Adobe, BrowserLab projesini 13 Mart 2013'te kapattı .


1
BrowserShots ile her şeyin seçimini kaldırdığınızdan emin olun, ardından istediğiniz bir kaçını seçin (IE6 gibi). "Dillo" yu kim kullanıyor?
DisgruntledGoat

10

LitmusApp bu alanda yeni bir oyuncu. Onların şu anki büyük katma değeri e-posta istemcisi testidir (mobil dahil 33 müşteri), ancak aynı zamanda 24 tarayıcıya kadar "bulutta" tarayıcı testi de yaparlar. Aslında, tarayıcı testi ilk ürünüdür ve Alkalin aracıyla bağımsız olarak kullanılabilir durumdadır .

Alkalin'i rutin olarak kullanıyorum. Oldukça güzel.

Bu konuda en iyi şey: test etmek istediğiniz tarayıcılardan herhangi birine sahip olmanız veya yüklemeniz gerekmez . Bunların hepsini halleder ve size gerçek bir sistemde çalışan tarayıcının ekran görüntüsünü verir. Kendimi korkunç bir sysadmin insanı olarak, bu idealdir.


evet, onlar bizim arkadaşlarımız - aynı zamanda dipnotta olan doctype.com'u da işletiyorlar ( yakında çarpması muhtemel olsa da)
Jeff Atwood


6

Çok IE test öneriyoruz IETester , mevcut burada . Hafif, hızlı, doğru ve 5.5'ten yukarı tüm IE'leri destekliyor.


1
IETester, sitenizin IE tarayıcılarında nasıl göründüğüne dair iyi bir referans verir. Ancak, IE6'nın renderlenmesinden sonra gerçek IE6 render motorundan farklı olduğu durumlara rastladık.
Rickjaah

5

Tarayıcıların yerel olmasını sağlayın size daha fazla esneklik kazandırır. Test etmek için birkaç düğmeyi tıklamanız gereken etkileşimli bir web siteniz varsa, bunu bir resimle doğrulayamazsınız.


5

MS ayrıca, (İfade araç setinin bir parçası olarak), SuperPreview adında bir ürüne sahiptir; bu, IE’nin tüm sürümlerinde ve Firefox’un tüm sürümlerinde sitenizin etkileşimli bir sürümüyle yan yana veya üst üste çalışmanıza olanak sağlar.

Ayrıca, Mac'in Safari’de sitenizin nasıl göründüğünü gösteren bir web servisine erişim içerir - bu çıktının bir görüntüsünü oluşturur, ancak aynı zamanda işaretlemenin hangi kısımlarının hangi parçaları oluşturduğunu görmenizi sağlayan bir meta veri dosyası kullanır resmin, bu yüzden hala oldukça güçlü.


4

Bu bir Apple bilgisayarda geliştirilmesinin temel nedenlerinden biridir. VMWare Fusion veya diğer emülasyon yazılımlarını kullanarak, tüm ana işletim sistemlerini yasal olarak kurabileceğiniz tek bilgisayardır.

Ardından, gerçek tarayıcıları gerçek işletim sistemlerinde test edebilir, kirli çalışmalarınızı sizin için yapmak için dış kaynaklara dayanmaz ve yerel hata ayıklama araçlarını kullanarak hataları giderir / teşhis edersiniz.


Neden Elma? Ayrıca virtualbox.org'u Linux ya da Windows'ta da kullanabilirsiniz ...
mbrochh

1
Neden Elma? Çünkü Hizmet Şartlarını ihlal etmeden OSX'i Linux ya da Windows'a kuramazsınız.
Dan Gayle

1
Bu bana biraz aptalca geliyor, diyorsunuz ki, bir Apple'da geliştirilmenin ana nedenlerinden biri, OSX'i diğer bilgisayarlarda kullanmanıza izin verilmemesidir.

Meşru bir Hackintosh koşabilseydim, muhtemelen donanım meselelerini bir kenara bırakırdım. Fakat yine de, sadece bir değerlendirme.
Dan Gayle


4

Genel tasarım için bir önizleme kullanmak iyidir, ancak sitenizin davranışını test etmeyi de unutmayın. Bu, özellikle bir resimde göremediğiniz çok fazla vurgulu, ajax veya java-script efekti kullandığınızda kullanışlıdır.

VmWare'i farklı sanal makinelerle, ayrı ayrı yüklenen en önemli tarayıcılarla kullanıyorum.

Windows 7 Ultimate kullanıyorsanız, sizi bir bilgisayardaki farklı IE sürümlerini çalıştırmak için bir çözüm olan Virtual PC ve Xp Mode ile bir öğreticiye yönlendirebilirim .



3

MogoTest , bunu iyi yapan çok yeni bir TechStars başlangıcı. Farklı tarayıcılardan ve işletim sistemlerinden ekran görüntüleri sağlar ve HTML ve CSS'nizi de doğrular.


Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.