Oluşturduğunuz Her Web Sitesinde Takip Edebileceğiniz Mobil Uyumlu Bir Kontrol Listesi

Yayınlanan: 2017-08-10

Mobil cihazlarda iyi çalışan bir web sitesi oluşturmak kolay değildir, ancak yapılabilir. Sitenizi göndermeden önce iyice kontrol ettiğiniz sürece, mobil kullanıcıların harika bir deneyim yaşamaması için hiçbir neden yoktur. Bununla birlikte, en çok hangi unsurların dikkatinize ihtiyacı olduğunu merak edebilirsiniz.

Bu makalede, sitenizin karşılaması gereken yedi kriterden oluşan basit bir kontrol listesi sunacağız. Olursa, kullanıcılarınız muhtemelen harika bir mobil deneyime sahip olacak ve değilse, size işleri nasıl tersine çevireceğinizi söyleyeceğiz. Bir numaralı noktayla başlayalım!

Mobil Uyumlu Bir Web Sitesine Sahip Olmanın Önemi

Google'ın mobil uyumluluk testi örneği.

Mobil uyumlu bir web sitesine sahip olmak günümüzde her zamankinden daha önemli.

'Mobil uyumlu' terimi biraz belirsiz geliyor. Basitçe söylemek gerekirse, içeriğini kolayca tüketebiliyor ve herhangi bir tür mobil cihaz kullanarak etkileşim kurabiliyorsanız, bir site mobil uyumlu olarak kabul edilebilir.

Muhtemelen bildiğiniz gibi, mobil tarama yükselişte, yani birçok insan onları web'de gezinmenin birincil yolu olarak kullanıyor. Sitenizin kullanımı kolay değilse, kullanıcılar bir alternatif arayabilirler. Neyse ki, web sitenizin mobil uyumlu olup olmadığını test etmenin birkaç yolu var. Örneğin Google, herhangi bir sitenin yalnızca URL'sini yapıştırarak kullanabileceği bir test sunar:

Google'ın mobil uyumlu testi.

Yine de, hiçbir otomatik testin mükemmel olmadığını unutmayın - bu nedenle biraz sağduyu egzersizi yapmanız gerekecektir. Bu amaçla, sitenizin mobil kullanıcılar için olabildiğince kolay olmasını sağlamanıza yardımcı olacak bazı ipuçlarını burada bulabilirsiniz.

Oluşturduğunuz Her Web Sitesinde Takip Edebileceğiniz 7 Adımlı Mobil Uyumlu Kontrol Listesi

Mobil trafiğin önemi göz önüne alındığında, oluşturduğunuz her web sitesinin en başından itibaren mobil uyumlu olması çok önemlidir. Bu kontrol listesi, her adımda başarılı olduğundan emin olmanıza yardımcı olacaktır. Hadi bir bakalım!

1. Web Sitenizi Birden Çok Çözünürlükte Test Edin

Elegant Theme'nin mobil web sitesi.

Web sitenizi birden fazla çözünürlükte test etmek, doğru araçla kolaydır.

Mobil siteler söz konusu olduğunda en önemli şeylerden biri, sitenizin masaüstü sürümünden küçültülmüş gibi görünmemesidir. Bu, öğelerinizin her birinin birden çok çözünürlükte iyi görünmesi gerektiği anlamına gelir.

Öte yandan, öğelerinizden hiçbiri mobilde iyi görünmüyorsa, hemen çıkma oranınızı olumsuz etkileyebilir. Yapılacak akıllıca şey, web sitenizi önceden birden fazla çözünürlükte test etmek ve herhangi bir sorun olup olmadığına bakmaktır.

