Web Sitenizin Mobil Deneyimini Dönüşümler İçin Nasıl Optimize Edebilirsiniz?

Yayınlanan: 2020-12-30

Elli bir buçuk.

Bu, bir mobil cihazdan internette gezinen çevrimiçi kullanıcıların yüzdesidir. Bu olasılıklarla, işletmenizin potansiyel müşterilerinin önemli bir kısmının size 480 piksellik bir ekrandan gelmesi muhtemeldir. Web sitenizin mobil sürümünü biçimlendirmeden bıraktıysanız, içindeki bilgileri çıkardıysanız veya bir mobil sürümünüz yoksa, sitenizin ziyaretçilerinin yarısını dönüştürme fırsatını kaçırıyorsunuz demektir.

Mobil cihazlar için optimize etmenin, tamamen ayrı başka bir web sitesi oluşturmak kadar çaba gerektirdiğine inanabilirsiniz. Ancak gerçek şu ki, sitenizi daha mobil uyumlu hale getirmenin pek çok kolay yolu var. İşte web sitenizin dönüşüm sağlayan bir mobil sürümünü oluşturmak için birkaç ipucu ve püf noktası.

Hız İhtiyacı

Hız, bir mobil site oluşturmanın en önemli bileşenidir ve bunun nedeni, kullanıcıların yüklenmesi üç saniyeden uzun süren bir web sitesinden ayrılması değildir . Yavaş yüklenen web sitelerinin hemen çıkma oranı daha yüksektir, bu da kullanıcıların içerikle gerektiği kadar uzun süre etkileşim kurmadığı ve web sitenizdeki diğer sayfaları (iletişim sayfası veya ödeme sayfası gibi) ziyaret etme olasılıklarının daha düşük olduğu anlamına gelir.

İdeal olarak, web sitenizin 2-3 saniye veya daha kısa sürede yüklenmesini istiyorsunuz. Web sitenizi hızlandırmanın tonlarca yolu var, ancak en büyük desteği sağlayacak olanlara bağlı kalalım:

1. Kaynak Ağırlığı Olan Dosyaları Sıkıştırın

  • Görüntüler tasarım için önemlidir, ancak bunları sıkıştırılmamış bir durumda bırakmak sitenizi büyük ölçüde yavaşlatır. Arka uçta görüntüleri sıkıştırabilen çok sayıda eklenti vardır veya yüklemeden önce eski moda gidip fotoğraflarınızı bir fotoğraf düzenleyicide daha yönetilebilir bir boyuta sıkıştırabilirsiniz - her iki yol da işe yarar. Amaç, resimlerin ve videoların sayfada görüntülenme kalitelerinden ödün vermeden mümkün olduğunca az yer kaplamasını sağlamaktır.
  • Bir sayfa oluşturucu kullanırken HTML, CSS ve JavaScript kodunu gözden kaçırmak kolaydır. Ancak bu dosyalar genellikle sitenizi yavaşlatan gereksiz veya boş satırlar içerir. Bu dosyaları tek bir tıklamayla küçültecek olan WP Rocket gibi bir eklenti kullanmanızı öneririz. Alternatif olarak, kodu kendiniz de kontrol edebilirsiniz. Herhangi bir boş satır görüyor musunuz? Bu satırları silmek, web sitenizin genel görünümünü etkilemez ve bazı şişkinlikleri gidermeye yardımcı olur, böylece web sitenizin performansını artırır.

2. Hızlandırılmış Mobil Sayfaları (AMP) Kullanmayı Düşünün

AMP'ler tamamen hız ve okuyucunun bilgiyi sindirmesini kolaylaştırmakla ilgilidir. AMP eklentisi, kullanıcılara mobil siteleri ziyaret ederken daha iyi bir deneyim sunmak için orijinal olarak Google tarafından geliştirilmiştir. Bir web sayfasının AMP versiyonu, esasen orijinal sayfanızın sadeleştirilmiş bir HTML versiyonudur. Sonuç? Dönüştürme olasılığı çok daha yüksek olan ışık hızında bir web sayfası.

