Konu Başlıkları
Yükleniyor...

Carousel Ana Sayfada Gerçekten Yer Kazandırır mı?

Carousel mı hero görsel mi: çerçeve sayısı, otomatik geçiş ve erişilebilirlik

Carousel, ana sayfanın en değerli alanında birden fazla mesajı sırayla göstermeye çalışır. Çoğu kurumsal sitede bunu kullanıcı için değil, hangi içeriğin üstte duracağı konusunda anlaşamayan ekipler için yapar. Sorulması gereken şey şu: o kayan çerçeveleri kim görüyor ve görmek için ne kadar beklemesi gerekiyor?

Carousel neyi çözüyor, neyi erteliyor?

Carousel'in savunması hep aynıdır: sınırlı alanda daha çok içerik. Pratikte işlevi genelde başka oluyor. Pazarlama, ürün ve kurumsal iletişim aynı alanı istediğinde, kimsenin hayır cevabı almak zorunda kalmadığı bir uzlaşma noktası sunuyor. Öncelik belirlenmiş olmuyor, sadece sıraya diziliyor.

Peki ya o sıra okunmuyorsa? Öncelik kararı ertelenmiş değil, ilk çerçeveyi kim kaptıysa onun lehine sessizce verilmiş olur.

Son çerçeveyi gören var mı?

Beş çerçeveli, çerçeve başına beş saniye bekleyen bir carousel'in tam turu 25 saniye sürer. Dördüncü çerçeveyi görmek için ziyaretçinin o alana 15 saniye bakması, beşinciyi görmek için 20 saniye bakması gerekir. Ana sayfaya gelen biri bu süreyi ekranın üst bandına ayırmıyor; aşağı kaydırıyor, menüye gidiyor ya da arama kutusuna tıklıyor.

Yani çerçeve eklemek içeriği göstermiyor, görünme olasılığını bölüyor. Buradan çıkan kural, yaygın söylendiği gibi beşten fazla çerçeve kullanmamak değil. Daha sert bir kural: ilk çerçevede olmayan hiçbir mesajın görüldüğünü varsaymayın. İkincisi zaten belirsiz, sonrası tamamen şans.

Otomatik geçişin bedeli

Otomatik geçişi varsayılan olarak açık bırakmam. Açık bırakılacaksa faturası da birlikte gelir: duraklatma kontrolü, klavye odağının kayan çerçeveyle birlikte sürüklenmemesi, ekran okuyucuya değişimin düzgün bildirilmesi.

Bu bir tercih meselesi de değil üstelik. WCAG'ın 2.2.2 ölçütü (Pause, Stop, Hide), kendiliğinden başlayan ve beş saniyeden uzun süren hareketli içerik için kullanıcıya durdurma imkanı sunulmasını ister. Otomatik geçişli bir carousel tam olarak bu tanıma girer. Buna bir de hareket hassasiyeti olan kullanıcılar için prefers-reduced-motion kontrolünü ekleyin.

Bir ayrıntı daha: kullanıcı üçüncü çerçevedeki bağlantıya uzanırken çerçeve değişirse, tıklamayı kaybetmekle kalmaz, nereye gittiğini de bilmez. Fareyle üzerine gelindiğinde ve bir kontrol odak aldığında geçiş durmalı.

Rehberlerin söylemediği çelişki

Carousel tavsiyelerinin neredeyse tamamında şu madde vardır: carousel'deki önemli mesajlar sayfanın başka bir yerinde de bulunsun. Tavsiye doğru, ama kabul ettiği şeyi yüksek sesle söylemiyor.

Mesajı ikinci kez yazdığınız anda carousel'in alan kazandırma iddiası düşer. Elde kalan şey, iki yerde duran aynı içerik ve bakımı iki katına çıkmış bir bölümdür. Bunu tersinden kurmak daha tutarlı: asıl yer aşağıdaki bölüm olsun, carousel kalacaksa vitrin olarak kalsın. Bir mesaj sadece carousel'de yaşıyorsa, o mesaj yayında sayılmaz.

Hero görsel nerede duruyor?

Tek bir net mesajınız varsa hero görsel neredeyse her zaman daha iyi iş görür: tüm alan tek başlığa ve tek aksiyona çalışır, kimse ikinci çerçeveyi beklemez. Carousel ancak gerçekten ayrı kitlelere ayrı giriş kapıları açtığınızda anlamlı olur, mesela aynı sitede hem bireysel hem kurumsal müşteriye hitap ediyorsanız.

Bu durumda bile kaydırma en iyi çözüm olmak zorunda değil. Aynı anda görünen iki kart, sırayla görünen beş çerçeveden daha fazla bilgi taşır; kullanıcı karşılaştırma yapabilir, beklemek zorunda kalmaz.

Peki ya duyurulacak beş kampanya varsa? O zaman soru carousel sorusu olmaktan çıkar. Ana sayfa beş kampanyanın yeri mi, yoksa bir kampanyalar sayfasının mı?

Carousel kalacaksa

  • Kaç çerçeve olduğu ve hangisinde olunduğu görünsün. Anlamsız noktalar yerine kısa etiketler kullanın; kullanıcı atlamak istediği yere doğrudan gidebilsin.
  • Kontroller carousel alanının içinde, parmak boyutunda ve arka plandan ayrışacak kontrastta olsun. Görselin üstüne bindirilmiş soluk oklar dokunmatikte çalışmaz.
  • Çerçeve başlıkları aynı kalıpta yazılmasın. Üç çerçevede üç benzer başlık, kullanıcıya hiçbir şeyin değişmediği izlenimi verir.
  • Yalnızca ilk çerçevenin görseli öncelikli yüklensin, kalanı tembel yüklemeye bırakılsın. Beş büyük görseli birlikte indirmek, görülmeyecek içerik için ilk ekranın hızını harcamaktır.

Bu maddelerin tamamı carousel'i iyi yapmaz, yalnızca zararını azaltır. Carousel'i gerçekten iyi yapan tek şey, ilk çerçevenin tek başına yeterli olmasıdır.