Neyse ki, bu süreç göründüğü kadar karmaşık değil ve bunu yapmak için birden fazla cihaza sahip olmanıza gerek yok. Herhangi bir web sitesini farklı çözünürlüklerde hızlı bir şekilde test etmenizi sağlayan birçok hizmet vardır, örneğin:

  • Chrome Geliştirme Araçları: Bu yerleşik Chrome tarayıcı özelliği, sitenizi birden çok çözünürlükte test etmek için kullanabileceğiniz bir Cihaz Araç Çubuğu içerir.
  • Screenfly ve BrowserStack gibi hizmetler : Bu üçüncü taraf hizmetler, sitenizi çok daha çeşitli çözünürlüklerde test etmenizi sağlar.

Bahsettiğimiz tüm araçlar ücretsizdir, bu nedenle bütçe bir sorun olmamalı ve bu adımı atlamak için hiçbir mazeret yok!

2. Menülerinizin ve Navigasyon Ekranınızın Daha Küçük Ekranlarda İyi Göründüğünden Emin Olun

Bir mobil menü.

Menülerinizin mobil cihazlarda iyi görüntülenmesini sağlamak, sitenizi kullanılabilir durumda tutmak için önemlidir.

Çoğu durumda menüler, insanların sitenizde gezinmesinin ana yoludur. Bağlantılarınızı tıklamak veya daha küçük çözünürlüklerde okumak zorsa, kullanılabilirliği etkiler. Ayrıca, gezinmek için kullanılan cihazdan bağımsız olarak tüm menü öğelerinize kolayca erişilebildiğinden emin olmak istersiniz.

Bunu akılda tutarak, mobil menülerinizi test etme zamanı geldiğinde hiçbir şeyi kaçırmamak için birkaç adımı gözden geçirelim:

  1. Tüm menü öğelerinin görünür olup olmadığını kontrol edin. Kaydırarak ulaşılıp ulaşılamayacağından emin değilseniz.
  2. Her bağlantının hizalandığından ve alt menülerin iç içe geçtiğinden emin olun.
  3. Her bir menü öğesini okuyabiliyor musunuz ve üzerine tıklayıp okuyamadığınızı iki kez kontrol edin.

Divi gibi çoğu modern WordPress temaları sizin için otomatik olarak duyarlı menüler oluşturacaktır. Sitenizin bu yönüyle ilgili sorunlar yaşıyorsanız, yeni bir temaya güncelleme yapmayı düşünmeye değer olabilir.

3. Küçük Çözünürlüklerde Görüntülerinizin İyi Görünüp Görünmediğini Kontrol Edin

Bir resme odaklanan bir mobil web sitesi.

Sitenizin resimleri, çözünürlüklerinden bağımsız olarak eşit derecede çarpıcı görünmelidir.

Görüntüler herhangi bir web sitesinin önemli bir bileşenidir, ancak bazen grafikleriniz daha düşük çözünürlüklerde en iyi şekilde görünmeyebilir. Örneğin, birisi sitenize mobil aracılığıyla eriştiğinde logonuz okunamıyorsa, bu açıkça markanızı etkileyecektir.

Çoğu durumda, insanlar görüntülerini 'çarpma' konusunda daha fazla endişe duyarlar, ancak onları küçültmek de bir sorun olabilir. Her resim her çözünürlükte mükemmel bakmak için adapte edilebilir, ancak daha az bir sorun bunu yapmak için adımlar atabilirsiniz:

  1. Çabalarınızı markanız için önemli olan görsellere odaklayın.
  2. SVG'ler gibi popüler görüntü türlerine ölçeklenebilir alternatifler arayın.
  3. Mümkün olduğunda, daha küçük boyutlarda daha iyi görünmeleri için daha iyi kırpılmış görüntüleri tercih edin.

Bu ipuçlarını aklınızda tuttuğunuz sürece, gitmeniz iyi olur. Infographics gibi çok karmaşık görüntüler söz konusu olduğunda, bunları tamamen düşük çözünürlüklere uyarlamanın mümkün olmayabileceğini unutmayın.

4. İçeriğinizi Okunabilirlik Açısından Test Edin

Zarif Temalar makalesinin ekran görüntüsü.