Duyarlı tasarım

Duyarlı tasarım

Bir web sitesi tasarlamak için WordPress kullanıyorsanız, büyük olasılıkla web sitenizin görünümünü kontrol etmek için bir tema yüklemişsinizdir. Ne yazık ki, tüm temalar eşit yaratılmamıştır.

Bazı temaların yetersiz kaldığı alanlardan biri, duyarlı tasarımın olmamasıdır. Duyarlı tasarım, bilgileri ve tasarım öğelerini çeşitli ekran boyutları için mümkün olan en iyi şekilde düzenler. Bu yerleşik bir temaya sahip olmanın harika yanı, tema stil sayfasının kendisinde yerleşik CSS özellikleriyle otomatik olarak gerçekleşecek olmasıdır.

Yerleşik duyarlı tasarıma sahip bir tema seçerseniz, sitenizi mobil cihazlar için optimize etmek çok daha kolay olacaktır. Mevcut temanız bu işlevselliğe sahip değilse, bu 14 mobil uyumlu WordPress teması listesi , sahip olanı aramaya başlamak için iyi bir yerdir.

Dokunma ve Kullanılabilirlik

Dokunma ve Kullanılabilirlik

Mobil web sitenize erişen kullanıcılar, başparmaklarının dokunuşuyla her sayfada gezinecekler. Bunu gündeme getirmek aptalca görünebilir, ancak bu gerçeği akılda tutmak, daha iyi bir mobil site tasarlamanıza yardımcı olacaktır.

  • Başparmak bölgesi: Gadget'larımızı nasıl tuttuğumuzla ilgili bir makale, başparmağın ekranı daha doğru bir şekilde tarayabileceği alan olarak başparmak bölgesine atıfta bulunur. Sayfanın en üst ve en alttaki alanları, bir akıllı telefonda ulaşılması en az rahat olanlardır. Web tasarımcıları olarak, dönüştürme öğelerini - dokunmalarını istediğimiz öğeler - bir kullanıcının bunu yapmasının en kolay olduğu alanlara koymalıyız.
  • "Tıklama" etkileşimleri: Bir mobil cihaz kullanırken, kullanıcılar iki şey yapabilir: sayfayı aşağı kaydırmak için kaydırın ve bir öğeyle etkileşim kurmak için hafifçe dokunun. Bir kullanıcının bir şeyin tıklanabilir olduğunu bilmesini sağlamak için fareyle üzerine gelindiğinde animasyon veya renk değiştirme yoktur. O unsuru kaybettiğimiz için, başka şekillerde telafi etmeliyiz. Sayfada tıklanabilir bir şey varsa, mobil cihazlarda daha çok bir düğme gibi görünmesi gerekir. Alternatif olarak, kullanıcıyı nasıl ilerleyeceği konusunda yönlendirmek için öğelerin altına tıklanabilir görünmeyen düğmeler ekleyebilirsiniz.

Açılır pencereler

Telefonunuzda bir web sitesini ziyaret ettiğinizde, tıklayamadığınız bir açılır pencereyle hiç karşılaştınız mı? Ya "x" çok küçüktü ya da biraz görüş alanı dışındaydı ve tıklanamıyordu. Bunlar, mobil sitelerdeki açılır pencerelerle ilgili yaygın sorunlardır.

Çözüm basit: Mobil sitenizde açılır pencereler kullanıyorsanız, bunları biçimlendirmek ve test etmek için zaman ayırın. Aynı prensip formlar ve düğmeler için de geçerlidir. Mobil cihazlarda tüm açılır pencerelerin uygun boyutta olması çok önemlidir. İstediğiniz son şey, dönüştürme niyeti olan bir kullanıcının web siteniz tarafından bunu yapmaktan caydırılmasıdır.

İçeriği Basit Tutun

1. Açık Bir Yol Sağlayın

