Chrome'da Mobil Site Testi Yapmak (Mobil Browser Emulator)

Wp için yazdığım cache eklentisini geliştirirken sitelerin mobil versiyonu üzerinde sürekli inceleme ve testler yapmam gerekti, malum mobil telefon tarayıcısında öğeyi denetle (debug) kısmı yok ve sürekli telefondan kontrol etmek zaman kaybına sebebiyet veriyor. İnternetteki online emilatorlerde çok başarılı değil en azından benim incelediklerim. Bu sebepten, pc üzerinden mobil testi yaparken kullandığım bir yöntemi belki başkasının işine yarar diye paylaşmak istedim.

Öncelikle web sitesine girip f12ye basarak debug kısmını açıyoruz. Orada toggle device mod kısmına tıklıyoruz.



Sonrasında ise üst kısımdan device (aygıt) seçebilir veya manuel olarak çözünürlükte belirtebilirsiniz.



Aygıt seçimini yaptıktan sonra f5 yaparak sitenin mobil halini inceleyebilirsiniz.



Ayrıca ekstra olarak network seçeneği kısmından bağlantı tipini değiştirerek (gprs, edge vb.) hız simulasyonu da yapabilirsiniz. Daha fazla ayar için ise http://i.imgur.com/r5nNzku.png burdaki işaretlediğim kısımdan ulaşabilirsiniz.

Bu yöntemin online emilatorlerden ne farkı var ?
- Online emilator sitelerinin bir çoğu sadece boyutları ayarlanmış bir iframe ile sitenizi çeker, eğer siteniz responsive değilde normal mobilse (örneğin wptouch gibi) bu sitelerde mobil siteyi göremeyebilirsiniz. Ayrıca site sizi yine pcden giriyormuş gibi görür çünkü tarayıcı bilgisi iframede değişmez. Ama bu yöntemde seçtiğiniz cihaza göre tarayıcı bilgisi gönderilir siteye yani gerçek bir mobil ziyaretçi gibi görünürsünüz.

Umarım faydalı olmuştur.