Küçük ekranlar okunabilirliği etkileyebilir, ancak bunlara uyum sağlamak kolaydır.

Mobil cihaz kullanılabilirliğini en çok etkileyen yönlerden biri okunabilirliktir. Daha küçük bir form faktörüyle çalışırken, metninizin yalnızca küçültmek yerine okunabilir bir boyutta görüntülendiğinden emin olarak telafi etmeniz gerekir. Buradaki amaç basittir - kullanıcılarınız sitenizde yakınlaştırma ve sıkıştırma yapmamalıdır. Sonuçta, bu sinirli bir ziyaretçi için mükemmel bir tarif.

Neyse ki, okunabilirlik, ele alınması nispeten kolay olan bir husustur:

  • İçeriğinizin gövdesi için yüksek düzeyde okunabilir bir temel yazı tipi seçin.
  • İçeriğinizi kolayca taranabilir bölümlere ayırmak için mümkün olduğunda alt başlıklar kullanın.
  • Metninizin nasıl görüntüleneceği konusunda size daha fazla kontrol sağlayan bir tema seçin.

Son noktamızla ilgili olarak, birçok modern tema size aradığınız kontrolü sunmalıdır. Örneğin Divi, hem masaüstü hem de mobil için herhangi bir modül metninin boyutuna ince ayar yapmanızı sağlar.

5. Sitenizin Öğeleriyle Etkileşime Geçilmesinin Kolay Olduğundan Emin Olun

Bir CTA ve canlı sohbet düğmesi.

Öğelerle parmaklarınızı kullanarak etkileşim kurmak zor olabilir, bu nedenle tasarımlarınızı ayarlamanız gerekir.

Bu adım çok fazla alanı kapsayabilir, ancak bizimle birlikte. Şimdiye kadar, menülerinizin kullanımının kolay olmasının ne kadar önemli olduğunu ele aldık, ancak aynı şey sitenizin geri kalan etkileşimli öğeleri için de geçerlidir. Düğmeler, bağlantılar, formlar ve daha fazlası - hepsinin mobil cihazlar için kullanılabilir durumda kalması gerekir.

Buradaki en önemli husus, elbette, boyuttur. Çözünürlükte aşağı doğru hareket ettikçe, bahsettiğimiz öğelerin çoğu da küçülür. Sitenizin kullanılabilirliğini etkileyebileceğinden, etkileşim kurmanın çok zor olup olmadığını test etmek sizin işinizdir.

Nasıl yapılacağına gelince, burada daha önce bahsettiğimiz hizmetler yerine gerçek mobil cihazları kullanmanızı öneririz. Sonuçta, öğelerinizin fare yerine parmaklarınızla kullanımının kolay olup olmadığını bilmeniz gerekir. İşte dikkat etmeniz gerekenler:

  • Harekete Geçirici Mesajlarınızın (CTA), formlarınızın ve menü öğelerinizin kolayca tıklandığından emin olun.
  • Kritik öğeler arasında, kullanıcıların yanlış öğeyi tıklamasına neden olabilecek herhangi bir çakışma olup olmadığını kontrol edin.

Hangi öğelerin size sorun çıkardığını öğrendikten sonra, bu onları gerektiği gibi yeniden boyutlandırma meselesidir. Divi gibi bir tema kullanıyorsanız, bunu her modülün ayarlar ekranından yapabilirsiniz.

6. Pop-up'lara Aşırı Güvenmediğinizden Emin Olun

Bir açılır ekran.

Pop-up'lar etkili olabilir, ancak sitenizin kullanılabilirliğini de etkiler.

Kaydolma pop-up'ları ve benzerleri genellikle dönüşümde çok önemli artışlara neden olur. Bununla birlikte, en az dönüştürdükleri kadar insanı rahatsız etme eğilimindedirler.

