Aşağıdaki makale size yardımcı olacaktır:BigCommerce Site Hızınızı Artıracak 10 Hızlı Strateji
BigCommerce, e-ticaret markalarına mükemmel alışveriş özellikleri ve site ziyaretçilerine heyecan verici müşteri deneyimleri sunma yeteneği sağlar.
Mağazanızı ihtiyaçlarınıza göre uyarlamak için hizmet ve işlevsellik ekleyebileceğiniz esnek bir platformdur.
Ancak çoğu yerel e-ticaret mağazasında olduğu gibi, tam olarak istediğiniz site deneyimini elde etmek için gerekli özellikleri eklemek işleri yavaşlatabilir.
Bugün bir marka olarak farklılaşmak ve rekabet edebilmek için her müşteriye unutulmaz, kişiselleştirilmiş deneyimler sunmanın yanı sıra bu deneyimleri hızlı bir şekilde sunmanız da gerekiyor.
Pek çok perakendeci, ziyaretçi beklentilerini karşılamak, SERP’de iyi bir sıralamaya sahip olmak ve dönüşüm oranlarının artmasını sağlamak için saniyenin altında yükleme süresi sağlamanın yollarını arıyor.
Neyse ki BigCommerce ile mağazanızın ön ucunun arka ucundan ayrı çalıştığı başsız bir mimariye geçerek olağanüstü alışveriş deneyimleri yaratabilir ve hızlı yüklenen bir site sunabilirsiniz.
Başsız kalmak, BigCommerce site hızını ödün vermeden artırmanın kesin yoludur— toplam vitrin kontrolü için hepsi bir arada ön uç çözümüyle birleştirilmiş üst düzey bir e-ticaret platformu.
Ancak BigCommerce mağazanızı başsız bırakmaya hazır değilseniz, mağazanızın hızını artırmak için size diğer seçenekleri sunuyoruz.
Bu yazıda şunları ele alacağız:
#cta-visual-fe#
BigCommerce’de yavaş site hızının nedenleri
Yavaş bir web sitesine birçok şey katkıda bulunur. En büyük suçlular:
- Büyük resimler
- Dinamik site içeriği
- Temanızdaki ekstra kod
- Eklentilerden JavaScript
- Sunucu yanıt süresi
- Yüksek site trafiği
Neyse ki mağazanızı yavaşlatan şeylerin çoğu çözülebilir. Ancak öncelikle onu aşağıya çeken şeyin ne olduğunu tam olarak belirlemelisiniz.
BigCommerce sitenizin hızını nasıl test edersiniz?
BigCommerce hız optimizasyonu, onu aşağıya çeken şeylerin belirlenmesine bağlıdır.
Yaygın suçlular olsa da, her sitenin kendine has sorunları var. Neyse ki, hız testleri internetin her yerinde bulunabilir ve bunlar, yavaşlayan sitenizi tam olarak neyin rahatsız ettiğini size söyleyecektir.
Sadece sayfa URL’nizi girmeniz yeterlidir; o, diğer kullanıcıların yaptığı gibi yüklemeyi deneyecek ve sayfa tamamen yüklenene kadar belirli öğelerin görünmesi için geçen süreyi ölçecektir.
Kullanılacak site hızı testleri
Sayfa yükleme hızınızın doğru ölçümünü elde etmek için güvenebileceğiniz bir hız testi kullanmak isteyeceksiniz.
Sonuçların ne kadar tutarlı olduğunu görmek için aynı sayfada birden fazla testi denemek kötü bir fikir değildir. Sitenize farklı konumlardan ve sunuculardan farklı testler erişecek ve bu da size farklı sonuçlar verebilecektir.
İşte en iyi ücretsiz hız testlerinden bazıları:
Her testin kendi formatı vardır, ancak hepsi sitenizin ne kadar hızlı olduğuna (bir notla birlikte) ve hangi öğelerin sitenizin hızını düşürdüğüne dair bir rapor verir.
Artık hız raporunuzu aldığınıza göre, bu notu annenizin gurur duyacağı bir seviyeye dönüştürmek için bazı ipuçlarına bakalım.
BigCommerce site hızını artırmak için 10 önemli ipucu
BigCommerce mağazanızın iç işleyişine ve nasıl optimize edileceğine derinlemesine girmeden önce site hızınızı hızlı bir şekilde artırmak için yapabileceğiniz bazı şeyler var.
Aşağıda asılı olan meyveyle başlayacağız ve daha önemli sorulara doğru ilerleyeceğiz.
Son blog gönderilerinin görüntülenmesini kapat
Bazı BigCommerce temaları, sayfalarınızın altbilgisinde son blog gönderilerinizin bir listesini, bu gönderilerden içerik parçacıklarıyla birlikte görüntüler.
Ancak bu bilgilerin yüklenmesi değerli zaman alır ve dikkati müşteri deneyiminin diğer yönlerinden uzaklaştırabilir.
Yapabilirsiniz bu özelliği kapat Stencil teması kullanıyorsanız Sayfa Oluşturucu’da. Blueprint temasını kullanıyorsanız kapatmak için ekran ayarlarına gidin.
Google AMP’yi etkinleştirin
Hızlandırılmış Mobil Sayfalar (veya AMP) sitenizin Google tarafından önbelleğe alınan ve sunulan sayfalarıdır (AMP, Google’ın web için kullanıcı odaklı deneyimler oluşturmaya yönelik bir çerçevesidir).
Bu sayfaların yüklenmesi neredeyse anında gerçekleşir ve size büyük bir hız artışı sağlar.
Sayfa yüklemeleri çok hızlı gerçekleştiğinden ve kullanıcılar beklemediğinden hemen çıkma oranınız muhtemelen düşecektir.
BigCommerce bir ürün üretti adım adım rehber AMP’nin çevrimiçi mağazalarında nasıl etkinleştirileceği hakkında bilgi edinin; bu, dönüşümler için uygulamayı göz önünde bulunduracak iyi bir hız düzeltmesidir.
Mağaza kodunu küçült
CSS, HTML ve JavaScript kodu her zaman mümkün olan en verimli şekilde yazılmaz.
Biraz kodlama deneyiminiz varsa, bunu kendiniz düzenleyebilir veya BigCommerce mağaza kodunuzu çalıştırıp gereksiz boşlukları, satırları ve metinleri kontrol etmesi için bir geliştirici kiralayabilirsiniz.
BigCommerce’in CDN’sinden yararlanın
Büyük veya ölçeklenen bir markaysanız müşterileriniz (büyük olasılıkla) dünyanın her yerinde bulunacaktır.
Bu harika bir haber ancak sitenizi sunucularınızdan binlerce kilometre uzaktaki yerlerden ziyaret eden müşteriler için site performansını yavaşlatabilir.
Bu e-ticarette yaygın bir sorundur.
Çoğu çevrimiçi işletme bunu aşıyor site sayfalarının sürümlerini önbelleğe almak için bir içerik dağıtım ağı (CDN) kullanma müşterilerine daha yakın sunucu ağlarında.
Neyse ki BigCommerce, sunucuları içeren yerleşik bir CDN’ye sahiptir. Londra, Los Angeles, New York, Sidney, Tokyo, Sao Paulo, Hong Kong ve Singapurböylece üçüncü taraf bir CDN aramanıza gerek kalmaz.
Bu sunucu konumları çoğu perakendeci için müşterilere hizmet vermek için yeterli olmalıdır.
Üçüncü taraf uygulamaları sınırlayın
Geliştiricilerin uygulamalarını ekleyerek BigCommerce mağazanızın işlevselliğini genişletme eğiliminde olabilirsiniz.
Bu eklentiler müşteri deneyimine büyük katkı sağlayabilir ancak çok fazla olması sitenizin performansını ve hızını önemli ölçüde düşürebilir.
Üçüncü taraf uzantıların denetimini yapın Hangilerinin iyi performans gösterdiğini, hangilerinin yüklenmesinin en uzun sürdüğünü ve hangileri olmadan yaşayabileceğinizi görmek için.
Üçüncü taraf uygulamalar ve eklentiler genellikle yavaşlamaların başlıca suçlularıdır.
Resimlerinizi optimize edin
İçerik açısından zengin bir site, olağanüstü bir müşteri deneyimi için çok önemlidir, ancak çok fazla ağır resim, video ve animasyon hızınızı düşürecektir.
Büyük boyutlu resim dosyaları BigCommerce sayfa hızınızı yavaşlatan en büyük unsur olabilir.
Neyse ki bu aynı zamanda düzeltilmesi en kolay şeylerden biri. BigCommerce yararlı bir şekilde şunları sağlar: özellikler optimum görüntü boyutu ve sizinkini nasıl düzeltebileceğiniz için:
- Önerilen maksimum özellikleri 280 x 1280 pikseldir. Bunun üzerinde herhangi bir şey veri israfıdır ve yalnızca belirli bir görüntünün daha yavaş yüklenmesine neden olur; bu size daha yüksek bir kalite sağlamayacaktır.
- BigCommerce’in resim yöneticisi Akamai, resimleri otomatik olarak yeniden boyutlandırmalı, ancak Yüklemeden önce görselleri photoshop veya benzeri görsel sıkıştırma araçlarıyla sıkıştırmak en iyi uygulamadır.
- Görüntüleri ‘tembel yüklemek’ isteyeceksiniz. Bu, ilk başta sitenizde yalnızca ekranın üst kısmındaki görsellerin yükleneceği, diğerlerinin ise ziyaretçi sayfayı aşağı kaydırdığında yükleneceği anlamına gelir.
Diğer dosyaları sıkıştır
Sadece görüntüler değil. BigCommerce temaları genellikle kodların bir araya getirilmesiyle oluşturulur.
Bu paketler, özellikle de JavaScript dosyaları gereksiz derecede büyük olabilir ve yüklenmesi yavaş olabilir. Gibi sıkıştırma araçlarını kullanın Gzip onları mümkün olduğu kadar zayıflatmak.
Dinamik ana sayfa görüntülemelerini sınırlayın
BigCommerce şunları yapma olanağı sağlar: dinamik içeriği görüntüle ana sayfanızda yeni, öne çıkan ve en çok satan öğelerin yanı sıra ‘müşteriler de görüntüledi’ ve ‘ilgili öğeler’ için yuvalar bulunur.
Onlar sana tavsiyede bulunmak Optimum site performansı için bu öğelerin sayısını beşe veya daha aza indirmek.
#cta-paragraf-fe#Her zaman site hızı ve işlevsellik arasında ödün mü veriyorsunuz? Artık buna gerek yok! Önde gelen markaların neler yaptığını öğrenin, böylece tasarım ve performans artık bir denge olmaktan çıkar.
Kategori yapınızı optimize edin
Açık, hiyerarşik bir akışa sahip basit bir kategori yapısı, çevrimiçi mağazanıza düzen getirir ve ziyaretçilerin ve arama motorlarının ürünlerinizi daha kolay bulmasına yardımcı olur.
Örneğin, kahverengi deri ayakkabı ürün sayfasını ‘Ayakkabılar’ kategorisine atayabilirsiniz; diğer üst düzey kategorilerle birlikte ‘Ceketler’, ‘Spor Giyim’ vb. atayabilirsiniz.
Ancak çok fazla üst düzey kategoriye sahip olmak mağazanızın yükleme süresini yavaşlatır.
Bu sorunu aşmak için, çeşitli kategorileri nasıl daha düzenli üst kategoriler ve alt kategoriler halinde gruplandırabileceğinizi ve birleştirebileceğinizi düşünün.
Üst düzey kategorileri basitleştirin
Yukarıdaki örneğimizde kahverengi deri ayakkabıların altına oturabilir. Erkek → Ayakkabı → İş Ayakkabısı → Ürün sayfası (kahverengi deri ayakkabılar).
‘Erkek Ceketleri’, ‘Erkek Spor Giyim’ vb. için alt kategoriler oluşturabilirsiniz.
Her türlü giyim ve aksesuar için üst düzey kategoriler yerine, bunlar Erkek ve Kadın olarak basitleştirilmiştir.
Daraltılmış bir kategori yapısı, sonuçta sayfanızdaki üst düzey kategorilerin sayısını ve sitenizin yüklemesi gereken bilgi miktarını azaltır.
Menü görüntüleme derinliğini sınırlayın
Menünüzde görüntülenen kategorilerin sayısını da sınırlamanız gerekir.
Buna “menü görüntüleme derinliği” denir ve Sayfa Oluşturucu (Şablon) veya Kategoriler → Görüntü Ayarları (Taslak) bölümünde ayarlanabilir.
BigCommerce, optimum performans için görüntülenen menü sayısını yalnızca ikiyle sınırlamanızı önerir.
Örneğimiz, menünüzde en üst düzey kategori olan ‘Erkekler’in görüntüleneceği ve ‘Ayakkabılar’ ve ‘İş Ayakkabıları’nın da önceden yüklendiği anlamına gelir.
Müşterileriniz menü yapısı daraldıkça aradıkları ayakkabıyı yine takip ederek bulabilecekler.
Çoğu müşteri tarafından görülmeyecek olan tüm bu bilgilerin sitenize önceden yüklenmesi gerekmek yerine, bu menüler istek üzerine yüklenecektir.
Ürün filtrelemeyi uygulayın
Kategorilerinizin müşterilere gösterilme şeklini optimize etmek için daha da iyi bir çözüm, yönlü bir arama işlevi kurun—Müşterilerinizin arama yaparken stile, renge, fiyata vb. göre filtreleyebileceği yer.
BigCommerce bu işlevi çağırır Ürün Filtreleme ve uygulanmasını kolaylaştırdı.
BigCommerce sitenizi hızlandırmanın yanı sıra, ayrıntılı menülerin sağlayabileceğinden daha hızlı, daha tatmin edici bir kullanıcı deneyimi sağlar.
Bigcommerce temanızı güncelleyin
Bazı BigCommerce mağazaları hâlâ eski Blueprint tema motorunu temel alan temalar üzerinde çalışıyor. Bunlardan birini kullanıyorsanız yükseltme zamanı!
Blueprint temaları, yeni çerçeveleri Stencil’in işlevlerinin çoğunu desteklemiyor.
Ve bunu yaptıklarında BigCommerce ve üçüncü taraf geliştiricilerin güncel olmayan programlamayla çalışması çok daha zorlaşır.
Bu, düzeltmelerin ve geliştirmelerin Stencil temalarına göre daha az etkili ve daha az kullanılabilir olduğu anlamına gelir.
Yeni bir temaya geçmek küçük bir iş değilancak BigCommerce site hızınızı önemli ölçüde artırmak ve rakiplerinize ayak uydurmak istiyorsanız bu, üstlenmeniz gereken bir projedir.
BigCommerce Stencil’in Faydaları
Stencil, BigCommerce’in mevcut tema çerçevesidir ve Blueprint’e göre birçok avantajı vardır:
- Daha fazla işlevsellik – BigCommerce, AMP etkinleştirme ve gelişmiş satış yetenekleri de dahil olmak üzere Stencil’de yapabileceğiniz şeylerin sayısını artırdı.
- Açık kaynak kodu üzerine inşa edilmiştir – Bu, üçüncü taraf geliştiricilerin işlevsellik eklemesine ve tüm temaları oluşturmasına olanak tanır. Bu, BigCommerce’in müşterilerine sunduğu önceden oluşturulmuş temalarla sınırlı olmadığınız anlamına gelir.
- Sayfa Oluşturucu aracılığıyla kontrol edilir – Çok daha sezgisel olan Ne Görürsen Onu Alırsın (WYSIWYG) arayüzü, değişikliklerinizi kodlamanıza gerek kalmadan sayfa öğelerinizi ve tasarımınızı değiştirmenize olanak tanır.
- Duyarlı tasarımlar – Müşterileriniz sitenize ister mobilden, ister tabletten, ister masaüstünden erişiyor olsun, sayfalarınız doğru biçimlendirmeye göre ayarlanacaktır. Bu, tüm öğelerin yerine oturması ve çok daha hızlı bir şekilde etkileşimli hale gelmesi nedeniyle yükleme sürelerini önemli ölçüde etkiler.
- Aralarından seçim yapabileceğiniz daha geniş bir tema yelpazesi – Açık kaynak çerçevesi, temaların miktarının büyük ölçüde genişletildiği anlamına gelir.
Şu anda BigCommerce’in amiral gemisi Stencil teması, çeşitli seçeneklerle gelen ve ihtiyaçlarınıza göre özelleştirilebilen Cornerstone’dur.
BigCommerce temasını kullanırken dikkat edilmesi gerekenler
Her ne kadar Stencil, Blueprint’te büyük bir gelişme olsa ve BigCommerce temaları etkileyici miktarda işlevsellik sunsa da, mağazanızın temasını seçerken dikkat etmeniz gereken bazı konular var.
- BigCommerce temaları, çoğu modern ticaret platformu gibi, büyük miktarda içerik eklenmesine izin ver ve unutulmaz müşteri deneyimleri yaratmak için işlevsellik.
- Bu gelişmiş müşteri deneyimi de, çalışması için büyük miktarda JavaScript gerekirzamanla şişebilir, birikebilir ve site performansını önemli ölçüde etkileyebilir.
Sonuçta: Temanız tarafından eklenen kullanılmayan JavaScript ve CSS kodlarına dikkat edin.
Bunu boyutuna göre denetleyebilir ve düzenleyebilirsiniz, ancak işlevselliği ve optimum müşteri deneyimini sürdürmek için geliştiricinin yardımına ihtiyacınız olacak.
Temalarla ilgili en yaygın tuzaklardan kaçınmak için yukarıdaki en iyi içerik optimizasyonu uygulamalarını izleyin.
#cta-visual-fe#
BigCommerce mağazanızı ödün vermeden nasıl hızlandırırsınız?
Yukarıdaki ipuçlarının tümü BigCommerce mağazanızı hızlandırmanın harika yollarıdır, ancak çoğu, mağazanızdan gerçekten istediğiniz mağazacılık işlevselliğini geri çekmenizi gerektirir.
Olağanüstü müşteri deneyimleri sağlayan muhteşem görsellerin ve etkileşimli öğelerin aynı zamanda sayfa şişmesine neden olarak deneyimlerini kötüleştirmesi neredeyse kaçınılmazdır.
Ancak, Hem hayal ettiğiniz güçlü görsel sunumu hem de bir saniyeden kısa sürede sayfa yüklemeyi elde etmenin bir yolu var bu da daha iyi dönüşüm oranları ve artan satışlar anlamına gelir.
Cevap başsız ticarettir.
BigCommerce mağazanızı başsız hale getirin
BigCommerce sitenize burada anlattıklarımızın ötesinde bir ivme kazandırmak istiyorsanız şunları yapabilirsiniz: başsız bir mimariye geçmeyi düşünün.
BigCommerce: başsız etkinBu, BigCommerce ile mevcut arka ucunuzdan (uyumluluk, ödeme vb.) yararlanırken, onunla eşleşecek çarpıcı ve hızlı bir ön uç oluşturabileceğiniz anlamına gelir.
Mimarileri Next.js, Gatsby.js ve Nuxt.js üzerine kurulu ön uç çözümlerini desteklerMağazanızın müşteriye yönelik katmanını tasarlarken size muazzam bir esneklik sağlar.
BigCommerce ile başıboş kalmak aynı zamanda yerleşik içerik oluşturma işlevselliğiyle sınırlı olmadığınız anlamına gelir ve Birden fazla kanala sorunsuz bir şekilde bağlanan benzersiz alışveriş deneyimleri yaratın.
Bu, çok kanallı müşteri yolculuğundaki noktaları kolayca birleştirmenize olanak tanır.
Sıfırdan bir ön uç oluşturmak için şekillendirilebilir ticaret teknolojisini kullanabilir veya hepsi bir arada bir çözüm olarak ön uç (FEaaS) platformuyla altyapıyı dış kaynak olarak kullanabilirsiniz.
Bu, yavaş site hızı konusunda endişelenmeden, tamamen müşterileriniz için istediğiniz birinci sınıf alışveriş deneyimini oluşturmaya odaklanmanıza olanak tanır.
Sitenizi aşamalı bir web uygulamasına (PWA) dönüştürün
Uzun vadeli bir deneyim ve performans düzeltmesi olarak daha esnek bir site mimarisini düşünmenin yanı sıra, sitenizin çıktısını aşamalı bir web uygulamasına (PWA) dönüştürme seçeneği de vardır.
Günümüzde site hızı yalnızca belirli bir sayfanın yüklenmesinin ne kadar sürdüğüyle ölçülmemektedir.
Aslında Google artık sıralama sisteminde müşteri deneyimini ölçmek için tasarlanmış kategoriler içeriyor ve bu da bir ziyaretçinin sitenizle ne kadar hızlı etkileşim kurabildiğine dair daha doğru bir resim sunuyor.
Böyle bir önlem İlk Giriş Gecikmesi (FID).
Bu bir giriş (tipik olarak bir tıklama) ile yanıt arasındaki süre bu girişe.
- Hız testi araçları gibi Google Deniz Feneri size bir FID puanı verecektir, ancak bu puan, gerçek site ziyaretçilerinin sitenizde işlem yapmasıyla hesaplandığı için, sonuçlar daha az güvenilir diğer ‘laboratuvarda test edilmiş’ hız puanlarına göre.
- Daha doğru bir FID puanı için, günün farklı saatlerinde birden fazla hız testi yapın ve ortalama bir puan alın. FID puanınızın düşük olduğunu fark ederseniz bunun nedeni, JavaScript birikmesi veya temanızda çalışan diğer aşırı kodlar olabilir (yukarıya bakın).
Mağazanız aşamalı bir web uygulaması (PWA) olarak görüntüleniyorsa girdilere daha hızlı yanıt verebilir ve bu da daha duyarlı, daha hızlı bir siteye yol açabilir.
Birçok önde gelen marka, vitrinlerini bu tür temel teknolojilerle dönüştürüyor ve sizin markanız da aynısını yapabilir.
PWA’lar site hızını nasıl artırır: Hizmet çalışanları
PWA’ları harekete geçiren şey hizmet çalışanlarıdır.
Bunlar, PWA’ların yeteneğinin kalbinde yer alan küçük uygulama benzeri teknolojidir. web sitelerinin yerel uygulamalar gibi davranmasını sağlayın.
JavaScript’te (“JavaScript varlığı”) oluşturulurlar ve e-ticaret web sitenizin perde arkasında dururlar.
Bir tarayıcı sitenize ulaştığında, hizmet çalışanı tarayıcıya indirme yapar (tıpkı bir uygulamanın istendiğinde tarayıcıya indirilmesi gibi) ve indirildikten sonra, web sitesinin nasıl davrandığını kontrol ederek ziyaretçilere gelişmiş bir kullanıcı deneyimi sunar.
Kendi iş parçacıkları (ziyaretçinizin cihazına giden talimatlar akışı) üzerinde çalışırlar.
Bu faydalıdır çünkü tarayıcınızın üzerinde çalıştığı ana iş parçacığı (birden fazla) başka görevlerle meşgul olabilir.
Hizmet çalışanlarının kullanımına özel bir iş parçacığı varsa, görevlerini daha hızlı tamamlayarak daha hızlı bir site sunabilirler.
Ayrıca büyük bir kısmı Hizmet çalışanlarının çevrimdışı senaryolarda işlevsellik sunabilmesini sağlayan şey önbellek arayüzüdür.
Standart bir web sitesinin HTTP önbelleğinden tamamen ayrı, kendilerine ait, JavaScript tabanlı önbellekleme mekanizmaları vardır.
Bu gelişmiş önbelleğe alma mekanizması, sitenizin daha büyük bölümlerinin ziyaretçilerinizin tarayıcısında depolanabileceği anlamına gelir; bu, çok daha hızlı, etkili sayfa yükleme süreleri ve internet kapsamı düşük veya hatta hiç olmadığında işlevselliğin korunması anlamına gelir.
Satışları artırmak için BigCommerce sitenizi hızlandırın
Shogun Frontend, PWA teknolojisi üzerine inşa edilmiş hepsi bir arada bir ön uç platformudur.
Platformu kullanarak, BigCommerce’e ek olarak size benzersiz bir hız kazandıran inanılmaz bir ön uç deneyimi oluşturabilirsiniz.
Sonunda sitenizi, çarpıcı içerik ve buna uygun hız ile birinci sınıf bir marka deneyimi sunacak şekilde özelleştirebilirsiniz.
Ve tam vitrin kontrolü elde etmenin diğer yollarından farklı olarak, tüm altyapıyı bir ön uç platformuyla dış kaynaklardan temin edebilirsiniz.
Birleştirilmiş platform yaklaşımımız sayesinde sıfırdan bir ön uç teknoloji yığını oluşturmaya gerek yok. Böylece müşteri deneyimine odaklanabilirsiniz.
BigCommerce site hızına olan ihtiyacınız konusunda ciddiyseniz Shogun Frontend gibi bir FEaaS platformu sizin için olabilir!
#cta-visual-fe#