Duyarlı Tasarım için WordPress Web Sitenizi Nasıl Test Edebilirsiniz?

Duyarlı web tasarımı bize ilk olarak Ethan Marcotte tarafından 2010 yılında A List Apart'ta yayınlanan (bekleyebileceğiniz gibi) Duyarlı Web Tasarımı başlıklı bir yazıyla tanıtıldı.

Aynı yıl -aslında sadece birkaç hafta önce- iPad, internette gezinme ve birbirimizle iletişim kurma şeklimizi sonsuza dek değiştirerek, mevcut mobil tablet cihazlarının halka sunulan ilk dalgası oldu.

O zamandan beri, duyarlı tasarım yavaş yavaş daha yaygın hale geldi.

Ancak web'i kullanan insanların büyük çoğunluğu için bu terim hiçbir şey ifade etmiyor. Sadece web sitelerinin cihazlarında düzgün bir şekilde görüntülenmesini istiyorlar. Onları istedikleri sayfaya götürebilecek veya götürmeyebilecek küçük köprülere tıklamak istemiyorlar ve kaynak açısından yoğun kod ve görüntülerle dolu bir sayfanın indirilmesi çok uzun sürerken kesinlikle beklemek istemiyorlar.

Duyarlı tasarımdan almanız gereken , kullanımı kolay, hızlı yüklenen hızlı sayfalar istiyorlar.

Ve kısaca, bu yüzden bunu okuyorsunuz. Bu yazıda, gerekliliği vasiyete dönüştürmenize yardımcı olacağız.

Mobil Duyarlılık Artık Bir Sıralama Faktörü

Her şeyi bir noktaya getiren şey, Google'ın birkaç ay önce mobil cihazlardaki sitelerin kullanıcı dostu olmasının bir sıralama faktörü haline geleceğini duyurmasıdır.

Google, duyuruyu Şubat ayında yaptı:

21 Nisan'dan itibaren, bir sıralama sinyali olarak mobil uyumluluk kullanımımızı genişleteceğiz. Bu değişiklik, dünya çapındaki tüm dillerdeki mobil aramaları etkileyecek ve arama sonuçlarımızda önemli bir etkiye sahip olacaktır. Sonuç olarak, kullanıcılar, cihazları için optimize edilmiş alakalı, yüksek kaliteli arama sonuçları elde etmeyi daha kolay bulacaktır.

Buna rağmen 21 Nisan geldi geçti ve pek bir şey olmadı. En azından henüz değil. Ancak bunun sadece bir zaman meselesi olduğunu garanti edebilirsiniz.

Güncelleme, SEO ve çevrimiçi pazarlama çevrelerinde Mobilegeddon olarak adlandırılıyor. Aynı zamanda işletmeler için de büyük bir anlaşma; aslında o kadar önemli bir güncelleme ki ABD ve İngiltere'de haber yaptı.

Bugünkü gönderide, sitenizin veya müşterilerinizin etkin bir şekilde mobil uyumlu olup olmadıklarını test etmenin yollarına bakmak istiyorum. Onlar olmazsak, biz bu konuda ne yapabiliriz ele alacağız.

İyi Duyarlı Tasarım Nedir?

Oldukça basit bir şekilde, duyarlı tasarımın amacı, hangi cihazı kullanıyor olursa olsun, her kullanıcıya sürekli olarak kullanılabilir bir tarama deneyimi sağlamaktır.

Daha spesifik bir ifadeyle, bu, tüm işlevlerin her cihazda aynı şekilde çalışması ve davranması gerektiği anlamına gelir. Tipik blogunuzda bu, sosyal paylaşım düğmelerinden posta listesi kayıt formlarına ve gezinme menülerine kadar her şey olabilir. Ayrıca, son kullanıcı hangi cihaza göz atıyor olursa olsun, içerik kolayca sindirilebilir olmalıdır.

Tipik olarak, dört ekran türü vardır:

1. masaüstü,
2. dizüstü bilgisayar,
3. tablet ve
4. akıllı telefon.

Her biri için kesin boyutlar, üreticiler arasında çılgınca değişir. Siteniz her varyantta aynı görünmelidir. Bunu çözmek kulağa eğlenceli geliyor, değil mi?

Duyarlı Bir Web Sitesine mi ihtiyacınız var ?