Bu müdahaleci mobil pop-up kullanırsanız korkutup tam olarak kaç kişinin kesin olarak belirlemek zor, ama biz bazı arama motorları söyleyebilirim - Google gibi - bunun için cezalandırabilir olacaktır. Ana içeriğinizi gizleyen veya kullanıcıları erişmeden önce onları geçmeye zorlayan herhangi bir açılır pencere kullanırsanız, Arama Motoru Optimizasyonu (SEO) bundan zarar görür.

Pop-up'ların faydalı olabileceğini biliyoruz, ancak daha az müdahaleci alternatifler var, örneğin:

  • Şık tercih formları.
  • Optimize edilmiş CTA'lar.

Çığır açıcı değil, ancak formlarınızı ve CTA'larınızı optimize etmek, daha az kullanıcıyı uzaklaştıracağınız için uzun vadede size daha büyük bir getiri sağlayabilir. Ayrıca, arama motoru sıralamalarınız da etkilenmeyecektir.

7. Web Sitenizin Yükleme Sürelerini Test Edin

Bir Pingdom hız testi.

Web siteniz bir saniyeden daha kısa sürede yüklenirse sonuçlarınızdan çok memnun olabilirsiniz.

Düzenli bir Elegant Themes iseniz, mümkün olduğunda her zaman performansı vurguladığımızı bileceksiniz. Hızlı yüklenen bir site, birçok insanın fark ettiği bir şey değildir, ancak tam tersi olduğunda kesinlikle not alırlar.

Yüksek yükleme süreleri genellikle hemen çıkma oranınızın artmasına neden olur ve sitenizi daha az kullanılabilir hale getirir. Ayrıca, bazıları optimum bağlantılardan daha azını kullanarak sitenize göz atıyor olabileceğinden, mobil kullanıcılar için özellikle önemlidir.

WordPress web sitenizi optimize etmek, başlı başına bir makalenin tamamını alabilecek bir konudur, ancak işte bazı hızlı ipuçları:

  • Mümkünse Divi gibi mobil cihazlar için optimize edilmiş bir tema deneyin.
  • Daha az yer kaplamaları için resimlerinizi optimize edin.
  • Web siteniz için bir önbelleğe alma çözümü uygulayın.

Bunların hepsi sağlam adımlardır, ancak yükleme sürelerinizi düşük tutmak için yapabileceğiniz tek şey bunlar değildir. Daha fazla bilgi için, WordPress kurulumunuzu nasıl optimize edeceğinize dair bir süre önce yayınladığımız bu tam parçaya göz atın.

Çözüm

Web sitenizin mobil uyumlu olduğundan emin olmak her zamankinden daha önemli. Mevcut eğilim devam ederse, önümüzdeki birkaç yıl içinde trafiğinizin çoğunun mobil kaynaklardan geldiğini göreceksiniz (henüz gelmiyorsa). Şu anda yapabileceğiniz en akıllıca şey masaüstü ve mobil cihazlarda hem eşit derecede önemli bir deneyim sağlamaktır.

Web sitenizin mobil uyumlu olarak kabul edilip edilemeyeceğinden emin değilseniz, şunları öğrenmenize yardımcı olacak basit bir kontrol listesi:

  1. Web sitenizi birden çok çözünürlükte test edin.
  2. Menülerinizin ve navigasyonunuzun daha küçük cihazlarda iyi görüntülendiğinden emin olun.
  3. Görüntülerinizin düşük çözünürlüklerde iyi görünüp görünmediğini kontrol edin.
  4. İçeriğinizi okunabilirlik açısından test edin.
  5. Sitenizin öğeleriyle etkileşim kurmanın kolay olduğundan emin olun.
  6. Pop-up'lara aşırı güvenmediğinizden emin olun.
  7. Web sitenizin yükleme sürelerini test edin.

Sitenizin mobil uyumlu olduğundan nasıl emin olacağınız hakkında sorularınız mı var? Aşağıdaki yorumlar bölümünde onlar hakkında konuşalım!

Makale küçük resmi 32 piksel / Shutterstock.com.