Bir web sitesinin masaüstü sürümünde, başlıkta her önemli sayfaya bir bağlantı görüntüleyen bir menü görmek yaygın bir durumdur. Mobil kullanıcılar, genellikle menüyü açan bir geçiş düğmesine tıklayarak bu seçeneği elde eder. Bu, ziyaretçilerin önemli ana sayfalar arasında hızlı bir şekilde gezinebilmelerini sağlamanın bir yoludur, ancak web tasarımcıları olarak onları istediğimiz sayfalara, yani dönüşen sayfalara yönlendirebileceğimiz başka yollar da vardır.

Örneğin, birçok e-ticaret web sitesi, menülerinin yanına bir sepet simgesi yerleştirir. Bu, sepeti öne ve ortaya yerleştirerek kullanıcıların bulmasını ve kontrol etmesini kolaylaştırır. Hizmet satan web siteleri bunun yerine bir iletişim düğmesi kullanabilir. Bu, kullanıcıları müşteriye dönüştürme hedefinizi ilerletmekle kalmaz, aynı zamanda aradıklarını bulmayı kolaylaştırarak kullanıcının amacını gerçekleştirmesine de yardımcı olur.

2. Önemli Olanla Liderlik Edin

Amaç, web sitenizden dönüşüm oluşturmaktır - mobil sürümü oluştururken bunu aklınızda bulundurun. Bu daha küçük bir alandır, bu nedenle birincil gayrimenkulünüzü bilgi veya genellikle dönüşüm sağlamayan sayfalarda boşa harcamayın.

Bir masaüstü sitesinde, estetikten ödün vermeden üç sütun değerinde bilgiyi rahatça sığdırabilirsiniz. Bir mobil sitede, büyük olasılıkla bir veya iki sütunlu düzenlerle sınırlısınız. Bazı kullanıcılar asla sayfanın sonuna kadar kaydırmazlar. Bu nedenle, harekete geçirici mesajların (CTA'lar) ve kullanıcıların harekete geçmesi için fırsatların en üstte kolayca erişilebilir olması zorunludur.

3. Siteyi Yıkmayın

Eylemi teşvik eden bilgilerle liderlik etmek, diğer her şeyin kaldırılması gerektiği anlamına gelmez. Web tasarımcıları bazen, sitelerinin mobil sürümünü tamamen kaldırarak, masaüstü sürümünde bulunan bilgilerin yalnızca küçük bir bölümünü bırakma eğiliminde olurlar. Bu bir hata. Temmuz 2019'da Google, mobil öncelikli dizine eklemeyi duyurdu ; bu, Google'ın arama sonucu sıralamalarını belirlerken önce web sitenizin mobil sürümüne bakacağı anlamına gelir.

Mart 2021, Google'ın mobil öncelikli dizine eklemeyi tüm web sitelerinde standart hale getireceği tarihi işaret ediyor. Hayati bilgileri mobil web sitenizden çıkarırsanız, genel SEO stratejinizden ödün veriyor olabilirsiniz.

Peki, okunabilir, mobil uyumlu bir web sitesi tasarlarken bu bilgileri nasıl dahil edebilirsiniz? Cevap basit: yeniden yapılanma. Bu bilgileri ön ve merkez olmayan diğer sayfalara taşıyın, kullanıcıların yine de oraya ulaşabilmesi için bağlantılar ve düğmeler ekleyin, hatta gerekirse masaüstü sürümünü kısaltın. Sadece sitenizin mobil versiyonunu soğukta montunuzu giymeden dışarıda bırakmayın.

Dönüşümlerinizin Yarısını Kaybetmeyin

Mobil kullanım masaüstü kullanımını çoktan geçti ve her yıl artmaya devam ediyor. Muhtemel müşterilerinizin işini yakaladığınızdan emin olmanın en iyi yolu, mobil web sitenizin süreci basitleştirmesini sağlamaktır.

Daha önce bahsettiğimiz kullanıcıların yüzde 51,5'ini hatırlıyor musunuz? Hala dışarıdalar. Soru şu ki, onları dönüştürmek için bu fırsatı değerlendirecek misiniz?