Hızlı cevap: Gelecekte kesinlikle yapacaksınız. Bunda hiç şüphe yok. Ama şimdi ihtiyacın var mı? Başka bir hızlı cevap: Neredeyse kesinlikle.

Google Analytics'teki verilere bakmak için fazla zaman harcamazsanız, özellikle sitenizi bir mobil cihazda ziyaret eden kişilerle ilgili olarak, bunu düzeltmenin tam zamanıdır. Verilerden, bir mobil cihaz kullanarak sitenizi kaç kişinin ziyaret ettiğini öğrenebilirsiniz. Ayrıca ne kadar süre kaldıklarını ve ne tür bir deneyim yaşadıklarını keşfedebilirsiniz.

Analytics'i nasıl kurduğunuza bağlı olarak, bir mobil cihaz kullanan kaç kişinin müşteriye dönüştüğünü, posta listenize katıldığını veya hizmet veya yazılımınızın ücretsiz deneme sürümüne kaydolduğunu da keşfedebilirsiniz.

Verileri görüntülemek için Google Analytics hesabınıza giriş yapın, incelemek istediğiniz siteyi seçin ve Kitle > Mobil > Genel Bakış'a gidin.

Burada masaüstü bilgisayarlar, cep telefonları ve tabletler için analizler göreceksiniz.

Siteniz yanıt vermiyorsa, insanların sitenizle nasıl etkileşime girdiğine ilişkin verilere bakın:

• Çıkma Oranı
• Sayfa/Oturum
• Ort. Oturum Süresi
• Hedef Dönüşüm Oranı

Rakamlar masaüstü istatistiklerinden önemli ölçüde düşükse, elinizde ciddi bir sorun var demektir. Veriler, cep telefonlarındaki ve tabletlerdeki kişilerin sitenizi ziyaret ettiklerinde iyi bir deneyim yaşamadıklarını söylüyor.

Bu, bir şeyler yapma zamanının geldiği anlamına gelir.

Sitenizi Mobil Duyarlılık için Test Etme

Siteniz mobil uyumlu değilse, yapmanız gereken ilk şey birkaç test yapmaktır. Neyse ki, bir sitenin mobil cihazlarda nasıl göründüğünü ve çalıştığını değerlendirmenize yardımcı olabilecek birçok çevrimiçi araç var.

Birkaç saniye içinde bunlardan bazılarına geleceğiz. Ama şimdilik en basit testleri yapalım.

Bir masaüstü makinedeyseniz, test etmek istediğiniz siteye gidin, yüklenmesine izin verin, ardından tarayıcı ekranınızı daraltın. Bunu yaptığınızda, site responsive bir tasarıma sahipse, web sayfasındaki öğeler üst üste çökecek, ancak yine de kaydırma sayesinde tüm sayfayı görebileceksiniz.

Bir mobil cihaz kullanıyorsanız, test etmek istediğiniz siteyi ziyaret edin ve makinenizde nasıl çalıştığını görün. Masaüstü sürümüyle tamamen aynı gibi görünüyor ancak küçülmüşse siteniz responsive değildir.

Çevrimiçi Öykünücüleri Kullanarak Birden Çok Aygıtı Test Etme

Her şey bu iki basit testi çok iyi çalıştırıyor, peki ya oradaki çok sayıda makine? iPad'lerden Google Nexus'a ve Samsung Galaxy akıllı telefonlarına? Siteniz bunlara nasıl bakıyor?

Neyse ki, dışarı çıkıp piyasadaki her cihaza küçük bir servet harcamanıza gerek yok. Bunun yerine, testlerinizi çalıştırmak için mevcut emülatör sitelerinden birini kullanın.

Bunlardan bazılarına bir göz atalım.

MobilTest.me

Bu, sitenizi iPhone 5, HTC ONE ve Google Nexus dahil altı popüler mobil cihaz emülatöründe test eder.

Bir siteyi test etmek için ilgilendiğiniz cihaza tıklayın ve test etmek istediğiniz sitenin/sayfanın URL'sini girin. Birkaç saniye içinde öykünücü cihazdaki sayfayı alır. Sadece bu da değil, sayfa bağlantıları ve diğer veriler etkin kalır, böylece siteye öykünücü aracılığıyla göz atabilirsiniz.

MobileTest.me'yi kullanın.

sorumlu

