E-Ticaret Slider Nasıl Hazırlanır? Ana Sayfa Slider Boyutları, Mobil Görsel, Geçiş Ayarları ve Sayfa Hızı Uygulamalı Rehber, Döngü Süresi Hesaplayıcısı ve Slider Denetimi

Ziyaretçi ana sayfanıza geldiğinde ilk gördüğü şey çoğu zaman slider olur. Doğru hazırlanmış bir slider kampanyayı, yeni sezonu ya da en çok satan kategoriyi bir bakışta anlatır. Yanlış hazırlanmışı ise telefonda kırpılır, sayfayı yavaşlatır, tıklanınca hata sayfasına götürür ve ilk izlenimi bozar.

Bu rehberde e-ticaret slider nasıl hazırlanır, hangi boyutta görsel gerekir, masaüstü, tablet ve mobil için neden ayrı görsel yüklenir, geçiş süresi ve efekt nasıl seçilir, slider sayfa hızını nasıl etkiler ve Faprika'da slider adım adım nasıl yönetilir sorularının cevabını bulacaksınız. Slider döngü süresini hesaplayan bir araç ve bir kontrol listesi de var.

E-Ticaret Slider Nedir?

Slider, ana sayfanın üst bölümünde birden fazla görselin sırayla ya da kullanıcı kaydırdıkça gösterildiği dinamik vitrin alanıdır. Her görsel bir kampanyayı, kategoriyi, ürünü ya da duyuruyu tanıtır ve tıklanınca ilgili sayfaya götürür.

Slider tek bir ekran alanında birden fazla mesajı sunar. Bu onun gücü ve aynı zamanda riskidir: Her slayt dikkat için diğerleriyle yarışır, ziyaretçi hepsini görmeyebilir. İyi slider, az sayıda net slayttan oluşur.

Slider ile Banner Arasındaki Fark Nedir?

Banner tek bir sabit görseldir; slider ise birden fazla banner'ı sırayla gösteren yapıdır. Tek bir kampanyayı vurgulamak istiyorsanız banner, birkaç farklı mesajı aynı alanda vermek istiyorsanız slider kullanılır.

Okumanızı öneririzE-Ticaret Ana Sayfa Tasarımı ve Vitrin Yönetimi: Ana Sayfa Vitrini Nasıl Düzenlenir? Bölümler, Sıralama, Mobil, Hız ve Kampanya Takvimi Uygulamalı Rehber, Ürüne Geçiş Hesaplayıcısı ve Ana Sayfa Denetimi

Slider Neden Önemlidir?

Slider ana sayfanın en görünür alanını kaplar; bu alanı nasıl kullandığınız mağazanın ilk izlenimini belirler. Dört nedenle önemlidir.

• İlk izlenimi kurar: Ziyaretçi mağazanın ne sattığını ve neyin öne çıktığını ilk bakışta anlar.
• Kampanyayı görünür kılar: İndirim ya da yeni sezon duyurusu aranmadan karşıya çıkar.
• Trafiği yönlendirir: Her slayt ziyaretçiyi kategori ya da ürün sayfasına taşıyan bir kapıdır.
• Sayfa hızını etkiler: En büyük görseller burada olduğu için yanlış hazırlanan slider sayfayı yavaşlatır.

Sayfa hızının satışa etkisini E-Ticarette Site Hızı Neden Önemlidir? yazısında okuyabilirsiniz.

Slider Kaç Slayttan Oluşmalı?

Çoğu mağaza için üç ile beş slayt yeterlidir. Slayt sayısı arttıkça son slaytlara ulaşmak uzun sürer, ziyaretçinin çoğu hepsini görmeden sayfada ilerler ve sayfa ağırlığı büyür. Genel ilke şudur: En önemli mesaj ilk slaytta olmalı, her slayt tek bir iş yapmalıdır.

Slaytları şu sırayla düşünebilirsiniz: Önce en büyük kampanya, sonra en çok satan kategori, ardından yeni gelenler ve güven veren bir mesaj (ücretsiz kargo ya da kolay iade gibi, yalnız gerçekten sunduğunuz bir şey). Her slayt için “ziyaretçi buraya tıklayınca ne bulacak?” sorusunun cevabı net olmalıdır.

Okumanızı öneririzE-Ticaret Kampanya Takvimi: Yıl Boyu Satış Getiren Kampanya Planı Nasıl Hazırlanır?

Slider Görseli Hangi Boyutta Hazırlanmalı?

Slider görselinin boyutu, görselin gösterileceği cihaza ve slider'ın yerleşimine bağlıdır. Faprika'da tam ekran slider için masaüstünde 1920×400, tablette 1200×400, mobilde 768×500 piksel; sayfa ortasına hizalı slider için 1100×550 piksel önerilir. Doğru ölçüde hazırlanan görsel kırpılmaz ve bulanıklaşmaz.

