Pivix Logo
Sözlüğe dön

Sticky Bar

Sticky bar, ziyaretçi kaydırırken ekranın üstünde veya altında sabit kalan ve tek bir eylem çağrısını sürekli görünür tutan bir banttır.

Önemli noktalar

  • Konum görünüm penceresine göre hesaplanır; kaydırma çubuğu asla yerinden oynatmaz.
  • Değer, sayfa uzunluğu ve kararın ne kadar geç verildiğiyle birlikte artar.
  • Kalıcı bir görünüm penceresi kirası alır; bu en çok telefon ekranlarında ağırdır.
  • Kaydırma eşiğinden sonra yapışmak, görünen kahraman düğmesini tekrarlamayı önler.
  • Formlarda ve ödeme akışlarında örttüğü denetimlerle yarışır.

Derinlemesine

Sticky bar, belgeye değil görünüm penceresine göre konumlanır; koordinatları sayfa kaydırıldıkça yeniden hesaplanır ve çubuk ekranın sabit bir kenarını tutar. Görevi, kahraman düğmesinin erken kaybolduğu kadar uzun sayfalarda tek bir eylemi her kaydırma derinliğinde erişilebilir tutmaktır. Birçok uygulama akış içinde başlar ve yalnızca okuyucu özgün eylem çağrısının ekrandan çıktığı noktayı geçtiğinde yapışır; böylece zaten görünen bir düğmeyi tekrarlamaz.

Değer, sayfa uzunluğuyla ve kararın ne kadar geç oluştuğuyla büyür. Kısa bir sayfada ana düğme hiçbir zaman uzakta değildir, çubuk yalnızca yer kaplar. Uzun bir rehberde ise niyeti belirdiği anda yakalar, yukarı geri kaydırmayı gerektirmez. Bedeli kalıcı görünüm penceresi kirasıdır: telefonda çubuk ve tarayıcı çubukları okuma alanının beşte birini alabilir; bu kirayı, tıklayan azınlığın kaydırma zahmetinden kurtulması için herkes öder.

Yaygın yapılandırma tek satır, tek eylem, bir kaydırma eşiğinden sonra yapışma ve kapatılana dek kalıcılıktır. Ekipler onu destekledikleri en küçük görünüm penceresine göre boyutlandırır, cihazın güvenli alanına saygı gösterir ki ana ekran göstergesinin altına düşmesin ve hiçbir alt bilgi bağlantısını veya formun gönder düğmesini örtmediğini doğrular. Quiz hunisinde bu, okuyucuların genelde yarı yolda karar verdiği eğitici sayfalardaki kalıcı giriş noktasıdır.

Okuyucu zaten harekete geçmişse yardımı biter. Ödeme akışında, uzun bir formda veya etkileşimli bir araçta kaydırmayı izleyen çubuk, üzerinde durduğu denetimlerle yarışır ve küçük ekranda onları tamamen gizler. Aşinalık da onu üst çubuktan daha hızlı aşındırır, çünkü kısa süreliğine değil sürekli oradadır. Ayrıca hiçbir ısrar zayıf bir sayfayı kurtarmaz: çubuk eylemi erişilebilir yapar, arzu edilir değil.

Pratikte örnek

Bir B2B danışmanlık firması 2.500 kelimelik bir rehber yayınlar ve "Satış hazırlığınızı puanlayın" yazan alt bir sticky bar sabitler. Dönüşümlerin %70'i geçmişte sayfa katlamasının altında gerçekleştiğinden, büyüme yöneticisi CTA okuyucuları takip etmeye başlayınca ilk iki haftada bu sayfadan gelen quiz başlangıçlarının %38 arttığını görür.

Nasıl ölçülür

Sticky bar'a atfedilen dönüşümleri sayfa içi eylem çağrısından gelenlerle karşılaştırın, sonra iki sayıya ayrı ayrı değil toplamına bakın. Çubuk tıklamaları artarken kahraman tıklamaları aşağı yukarı aynı kadar düştüyse çubuk dönüşüm eklememiş, yerini değiştirmiştir. Bunu bilmek yine değerlidir, çünkü okuyucuların sayfanın neresinde karar verdiğini gösterir.

Tıklamaları gerçekleştikleri kaydırma derinliğine göre ayırın. Tıklamalarının çoğunu yarıdan sonra toplayan bir çubuk, desenin var olma nedenini yerine getiriyordur; ağırlıklı olarak üstte dönüşen bir çubuk ise eşiğin fazla erken olduğunu düşündürür. Mobilde çubuk yapıştıktan sonraki sayfada kalma süresini ve kaydırma derinliğini izleyin; okuma derinliğindeki düşüş, engellemenin bilinen imzasıdır.

Sık yapılan hatalar