Çoğunlukla Apple cihazlarına odaklanan, ancak birkaç Android makinesi de içeren şık bir emülatör. MobileTest.me gibi her cihazı sırayla test etmek yerine, test URL'sini girip sayfayı aşağı kaydırmanız yeterlidir.

Yaptığınız gibi, popüler cihazlarda hem dikey hem de yatay modda nasıl göründüğünü göreceksiniz.

Responsinator'ı kullanın.

Duyarlı mıyım

Burada aynı işlem: sonuçları almak için test URL'sini girin. Bu sefer kaydırma yapmıyorsunuz; Genel cihazlar için sonuçları ekranın üst kısmında göreceksiniz. Her birinin ekranının içine tıklarsanız, siteyi normal şekilde kaydırabilir ve kullanabilirsiniz.

Duyarlı mıyım'ı kullanın.

Google'ın Mobil Dostu Testi

Bahsetmeye değer bir şey daha var: Google'ın kendi aracı.

Google'ın Mobil Uyumluluk Testini kullanın.

Sırada ne var?

Bu zamana kadar duyarlı tasarımın önemini anladınız ve sitenizin birden fazla cihazda nasıl göründüğünü biliyorsunuz. Ancak harekete geçmeniz gerekiyor mu?

Siteniz tüm cihazlarda çalışıyorsa herhangi bir şey yapmanıza gerek yoktur; mevcut ve gelecekteki ziyaretçileriniz için sitenizi geliştirmeye devam edin.

Siteniz çalışmazsa, üç seçeneğiniz vardır:

1. Mevcut tasarımı duyarlı hale dönüştürün. Bu, değerinden daha fazla sorun olabilir.
2. Bir mobil tema kullanın. Bu, tutarlılık ve kullanılabilirlik gibi temel duyarlı tasarım ilkelerini yener.
3. Yeni bir mobil uyumlu tema veya tasarım benimseyin. En ucuz seçenek olmasa da, sıfırdan başlamak, bir tür uzlaşmayı temsil etmeyen tartışmasız tek seçenektir.

Bu arada, aralarından seçim yapabileceğiniz en az 21 ile güzel, duyarlı temalar yaptığımızı söylememe gerek yok.

Yeni temayı yükledikten sonra, test etme zamanı. İşte akılda tutulması gereken üç önemli husus:

1. Kullanıcıların sitenizde gezinmesi kolay mı?
2. İçeriğin okunması kolay mı?
3. Kullanıcıların Harekete Geçirici Mesajlarınızı takip etmesi kolay mı?

Sitenizin her bölümünü bir kullanıcıymış gibi inceleyin ve bulduğunuz sorunları düzeltin. Temalarımızdan birini kullanıyorsanız ve bir sorunla karşılaştıysanız, iletişime geçmeniz yeterlidir; yardımcı olmaktan memnuniyet duyarız.

Toplama

Google'ın insanları mobil uyumlu tasarımları benimsemeye 'zorlama' hamlesinin çok geç kaldığını düşünüyorum.

Ayrıca, uzun süredir büyük siteler ve büyük işletmeler, geçiş söz konusu olduğunda topuklarını sürükledi. Trafik ve satışlardaki bu potansiyel kayıp, harekete geçmeleri için kesin bir işarettir.

Serbest çalışan web tasarımcıları ve tema oluşturucular için, uyma telaşı hız kazanırken kariyerinizin en yoğun dönemine giriyor olabilirsiniz. Hala yanıt vermeyen tasarımları kullanan kaç müşteriniz var? Güncelleme bekleyen kaç tane yanıt vermeyen site var? Düşünmek için titriyorum! Ancak kesin olan bir şey var: Özellikle duyarlı tasarımın ne kadar önemli olduğunu açıkça ifade edebiliyorsanız, yapılacak çok iş var.

Duyarlı tasarımın önemi ve sitelerinin rakiplerine kıyasla nasıl göründüğü hakkında müşterilerinize dikkat çekmeniz gerekiyorsa, çevrimiçi öykünücüler kullanmak için harika araçlardır ve hizmetlerinizi satmayı çok daha kolay hale getirmeleri gerekir!

Umarım bu gönderiyi faydalı bulmuşsunuzdur. Aşağıdaki yorumlarda düşüncelerinizi ve deneyimlerinizi okumak isterim.

Görseller Ira Yapanda ve Geanine87 / Shutterstock.com