Görseli bu ölçülerde hazırlarken önemli metni ve ürünü görselin ortasına yakın tutun. Tam ekran görseller farklı ekran genişliklerinde kenarlardan biraz kırpılabilir; kenara yakın yazılan söz ya da logo kaybolabilir.

İyi Bir Slider Görselinde Neler Olmalı?

İyi slider görseli tek bir mesaj taşır, okunaklıdır ve bir eylem çağrısı içerir. Ziyaretçinin bir saniyede “ne sunuluyor, bana ne faydası var, ne yapmalıyım” sorularını cevaplayabilmesi gerekir.

• Tek mesaj: Bir görselde bir kampanya ya da bir fikir olsun.
• Kısa ve büyük metin: Telefonda küçülünce de okunabilen birkaç kelime yazın.
• Yüksek kontrast: Metin arka plandan net ayrılmalı.
• Net eylem: “Hemen incele” gibi tıklamayı çağıran kısa bir ifade ekleyin.
• Kaliteli ürün görseli: Bulanık ya da gerilmiş görsel mağazaya güveni azaltır.

Okumanızı öneririzÜrün Fotoğrafı Nasıl Çekilir? Telefonla E-Ticaret Ürün Fotoğrafı Rehberi

Neden Her Cihaz İçin Ayrı Görsel Gerekir?

Tek bir yatay görsel telefonda ya küçülüp okunmaz hale gelir ya da kırpılıp mesajı keser. Her cihaz için ayrı görsel yüklemek, görselin her ekranda kırpılmadan ve doğru ölçüde görünmesini sağlar. Aynı zamanda telefona gereksiz büyük görsel indirmeyerek veri tüketimini ve yükleme süresini azaltır.

Faprika'da her slider görseli için masaüstü, tablet ve mobil cihaz seçimi yapabilirsiniz. Yalnızca “Masaüstü” seçtiğiniz görsel sadece masaüstünde, yalnızca “Mobil” seçtiğiniz görsel sadece mobil cihazlarda görünür. Böylece her cihaza özel hazırlanmış görseli o cihazın ziyaretçisi görür.

Telefonda görünümün neden bu kadar önemli olduğunu E-Ticaret Sitesinde Mobil Uyumun Önemi yazısında okuyabilirsiniz.

Slider Yönlendirme Adresi Nasıl Verilir?

Slider adresi, müşteri slayda tıkladığında gideceği sayfayı belirler. Faprika'da bu alana adresin tamamını değil, alan adından sonraki kısmı (“/” işaretinden sonrasını) yazmanız yeterlidir. Bu alan boş bırakılmamalıdır: adres tanımlanmazsa slayda tıklayan müşteri hata sayfasına yönlendirilir.

Slaytı genel bir sayfaya değil, mesajın söz verdiği yere yönlendirin. “Elbise indirimi” yazan bir slayt doğrudan elbise kategorisine, “yeni gelen ayakkabılar” yazan slayt ilgili kategoriye gitmelidir. Ziyaretçi söz verilen ürünü ilk tıklamada görmezse slider tıklama kazandırsa bile satış kazandırmaz.

Slayt Adı Ne İşe Yarar?

Faprika'da slayta isteğe bağlı bir ad verebilirsiniz. Bu alan doldurulmak zorunda değildir ama listede slaytları ayırt etmek için işe yarar. “Kış sezonu açılışı” ya da “Ücretsiz kargo duyurusu” gibi kampanyayı anlatan adlar, birkaç ay sonra hangi slaydın hangi kampanyaya ait olduğunu hatırlamayı kolaylaştırır.

Otomatik Geçiş, Bekleme Süresi ve Efekt Nasıl Ayarlanır?

Slider ayarları slaytların ne kadar süre ekranda kalacağını, nasıl geçileceğini ve hangi efektle değişeceğini belirler. Faprika'da bu ayarlar Yapılandırma, Ayarlar, Slider Ayarları bölümündedir ve kaydedilen değişiklik tüm sliderlar için geçerli olur.

Bekleme Süresi Ne Kadar Olmalı?

Bekleme süresi, görseldeki mesajın rahatça okunabileceği kadar uzun olmalıdır. Metin ne kadar uzunsa süre o kadar uzun olmalı; ama süre uzadıkça son slaytlara ulaşma süresi de uzar. Süre ile slayt sayısı birlikte düşünülmelidir.