Sık görülen hata, masaüstü ekranında tasarlayıp telefona göndermektir. Alttaki sticky bar ana ekran göstergesinin üzerine oturur, formun son alanını örter ya da tarayıcı araç çubuğuyla çakışır ve okuyucu tam uzandığı denetimi kaybeder. Desteklenen en küçük yükseklikte, klavye açıkken test edin ve bir giriş alanı odaktayken çubuğu gizleyin ki kişinin yazdığı şeyle asla yarışmasın.

İkincisi, çubuğu ilk pikselden itibaren yapıştırmaktır; böylece ekranda zaten duran kahraman düğmesini tekrarlar ve gerekmeden önce aşınmaya başlar. Bunun yerine özgün eylem çağrısının görünüm penceresinden çıktığı derinlikte yapıştırın. Buna yakın bir alışkanlık, çubuğu başlık, ikincil bağlantı ve geri sayımla doldurmaktır; bu, sessiz bir hatırlatmayı görülür görülmez kapatılan bir reklama çevirir.

Sıkça sorulan sorular

Sticky bar'lar mobil kullanılabilirliğe zarar verir mi?

İçeriği kapatır veya yerel tarayıcı kontrolleriyle örtüşürse kullanılabilir ekranı küçülterek zarar verebilir. İnce tutun, farklı cihazlarda test edin ve mobil ziyaretçileri rahatsız etmemek için kapatmaya izin verin.

Bir sticky bar'da kaç CTA olmalı?

Bir. Sticky bar işe yarar çünkü tek ve tekrar eden bir eylemi görünür tutar; seçenek eklemek bu odağı zayıflatır. Daha fazlasına ihtiyacınız varsa tıklamayı seçenek sunan bir sayfaya yönlendirin.

Sticky bar ile hello bar arasındaki fark nedir?

Yerleşim ve davranış. Hello bar belgenin üstünde durur ve içerikle birlikte kayıp gider, yani varışta iş görür. Sticky bar görünüm penceresine sabitlenir ve her kaydırma derinliğinde görünür kalır, yani okuma sırasında ve sonrasında iş görür. Çoğu sayfa birini seçer; ikisini birden kullanmak genelde kazandırdığından fazla yer götürür.

Sticky bar üstte mi altta mı olmalı?

Mobilde genelde alt daha iyidir; başparmak ekranın altına yakın durur ve üst kısmı tarayıcı çubukları kaplar. Masaüstünde üst daha güvenlidir; orada alttaki çubuk hiçbir şeyle yarışmaz ama yine de bir katman gibi okunur. Hangi kenarı seçerseniz seçin, sabit bir piksel boşluğu varsaymak yerine cihazın güvenli alanlarına göre kontrol edin.

Hangi kaydırma derinliğinde görünmeli?

Özgün eylem çağrısının görünüm penceresinden çıktığı noktada; çoğu yerleşimde bu yüzde on beş ile otuz arasındadır. Bu noktayı kendi sayfanızda ölçmek, hazır bir yüzdeyi kopyalamaktan iyidir, çünkü kahraman bölümünün yüksekliği çok değişir. Erken görünmek görünen düğmeyi tekrarlar; çok geç görünmek sayfanın bir bölümünü erişilebilir eylemsiz bırakır.

Mobil içeriği örtmesini nasıl engellerim?

Sayfaya çubuğun yüksekliği kadar alt boşluk ekleyin ki son öğe onun üstüne kaydırılabilsin ve sabit bir boşluk yerine cihazın güvenli alan değerini kullanın. Herhangi bir giriş alanı odaktayken çubuğu gizleyin, çünkü ekran klavyesi görünüm penceresinin çoğunu zaten alır. Bağlantıların alt kenarda kümelendiği alt bilgiyi de yeniden kontrol edin.

Sticky bar içinde form alanı olabilir mi?

Tek bir alan ve bir düğme sığar, ama bu nadiren doğru seçimdir. Sabit bir öğedeki alana odaklanmak klavyeyi açar; klavye, zaten görünüm penceresine sabitlenmiş bir çubuğun etrafındaki yerleşimi yeniden akıtır ve bazı mobil tarayıcılarda alan klavyenin altına kayar. Çubuğu form olmak için değil, form açmak için kullanın.

Sticky bar SEO'ya zarar verir mi?

Doğrudan değil, ama arama motorlarının ölçtüğü deneyim sinyalleri üzerinden verebilir. Küçük bir görünüm penceresinin büyük bölümünü kaplayan ya da ana içeriği gizleyen bir çubuk, yönergelerin adını koyduğu rahatsız edici ara katman tanımına girer. İnce ve kapatılabilir tutun, telefonda ana içeriğin ekranda hâlâ baskın olduğunu doğrulayın.

İlgili terimler

Sözlük teorisini nitelikli müşteri adaylarına dönüştürün

Dakikalar içinde, kod gerektirmeden müşteri adaylarını niteleyen ve toplayan bir scorecard quiz hunisi oluşturun.

Ücretsiz başla
  • Kredi kartı yok
  • Ücretsiz plan
  • Dakikalar içinde yayında