Duyarlı bir web sitesini nasıl test ederim? Web sitelerini farklı cihazlarda test ederken karşılaşılan zorluklar nelerdir? Bir web sitesini masaüstü monitörde test etmek, cep telefonu gibi elde taşınabilir bir cihazda test etmekten nasıl farklıdır? Duyarlı web sitelerini test etmek için hangi araçları kullanabiliriz? Bizim
Duyarlı Web Tasarımı Nedir?
Duyarlı Web Tasarımı (RWD), en uygun deneyim için web siteleri oluşturmayı amaçlayan bir web tasarımı yaklaşımının tanımıdır - minimum boyutta kolay okuma ve gezinme, çok çeşitli cihazlarda (masaüstü bilgisayar monitörlerinden cep telefonlarına kadar) kaydırma ve kaydırma ...
RWD ile oluşturulmuş bir site, akıcı, orantılı ızgaralar, esnek görüntüler ve CSS3 medya sorgularını kullanarak düzeni aşağıdaki şekillerde görüntüleme ortamına uyarlar:
- Akışkan ızgara konsepti, bir sayfa öğesinin boyutunun piksel veya nokta gibi mutlak birimler yerine yüzdeler gibi göreli birimlerde olmasını gerektirir.
- Esnek görüntüler, kapsayıcı öğenin dışında görüntülenmelerini önlemek için göreli birimlerde de değerlendirilir.
- Medya sorguları, bir sayfanın sitenin görüntülendiği cihazın özelliklerine, çoğunlukla tarayıcının genişliğine bağlı olarak farklı CSS stili kuralları kullanmasına izin verir.
Duyarlı web tasarımını test etmenin zorlukları
Günümüzde pek çok kişi web sitelerine erişmek için cep telefonlarını veya tabletlerini kullanıyor, bu nedenle mobil kullanıcı deneyimi masaüstünden çok farklı olduğu için duyarlı web tasarımını test etmek önemlidir.
Uygun bir web sitesini test etmenin belki de en zor yanı, web sitesinin birden fazla cihazda ve platformda beklendiği gibi çalışmasıdır, ancak aslında piyasadaki tüm mobil cihazlarda test yapmak çoğumuz için pratik değildir.
Duyarlı web tasarımını test etmeye başlayan birçok test uzmanı, genellikle tarayıcı penceresini görüntü alanının boyutuna uyacak şekilde yeniden boyutlandırarak başlar. cep telefonu, tablet ve masaüstü. Bu yöntem genellikle bir web sitesini farklı görüntüleme bağlantı noktalarında hızlı bir şekilde görsel olarak incelemek için uygundur ve tarayıcı penceresini küçültürken veya büyüttüğümüzde altta yatan görüntüleme sorunlarını belirlememize yardımcı olur.
Ancak gerçek mobil cihazlarda test yapmak tamamen farklı bir deneyimdir.
Öykünücüleri kullanma
Mobil emülatör web sitelerinin ve uygulamaların mobil ortamda nasıl görüntüleneceğini ve çalışacağını gösteren bir web simülasyonudur.
Emülatörler size tam olarak ihtiyaç duyacağınız test araçlarını sağlamayabilir, ancak yine de bir web sitesinin işlevselliğini yüksek düzeyde test etmek için uygun maliyetli bir çözümdür.
Google Geliştirme Araçları
DevTools'da Google Chrome Uyarlanabilir projeleri test etmek ve hata ayıklamak için kullanışlı araçlarla yüklenen cihaz modu adı verilen bir özellik vardır.
Ekranınızı basitçe yeniden boyutlandıran diğer çoğu duyarlı tasarım test aracının aksine, bu araç aslında mobil cihaz davranışını, özellikle dokunma ve kaydırma gibi dokunma etkileşimlerini doğrudan web tarayıcınızda taklit eder.
Duyarlı web tasarımını test etmek için bazı genel kurallar:
- Metin, kontroller ve resimler doğru hizalanmış
- Uygun tıklama bölgesi
- Renk, gölgeleme ve gradyan eşleşmesi
- Kenarların doğru doldurulup doldurulmadığını kontrol edin
- Metin, resimler, kontroller ve kenarlıklar ekranın kenarlarına sığmıyor
- Yazı tipi boyutu, stili ve rengi her metin türü için uygundur
- Kayan metin (veri girişi) doğru görüntüleniyor
Modüller küçüldükçe ve tarayıcı penceresi genişledikçe veya mobil cihazınızı döndürdüğünüzde modüllerin konumunu kontrol edin. Geçiş yapılırken çeşitli modüller kaybolabilir. masaüstü bilgisayar mobil için, ancak hangi modüllerin hangi görünüm alanında görünmesi gerektiğini tam olarak bildiğinizden emin olun.
Nihayet
Web uygulamanızın nasıl kullanıldığını öğrenin. Araçtan zengin bilgi alabilirsiniz Google analitiği müşterilerinizin web sitenize erişmek için hangi cihazları kullandığını görmek için. Temel doğrulama ve üst düzey işlevsel testler gerçekleştirmek için otomatik araçları ve öykünücüleri kullanın ve bunu gerçek manuel cihaz testiyle birleştirin.
Yazardan:"Bu tarayıcıyı yeniden boyutlandırmayı bırakın, yakında silinecek!" Bunu ne sıklıkla duyuyorsun? Pekala, tamam, belki çok sık değil, ancak duyarlı web siteleri geliştiriyorsanız, neden bahsettiğimi bilirsiniz: DOM veya CSS'yi her düzenlediğinizde, tarayıcı kenarını ileri geri sürüklersiniz, değişiklikleri test eder ve yanlışlıklar ararsınız. .
Genel olarak, bu çabanın çoğu, farklı cihazların ekran boyutlarını taklit etme girişimidir.
Kurumsal geliştirme yapıyorsanız, muhtemelen test etmek için şirket tarafından sağlanan çeşitli cihazlarınız vardır. Çalıştığım yerde iPad'lerimiz, iPhone'larımız, bir veya iki tabletimiz, dizüstü bilgisayarlarımız ve masaüstü bilgisayarlarımız var. Bu lükse sahip değilseniz, elinizdekileri kullanmak zorundasınız.
Evde iki farklı dizüstü bilgisayarım var, iki farklı Android cihazlar: Kindle ve Nexus 7. Serbest çalışma geliştirmemi test etmek için bu cihazları kullanıyorum, ancak bunun kapsamlı bir seçim olmadığı açık. Hiç iOS cihazı yok ve erken benimseyen biri olarak görülmeme rağmen, her yeni telefonu / tableti / tableti satışa çıkar çıkmaz satın almayı planlamıyorum.
Peki bir geliştirici ne yapmalı? Neyse ki, birçok cihazın ekran boyutlarını taklit eden tarayıcı tabanlı araçların sayısı giderek artıyor. Elbette farklı araçlar, farklı özellikler ve farklı performans seviyeleri ile birlikte gelir. Bunlardan bazılarını burada ele alacağız.
Test amacıyla, oluşturduğum ilk gerçek yanıt veren site olan PajamasOnYourFeet.com'u aldım. EGrappler'daki geliştirici topluluğuna çok nazik ve ücretsiz olarak sağlanan Brownie HTML5 şablonunu temel alır.
Duyarlı mıyım?
Duyarlı mıyım? - tamamen hafif, sitenizin dört farklı cihazda nasıl görüntüleneceği açısından anında görüntülenmesi. Dördü de iOS'tan geliyor ve sitedeki geliştirici seçimini açıklıyor. Herhangi bir kontrol veya seçenek sunmuyor, sadece çok basit ve zarif bir ekran. Görüntü alanı boyutları:
Masaüstü - 1600 x 992 piksel, azalan ölçekte (0,3181)
Dizüstü bilgisayar - 1280 x 802 piksel azalan ölçekte (0,277)
Tablet - 768 x 1024 piksel ölçekte azalan (0,219)
Mobil - 320 x 480 piksel, azalan ölçekte (0,219)
Geliştiriciden alıntı yaparak: “Bu bir test aracı değil, gerçek cihazlarda yapmak çok önemli. Ancak, hızlı ekran görüntüleri (benim için) almak ve müşterilerle toplantılarda ne demek istediğinizi 'açıklamak' için görsel bir fırsat sağlamak için bir araçtır."
cihaza duyarlı
deviceponsive, Duyarlı mıyım? çünkü sitenizi basit ve düzgün bir şekilde görüntüler, söz konusu cihazlar olduğunda hiçbir kontrol veya seçenek yoktur. Hepsi aynı anda uzun bir sayfada gösterilir. İlginç bir özelliği var - başlığı düzenleyerek değiştirebilirsiniz arka plan rengi ve kendi logonuzu ekleme ve ardından "ekran". Bu şekilde, müşteriye ekran görüntülerini gösterirken bir anlamda sitenizi markalaştırabilirsiniz. Bu sitede simüle edilen cihazlar ve ekran boyutları:
Macbook - 1280 x 800
iPad (portre) - 768 x 1024
iPad (yatay) - 1024 x 768
Kindle (portre) - 600 x 1024
Kindle (manzara) - 1024 x 600
iPhone (portre) - 320 x 480
iPhone (yatay) - 480 x 320
Galaksi (portre) - 240 x 320
Gökada (manzara) - 320 x 240
Çoğu benzer araçta olduğu gibi, kaydırma çubukları küçük cihazlarda görüntülenir. Gerçek bir cihazda gösterilmeyecekler, ancak dokunmatik olmayan bir cihazda test görünümünü kaydırabilmek için bazı tavizler vermeniz gerekiyor.
duyarlı test
Cihaza yanıt veren gibi, duyarlı bir test sitenizi birden çok cihazda oluşturur, ancak hepsini tek bir sayfada göstermek yerine, sayfanın üst kısmındaki basit bir menüden hangi cihazı izleyeceğinizi seçersiniz. Bu siteye orta boy bir dizüstü bilgisayarda göz atarken, sayfa küçültmenin harika çalıştığını ve tüm siteyi test edilen cihazın penceresinden görmenizi sağladığını gördüm.
Burada, büyük bir masaüstü bilgisayar monitöründen Crappy Android denilene kadar on üç farklı görüntü noktası sunulmaktadır (dürüst olmak gerekirse, " Android daha iyi"(Daha Güzel Android).
Bir kez daha, Firefox bu sitede biraz tökezledi. Ekran görüntüsünde dikkat edin - yeşil başlık ve beyaz arka plan içerik alanı arasında - görüntü kaydırıcısının görünmesi gereken yerde yalnızca mavi bir çubuk var.
responsive.is
Önceki ikisine çok benzer ve responsive.is'i onlardan ayıran tek şey, ekranın bir cihazdan diğerine düzgün animasyonunun yanı sıra sitenin "gayrimenkulünü" gösteren yarı saydam bir kaplamadır. görüş alanından düşüyor.
Burada mevcut olan tek cihaz seçeneği, tarayıcı pencerenizi dolduran ve siteyi ziyaret ettiğinizde göreceğiniz gibi gösteren otomatiktir: Masaüstü; Tablet (yatay yönlendirme); Tablet (portre yönlendirme); Akıllı telefon (manzara) ve Akıllı Telefon (portre), piksel boyutları belirtilmemiştir.
ekran sorguları
Yine, birkaç farklı özellik ve seçenek, Screenqueries'i diğer sitelerden ayırır. Dikey ve yatay modlar arasında geçiş yapmak için ayrı bir öğeye sahip 14 telefon ve 12 tablet cihaz. Test ekranının sağında aşağıda gösterilen boyutlarla birlikte numaralı bir piksel ızgarası üzerinde görüntülenirler. Ekranın kenarları sürüklenebilir olduğundan özel boyutlar test edilebilir. Test alanını kaydırın veya tıklayın; arka plan daha az karmaşık bir görünümle griye dönecektir.
Bu sitenin ilginç bir özelliği - birkaç cihaz için, sitenizi bu cihaz için öngörülen krom tarayıcıya sarılmış olarak gösteren bir "Doğru görünüm" ("Gerçek görünüm") seçeneği vardır. Ne yazık ki, artık buna alıştım, Firefox test sitesinin görüntüsü için kaydırıcıyı görüntüleyemiyor. Yemin etmeyin, tarayıcılardan Firefox'u gerçekten tercih ederim ama neyse ki seçeneklerimiz var.
ekran sineği
Screenfly, kullanılabilirlik faktörünü gerçekten artırıyor. 10 inçlik bir dizüstü bilgisayardan 24 inçlik bir masaüstüne kadar dokuz cihaza daha fazla tablet, beş tablet, dokuz akıllı telefon, üç TV boyutu ve özel bir ekran boyutu seçeneği sunar. Seçtiğiniz herhangi bir seçenek, menüdeki ayrı bir kontrol kullanılarak dikey veya yatay olarak döndürülebilir. Kaydırmaya izin verip vermemeyi seçebilir ve tek bir düğme tıklamasıyla paylaşılan bir bağlantı oluşturabilirsiniz.
Site, piksel boyutları hakkında bilgi sunma biçiminde proaktif olarak yardımcı olur. Menüdeki her cihaz bir ad ve piksel boyutlarıyla gösterilir, kendi tarayıcı pencerenizin boyutu pencerenin sağ üst köşesine yakın olarak gösterilir ve seçilen seçeneğin boyutu ekranın altındaki altbilgide gösterilir. test edilen sitenin URL'si. Bu küçük özellik, ekran görüntülerini belgelemeyi ve istemcilerle bilgi paylaşmayı kolaylaştırır.
Yukarıdakilerin tümü onu zaten mükemmel bir araç haline getirebilirdi, ancak Screenfly geliştiricileri onu sadece birinci sınıf yapma fırsatı buldu ve proxy özelliğini sağladı. Web sitelerinden alıntı: “Screenfly, web sitelerine göz atarken cihazları simüle etmek için bir proxy sunucusu kullanabilir. Proxy sunucusu, seçtiğiniz cihazların kullanıcı aracısı dizesini simüle eder, ancak bu cihazların davranışını simüle etmez." Burada açıklanan diğer tüm araçlar yalnızca CSS ile ilgilidir. Screenfly, kullanıcı aracısı dizesine dayalı teste izin veren tek kişidir.
Bu şekilde test ederek mevcut sitelerle oluşturduğum bir site mobil versiyon Sonuçların çok iyi olduğunu söyleyebilirim. Her şey tam olarak beklediğim gibi görüntülendi ve işlevler test edilebilirdi. Söylemeliyim ki, kullanıcı aracısı dizelerini test etmek geleneksel hale geldi, ancak bu site uzun zaman önce yapıldı ve proxy sunucu özelliğinin gerçekten çok olduğu ortaya çıktı. faydalı ekleme ona.
Çözüm
Böylece duyarlı siteleri test etmek için yeterli kaynak olduğunu görebilirsiniz. Eşsiz özelliklerde farklılık gösterirler; Hangi siteleri kullanacağınız kişisel tercihlerinize ve gereksinimlerinize bağlı olacaktır ve sizi bu siteler üzerinde araştırma yapmaya ve denemeler yapmaya zorlamaya çalışıyorum. Biz geliştiriciler ne kadar çok kullanışlı araçlar, çok daha iyi.
Çevrimiçi mağazanın mobil cihazlar için optimize edilmesi gerekir. Bu görev, siteyi herhangi bir platformda doğru bir şekilde görüntülemenizi sağlayan duyarlı tasarım yardımıyla çözülür. Bununla birlikte, duyarlı tasarımın uygulanması, ortak bir dizi tuzakla karşı karşıya kalır. İşte online alışveriş sitelerinde en sık karşılaşılan 8 sorun.
Ziyaretçi davranışı analitiğinin dikkate alınmaması
Mobil segmente girme telaşı, perakendecileri ziyaretçi davranışları üzerinde ciddi analizler yapmadan bir web sitesi tasarlamaya zorluyor. Ziyaretçilerin davranışlarını analiz etmek, en popüler mobil cihazları belirlemenize ve siteyi ilk etapta onlar için optimize etmenize olanak tanıyan en önemli hazırlık aşamasıdır. Analytics, örneğin ürün resmini büyütme gibi en "popüler" kullanıcı eylemini belirlemeye yardımcı olur; mobil ziyaretçilerin dönüşüm oranını vb. gösterir. Bu veriler, kullanıcı davranışı tercihleri hakkında bilgi sağlar ve bir mobil kitlenin beklentilerini karşılamaya yardımcı olur. Mobil trafiğin analizi, siteyi alıcıların ihtiyaçları için sonlandırıp optimize ederek, sonuçları sistematik ve tutarlı bir şekilde uygulamalıdır.
Bir masaüstü mağazası tasarlama
Genellikle, çevrimiçi mağazanın masaüstü sürümü, daha mantıklı olmasına rağmen, mobil ekranlar için yeniden tasarlanacaktır. küçük ekran mobil cihaz ve ardından masaüstüne ölçeklendi. Perakendeciler genellikle bir masaüstü sitesini akıllı telefon boyutuna getirmenin teknik zorluklarından habersizdir. 
Mobil ekranlar için tasarım yapmaya başladığınızda, mobil kullanıcıların tüketici deneyimine odaklanırsınız. Sonuç olarak, her iki kanal için de tasarım yapmanız daha kolay olacaktır: masaüstü ve mobil.
Duyarlı tasarımı test etme
Bir çevrimiçi mağazanın mobil düzenini test etmek, başlatmanın zorunlu bir aşamasıdır, ancak birçok sahip genellikle bunu ihmal eder ve test etmeden başlatır. Sonuç olarak, sitenin mobil cihazlar için operasyonel versiyonunda, satın alma ve sipariş verme sürecinde bile hatalar görünebilir.
Duyarlı tasarımın dezavantajları, çevrimiçi mağazanın ön testleri ile kolayca belirlenebilir, ancak birçok satıcının bunun için kaynakları yoktur. Para kaybetme riskini azaltmak için, ana tarayıcılarda (Chrome, IE, Firefox, Safari ve) site üzerinden temel kullanıcı rotalarını test edin. işletim sistemleri- Popüler mobil cihazlarda Windows, Mac OS, Android, IOS. Her değişiklik yaptığınızda test edin, BrowserStack veya Viewport Resizer gibi hizmetler test süresini saatlere indirmeye yardımcı olabilir.
Mobil ekranlar için küçük öğeler
Akıllı telefon ekranına daha fazlasını sığdırmak için çevrimiçi mağaza sahipleri, harekete geçirici mesaj düğmelerinin boyutundan tasarruf ediyor. Kullanıcıları Satın Al düğmesini yakınlaştırmaya veya küçük öğeleri birbirine çok yakın yerleştirmeye zorlamayın, aksi takdirde kullanıcılarınız daha kullanıcı dostu bir siteye gitmeyi tercih eder. Büyük gezinme öğelerine ve harekete geçirici mesaj düğmesi boyutlarına sahip arayüzler tasarlayın.
Yavaş sayfa yükleme hızı
Mobil kitle, hızlı web sitelerini ve hızlı yükleme sürelerini sever. bileşenlerini değerlendirin mobil sayfalar- resimler, düğmeler, metinler, komut dosyaları - mobil cihazlar için optimize edilmelidir. Google, sayfa yükleme süresini SERP'lerine alır ve mobil siteleri etiketler ve "hafif" sitelerin ek bir önemli avantajı olması için bunları en üstte önceliklendirir.
İçeriği farklı sekmelere ayırın; örneğin, bir ürün sayfası yalnızca temel resim, açıklama, fiyat ve Satın Al düğmesi içerebilir. Müşteri incelemeleri ve videolar ayrı bir sekmeye yerleştirilebilir ve sayfanın ana bölümünün "ağırlığını" azaltabilir. İçeriğe ek olarak, yükleme hızını etkileyen diğer öğeleri optimize edin - CSS dosyaları, resimler ve komut dosyaları, yalnızca gerekli verileri gönderin. Kaynak dosyalarının boyutunu ve indirme sürelerini azaltan araçlar bu konuda size yardımcı olacaktır: Uglify veya JSCompress.
Mobil kullanıcılar için içeriği kesme
Çoğu zaman, geliştiriciler, mobil cihazlarda indirme işleminin daha hızlı olması için içeriğin bir kısmını gizler. Ancak, genellikle sayfa boyutu gerçekte küçülmez ve içerik kullanıcıya gösterilmez. Mağazanız, mobil ziyaretçiler için sayfa ağırlığını ve yükleme sürelerini azaltmak için dinamik olarak bir sayfa oluşturabilmelidir. Ayrıca, mobil kullanıcılara daha az içerik vermek kötüdür ve tüketici deneyimini olumsuz etkiler. Tipik olarak, satın alma sürecinde kullanırlar farklı cihazlar, bu, çevrimiçi alışveriş yapanların yaklaşık %90'ı tarafından yapılır. Bunları duyarlı tasarımla sınırlamak büyük bir hatadır.
Yalnızca bir çözünürlükte görüntüler için destek
Duyarlı tasarıma sahip iyi bir web sitesi, cihazın türüne bağlı olarak görüntülerin çözünürlüğünü otomatik olarak değiştirir, ağır görüntüler yükleme süresini artırır. Görüntüleri sığdırmak için otomatik olarak yeniden boyutlandırmanın birkaç yolu vardır. belirli cihaz... "Akışkan" görüntüler (akışkan görüntüler) - bir görüntüyü içeren öğenin veya HTML5 öğesinin genişliğine göre küçültmenize ve genişletmenize olanak tanıyan CSS tabanlı bir teknik
"Yanıt vermeyen" e-postalar
Sitenin kendisi iyi durumda, duyarlı tasarım masaüstlerinde ve mobil cihazlarda iyi çalışıyor. Ancak e-postalar yanıt vermiyor ve mobil kullanıcılar, bir alışveriş listesine ulaşmak için sipariş parametrelerini kontrol etmek veya sonsuz bir önerilen öğeler listesinde gezinmek için mücadele etmek zorunda. 
E-postalar, müşteri iletişiminin kilit noktasıdır, duyarlı e-posta tasarımını mobil stratejinize dahil edin. E-postalarınızı ve haber bültenlerinizi tasarlayın ve test edin, e-posta şablonları "hafif" olmalı ve yalnızca önemli bilgileri içermelidir.
Sayfa düzenini büyük ölçüde kolaylaştıran ve hızlandıran veya gibi çerçeveler.
bir web sayfasının tüm cihazlarda ve monitör uzantılarında mükemmel görüntülenmesi anlamına gelir. Muhtemelen, her yerleşim tasarımcısı, olası tüm görüntü uzantılarına sahip eksiksiz bir cihaz setine sahip değildir. düzeninizi test etme... Bu şaşırtıcı değil çünkü teknoloji bugünlerde ucuz değil.
Yani. Dağlarca cep telefonu ve tablet satın almak bir seçenek değil - batacağız. Ne yapalım? Bu görevler için geliştirildi duyarlı siteleri test etmek için hizmetler... Çalışma prensipleri çok basittir. Çoğu zaman, sayfanın açıldığı yerde belirli bir boyutta bir çerçeve vardır. Efekt, üzerinde görüntülendiği zamankiyle yaklaşık olarak aynıdır. mobil cihaz... Hizmetin bir telefonda veya tablette sayfanın görüntüsünü her zaman doğru bir şekilde göstermediğini belirtmek isterim. Kodlama yaparken servisleri kullanarak test etmelisiniz, ancak tamamlandıktan sonra mümkünse en yaygın cihazlarda test edin.
Yani. Dikkatinize duyarlı web sitelerini test etmek için en iyi araçlar.
Adobe'nin duyarlı sitelerini test etmek için bir araç. Kullanmak için bilgisayarınıza yüklemeniz gerekir.
Program, cihazlarınızı WIFI üzerinden senkronize etmenize ve siteyi cihazınızda görüntüleneceği şekilde görüntülemenize olanak tanır. Açık şu an aşağıdaki işletim sistemine sahip cihazlar desteklenir: iOS, Android, Kindle Fire.
Merhaba sevgili blog okuyucuları. Duyarlı tasarımın Rus İnternetinde giderek daha popüler hale gelmesi şaşırtıcı değil. Ve elbette, mizanpaj tasarımcılarının bunu incelemesi gerekiyor. Duyarlı tasarım yakında neredeyse tüm sitelerde olacağından, giderek daha fazla insan mobil cihazları kullanıyor.
Ve şunu söylemek istiyorum ki, bu tür cihazlarda okumak için siteler onsuzdan çok daha uygun.
Bugün size, siteyi uyarlanabilirlik açısından kontrol edebileceğiniz 5 çok kullanışlı ve harika hizmet sunmak istiyorum.
Hadi gidelim.
Uyarlanabilirlik için siteyi kontrol edebileceğiniz 5 hizmet.
www.responsivedesigntest.net
Siteleri kontrol etmek için iyi bir hizmet. Hem tabletler hem de telefonlar için birçok ekran çözünürlüğü vardır.
mattkersley.com
Matt Kersley'den basit bir web sitesi denetleyicisi. Mobil cihazların tüm popüler çözünürlükleri de mevcuttur.
ekran sorgusu.es
Herhangi bir siteyi kontrol edecek çok güzel bir hizmet. İşlevselliğinin yanı sıra tasarımını da çok beğendim.
quirktools.com
Çok güzel ve işlevsel bir hizmet. Sitenin TV'de nasıl görüneceğini kontrol etmek bile mümkün :-)