Aşağıdaki araç slayt sayısını, bekleme ve geçiş sürelerini ve görsel boyutunu girerek bir tur süresini, son slayta kadar geçen süreyi ve toplam görsel ağırlığını hesaplar. Bekleme ve geçiş süreleri Faprika'daki gibi milisaniye cinsindendir (1000 milisaniye bir saniyedir).

Aracın sonucunu mağazanızın ziyaretçi davranışına göre yorumlayın. Ziyaretçilerin ana sayfada ne kadar kaldığını biliyorsanız, slider'ın tamamının görülmesi için o süreden uzun bir döngü kurmayın. Bilmiyorsanız en önemli kampanyayı ilk slayda koymak her durumda doğru karardır.

Hangi Geçiş Efekti Seçilmeli?

Faprika'da Slide, Fade, Cube, Coverflow ve Flip efektlerinden biri seçilebilir. Çoğu mağaza için sade efektler (kayma ya da yumuşak geçiş) en doğru seçimdir: Ziyaretçi mesaja odaklanır, efektin kendisine değil. Küp ya da çevirme gibi gösterişli efektler dikkat dağıtabilir ve yavaş cihazlarda takılma hissi yaratabilir.

Slider Sayfa Hızını Nasıl Etkiler?

Slider ana sayfanın en büyük görsellerini taşır; bu yüzden yanlış hazırlanırsa sayfayı yavaşlatan ilk unsur olur. Hız için iki kural geçerlidir: Görseli gerektiğinden büyük yüklemeyin ve her cihaza uygun ölçüde görsel kullanın.

• Dosya boyutunu küçük tutun: Görseli yüklemeden önce sıkıştırın; gözle fark edilmeyen kalite kaybı çoğu zaman dosyayı ciddi biçimde küçültür.
• Cihaza uygun görsel kullanın: Telefona masaüstü ölçüsünde görsel indirmek gereksiz veri tüketir; cihaza özel görsel bunu önler.
• Slayt sayısını sınırlı tutun: Her slayt görseli toplam sayfa ağırlığına eklenir.
• İlk slaydı en iyi hazırlayın: Sayfa açılırken ilk görünen görsel hız algısını belirler.

Görsel sıkıştırma ve format seçimi için Ürün Görseli Optimizasyonu Nasıl Yapılır? E-Ticarette Boyut, Format (WebP), Dosya Adı ve Alt Metin Uygulamalı Rehber rehberine bakabilirsiniz.

Slider Hangi Hatalarla Bozulur?

Slider hataları çoğunlukla küçük ihmallerden doğar; ama ana sayfanın en görünür yerinde olduğu için etkileri büyüktür. En sık görülen hatalar şunlardır:

• Yönlendirme adresini boş bırakmak: Slayta tıklayan müşteri hata sayfasına düşer.
• Tek yatay görseli her cihazda kullanmak: Telefonda mesaj kırpılır ya da okunmaz.
• Çok fazla slayt eklemek: Son slaytlar hiç görülmez, sayfa ağırlaşır.
• Bitmiş kampanyayı yayında bırakmak: Güveni zedeler ve hayal kırıklığı yaratır.
• Görsele çok metin sıkıştırmak: Telefonda okunmaz ve kalabalık görünür.
• Gösterişli efektle mesajı gölgelemek: Ziyaretçi efektle ilgilenir, teklifle değil.

Slider Kontrol Listesi

Slider'ı yayına almadan önce aşağıdaki listeden geçin. Her madde “evet” olduğunda slider hem ziyaretçi hem sayfa hızı için hazırdır.

Faprika'da Slider Nasıl Yönetilir?

Faprika'da slider'ı kod yazmadan, panelden yönetirsiniz. Görselleri İçerik Yönetimi, Slider Yönetimi bölümünden yüklersiniz; görünüm ve geçiş ayarlarını ise Yapılandırma, Ayarlar, Slider Ayarları bölümünden belirlersiniz.

• Sürükle bırak yükleme: Birçok görseli saniyeler içinde tek seferde yükleyebilirsiniz.
• Cihaza özel görsel: Her görsel için masaüstü, tablet ve mobil cihaz seçimi yapabilirsiniz.
• Tam ekran ya da ortalı yerleşim: Tasarım tercihinize göre geniş bir slider ya da sade ve ortalı bir yapı seçebilirsiniz.
• Slayt adı ve yönlendirme adresi: Slayta isteğe bağlı bir ad verir, tıklanınca gidilecek kategori ya da ürün sayfasının adresini girersiniz.
• Otomatik geçiş ayarları: Bekleme süresini, geçiş süresini ve efekti (Slide, Fade, Cube, Coverflow, Flip) belirlersiniz.
• Genişlik ve yükseklik: Slider'ın sitede kapladığı alanı piksel olarak ayarlarsınız.

Slider ayarları tüm sliderlar için geçerlidir; yani bekleme süresi ya da efekti tek tek slayt için değil, bütün slider için belirlersiniz. Bu yüzden ayarı değiştirdikten sonra ana sayfayı hem masaüstünde hem telefonda açıp denemeniz iyi olur. Panelin tüm ayrıntıları için Slider Yönetimi ve Slider Ayarları Yönetimi eğitim sayfalarına bakabilirsiniz.

Okumanızı öneririzDuyuru Yönetimi Nedir? E-Ticaret Sitesinde Duyuru ve Kampanya Bildirimi Nasıl Yapılır?

Faprika ile Ana Sayfa Vitrini Nasıl Yönetilir?

Faprika, ana sayfa vitrinini panelden yönetmenizi sağlar. Slider bu vitrinin yalnız bir parçasıdır; menü, duyuru, kategori ve ürün alanlarıyla birlikte düşünülmelidir. Başlıca seçenekler şunlardır:

• Slider Yönetimi: Cihaza özel slider görsellerini sürükle bırakla yükler ve adreslerini girersiniz.
• Slider Ayarları: Geçiş, bekleme süresi, efekt ve boyutu tek yerden belirlersiniz.
• Menü yönetimi: Menü başlıklarını ve kampanya görsellerini düzenlersiniz.
• Duyuru yönetimi: Sayfa üstünde kısa, zamanlı duyurular gösterirsiniz.
• Medya ve içerik yönetimi: Görselleri ve içerik sayfalarını panelden yönetirsiniz.

Hangi özelliklerin hangi pakette yer aldığını e-ticaret paketleri karşılaştırmasında görebilirsiniz.

Okumanızı öneririzE-Ticaret Sitesi Menü Yapısı Nasıl Olmalı? Ana Menü, Mega Menü ve Kategori Düzeni Rehberi

Sıkça Sorulan Sorular

E-ticaret slider nedir?

Slider, ana sayfanın üst bölümünde birden fazla görselin sırayla gösterildiği dinamik vitrin alanıdır. Her görsel bir kampanyayı, kategoriyi ya da duyuruyu tanıtır ve tıklanınca ilgili sayfaya götürür.

Slider görseli hangi boyutta olmalı?

Faprika'da tam ekran slider için masaüstünde 1920×400, tablette 1200×400, mobilde 768×500 piksel; ortalı slider için 1100×550 piksel önerilir. Doğru ölçü görselin kırpılmasını ve bulanıklaşmasını önler.

Slider için neden ayrı mobil görsel gerekir?

Yatay bir görsel telefonda küçülür ya da kırpılır. Mobil için ayrı görsel yüklemek mesajın küçük ekranda okunmasını sağlar ve telefona gereksiz büyük dosya indirilmesini önleyerek veri tüketimini azaltır.

Slider adresi boş kalırsa ne olur?

Faprika'da slider adresi mutlaka tanımlanmalıdır. Adres verilmezse slayta tıklayan müşteri hata sayfasına yönlendirilir. Adresi yazarken alan adından sonraki kısmı (“/” sonrası) girmeniz yeterlidir.

Slider kaç slayttan oluşmalı?

Çoğu mağaza için üç ile beş slayt yeterlidir. Slayt sayısı arttıkça son slaytlar görülmez ve sayfa ağırlaşır. En önemli mesajı ilk slayda koyun ve her slaydı tek bir mesaja indirin.

Faprika'da slider geçiş efekti nasıl seçilir?

Yapılandırma, Ayarlar, Slider Ayarları bölümünden Slide, Fade, Cube, Coverflow ya da Flip efektlerinden birini seçebilirsiniz. Bekleme ve geçiş süresini de aynı yerden milisaniye cinsinden belirlersiniz; değişiklik tüm sliderlar için geçerli olur.

İlginizi Çekebilecek Yazılar

• E-Ticaret Ana Sayfa Tasarımı ve Vitrin Yönetimi: Ana Sayfa Vitrini Nasıl Düzenlenir? Bölümler, Sıralama, Mobil, Hız ve Kampanya Takvimi Uygulamalı Rehber, Ürüne Geçiş Hesaplayıcısı ve Ana Sayfa Denetimi
• E-Ticaret Kampanya Takvimi: Yıl Boyu Satış Getiren Kampanya Planı Nasıl Hazırlanır?
• Ürün Görseli Optimizasyonu Nasıl Yapılır? E-Ticarette Boyut, Format (WebP), Dosya Adı ve Alt Metin Uygulamalı Rehber
• E-Ticaret Sitesinde Mobil Uyumun Önemi