Roketi yüklemek için Shopify sayfa hız problemlerini çözün (çekirdek web hayati).

Hayattaki asıl sorun: "Müşteri malları sepette bastırdı ... ama neden ödeme yapmıyorsunuz?"

Shopify'daki her dükkan sahibi. Hiç bu şekilde hissettin mi? "Sepette daha fazla ürün var." Kalp neşeyle şişti. Ama oturduktan ve birkaç dakika bekledikten sonra ... hiçbir şey olmadı. Sipariş içeri girmez. Müşteri havada hiç yokmuş gibi kayboldu. "Terk edilmiş araba) tekrarlanan fenomen. Ürünün iyi olmadığını merak etmeye başlıyorsunuz? Fiyat hoşlanmıyor mu? Yoksa promosyon yeterince güçlü değil mi?

Ancak en sinsi "katili", yani "web sayfasını yükleme hızı" veya sayfa hızını göz ardı edebilirsiniz. Müşteriler ödemek için baskı yapmak üzere. Ama web sayfası dönüyor, hiçbir yere gitmiyor ... 1 saniye, 2 saniye, 3 saniye ... Çevrimiçi dünyada insan sabrı düşündüğümüzden daha kısa! Tereddüt oluşmaya başladı. "Bu web sitesi güvenilir mi?" "Ödeyecek ve aldatılacak mı?" Son olarak, sadece "pencereyi kapatırlar" ve daha hızlı bir yarışma dükkanından satın alırlar. Bu sorun sadece müşterileri kaybetmenize neden olmak değil. Ama aynı zamanda markanızın göz açıp kapayıncaya kadar olan güvenilirliğini de yok edin Bu, birçok işletme sahibinin karşılaştığı bir sorundur. Ancak kökün web hızı gibi temel bir hikayeden geldiğini bilmiyorum.

İllüstrasyonlar istemi: Çevrimiçi mağaza sahipleri tapınaklarda oturuyor. Yüksek araba terk etme oranı istatistiklerini gösteren bilgisayar ekranına bakarak.

Shopify web sitemiz neden tuzlu tekne olarak "halsiz"?

Birçok kişi, Shopify'ı kullanmanın dünya sınıfı bir platform olduğunu düşünebilir. Web sitesi otomatik olarak hızlı ve kaybolmalıdır. Ama gerçekte, "hız" ücretsiz gelmez. Mağazanızın dükkanınızın bu kadar sinirli olmasının ana nedenini bilmeden web sitemize yanlışlıkla saldırabileceğimiz birçok faktör vardır. Genellikle bu hikayelerden gelir:

• Dev boyutta resim hiç sıkıştırılmadı: Bu bir numaralı kötü adam! Kısmi veya sıkıştırma dosyaları olmadan yüksek çözünürlüklü bir pro kameradan alınan güzel ürünleri yüklemek, müşterilerin web sayfası her açıldığında ağır dosyaları indirmeleri gibidir, web'e "çekilir".
• Uygulamayı (uygulamaları) gerekenden daha fazla uygulayın: Shopify uygulaması bir kolaylık aracı gibidir. Ancak, gerçek kullanılmadan ilginç görünen tüm uygulamaların uygulanması, yüklediğiniz her uygulama kod ekleyecektir. (JavaScript/CSS) web sitesine girerek daha uzun işlemlere neden olur
• Tema güzel, ama "ağır": bazı temalar güzel bir animasyon veya güzel özelliklere sahip olabilir, ancak büyük dosya boyutu ve karmaşık kod ile değiştirilir. Genel web sitesinin daha yavaş çalışmasına neden olmak
• Düzenlemeyen Kod (Render Engelleme Kaynakları): Web sayfasının önemli içeriğinden önce yüklenen JavaScript ve CSS dosyaları, kullanıcıların ücretsiz web sayfasını görmesine izin vererek ekrana "müdahale eder". İçerik ortaya çıkmadan çok çok.

Bu nedenler genellikle bir gün web sitenizin işlenemeyecek kadar yavaş olduğunu bulana kadar yavaş yavaş yavaş yavaş birikir. kötü kullanıcı deneyiminin iş fırsatlarının kaybına yol açtığı müşterileri kaybedene kadar yavaşça yüklenen bir klinik sorunu gibi, işin diğer bölümlerini kaçınılmaz olarak etkileyen bir sorundur.

İllüstrasyonlar istemi: Web'i yavaşlatan 4 ana nedeni gösteren basit infografik görüntüler: büyük simge, simge, birçok uygulama, karmaşık simgeler ve karışık bir simge

"Yavaş" web sitesinin devam etmesine izin veriyorsa, ne olacak?

Yavaş bir yükleme web sitesine sahip olmak sadece can sıkıcı değil, aynı zamanda bu dönemde e-ticaret işi için "felaket". Sonuçlar düşündüğünüzden daha şiddetli ve daha zincirdir:

• Dönüşüm oranı. Ölçek: Web sitesindeki "her saniye" nin yavaşladığı istatistikleri netleştirin. Satın alma oranını (dönüşüm oranı) azaltacak, müşteriler beklemek istemiyor, sadece başka bir yerden satın almaya gidin.
• Google Falls'da SEO sıralaması: Google kullanıcı deneyimi için çok önemlidir. Core Web Vitals adlı bir gösterge kullanarak bir sıralama faktörü olarak bir sıralama faktörü olarak kullanılarak yeni müşterilerin sizi bulamamasına neden olur.
• Reklam maliyetleri daha pahalıdır, ancak sonuç daha kötüdür: reklamı (Google reklamları, Facebook reklamları gibi) yavaş bir yük sayfasına çektiğinizde. Reklam platformları "açılış sayfası deneyiminizin" iyi olmadığını düşünecektir, bu nedenle tıklama başına reklam için ödeme yapmanız gerekebilir. Buna ek olarak, tıklama yapan kişinin ürününüzü görmeden önce basması muhtemeldir. "Para yaktığınız" ortaya çıktı
• Markanın güvenilirliği azalır: yavaş ve zor bir web sitesi. Müşterilerin markanızın "profesyonel değil" ve "güvenilmez" olduğunu hissettirin. Ödeme güvenliği hakkında sorular sorabilirler. Ve bu olumsuzlukların tekrar gelmemesine neden olabileceği ilk izlenimi

Kronik sayfa hız problemlerine izin vermek, bir dükkan açmakla aynıdır, ancak ağır ve sert bir kapıya sahiptir. Çoğu müşteri yanındaki dükkandan geçmeyi tercih eder. Kapı kesinlikle açık ve daha uygun. Bu, çevrimiçi yarışmaların acısının acısıdır.

İllüstrasyonlar istemi: 2 grafik görüntüleri ters yönde bir satır, dönüşüm oranına yükselen web'i ve SEO sıralamasını müşterinin kaşlarını çatlatan bir simgesiyle yükleme zamanıdır.

Herhangi bir çözüm var mı? Ve nereden başlamalı?

İyi haber şu ki, Shopify'daki yavaş web sorunu sistematik olarak çözülebilir ve geliştirilebilir. Eve taşınmaya veya yepyeni bir web sitesi oluşturmaya gerek yok. Anahtar, gerekli olmayan "ütüleme" dir ve yapıyı "ışık" ve "en hızlı" olarak organize eder. Bu adımlardan başlayabilirsiniz:

• 1. Önce mevcut puanlarınızı kontrol edin: Mevcut web hızınızı ölçmek için Google PagePeed Insights gibi ücretsiz araçlar kullanın Hem mobil hem de masaüstü puanlarını göreceksiniz. Nerede geliştirileceğine dair temel tavsiyelerle
• 2. İlk önce "resimler" ile ilgilen:
  • Sıkıştırma Görüntüleri: Kaliteyi çirkin hale getirmeden tüm görüntü dosyası boyutunu azaltmak için Shopify'daki çevrimiçi araçları veya uygulamaları (Tinyimg, Crush.pics gibi) kullanın.
  • Boyutu Ayarlayın (Resimleri Yeniden Bize): Görüntüyü ekran için uygun boyutta gösterin. Bölgede sadece 800x800 piksel görüntülenen 4000x4000 piksel kullanmayın.
  • Modern formatı kullanma: .jpeg veya .png'den çok daha küçük olan, ancak hala keskinlik biçimini kullanmayı düşünün.
• 3. "Uygulama denetimi" büyük bir zaman yapın: Shopify Shopify'ın arkasına gidin ve kendinize sormak için yüklediğiniz tüm uygulamaları keşfedin, "Bu uygulama hala gerekli mi?" Veya "Bizi Kayıp Hıza Değer mi Yapıyor?" Hangi uygulamalar kullanılmıyor? "Sil" hemen.
• 4 . Ancak yalnızca ekranda görünmek üzere olan görüntüleri indirecek, ilk yüklemenin çoğu daha hızlı modern temaların kendi içinde bu özelliğe sahip olmasına yardımcı olur. Veya uygulamayı kullanabilir
• 5. CSS ve JavaScript dosyalarını yönetin:
  • Minify Kodu: Kod dosyasından gereksiz bir karakterdir (boşluk gibi). Dosyayı daha küçük boyutlar haline getirir. Shopify genellikle yapılır. Ancak bazı uygulamalar minifik olmayan dosyalar ekleyebilir.
  • Render Engelleme Kaynaklarını Azaltın: Kodu ayarlamak için uzmanları kullanmayı düşünün, son için önemli olmayan yükleme JavaScript'i ertelemek için.
• 6. Yükseltme veya değiştirme teması (tema): Mevcut temanız çok eskise veya hızla ünlü bir temayla (hızlı yükleme temaları) yatırımları desteklemiyorsa, uzun vadede en değerli karar olabilir.

Bunlardan başlamak, sonuçları daha iyi görmenize yardımcı olacaktır. Ek olarak, derinlemesine yönergeler, daha eksiksiz Shopify SEO stratejisinin genel bakışını anlamanıza yardımcı olacak olan Shopify Yardım Merkezi'nden Web Sitesi Hızı Ayarlama Kılavuzu'ndan

İllüstrasyonlar istemi: Adım adım infografik, problemler gösteriyor. Kontrol noktalarından, resim yönetimi, denetim uygulaması, her adım için bir simge ile kod ayarlamasına kadar kolay anlaşılması

Eskiden başarılı olan gerçek şeyden örnekler: Mağaza "yumuşak ve rahat pijamalar" satışları sayfa hızıyla çevirdiğinde.

Daha net olabilmek için dükkanın davasını kaldırmak istiyorum. Hedefe uygun olarak değil, satış sorunları yaşanan "yumuşak ve rahat pijamalar" (varsayılan isim), çok fazla çekime rağmen ürün iyidir. İncelemeler sadece düzenli olarak yolda kaybolmaktadır.

Karşılaşılan orijinal sorun: Mağazanın orijinal web sitesi güzel temalar kullanıyor. İlk sayfada büyük bir arka plan videosu var. Her ürün görüntüsü kameradaki ham dosyalardır. Ve özellik eklemek için 25'ten fazla uygulama yüklendi. Sonuç olarak, cep telefonlarındaki sayfa içgörüler 21/100'dür ve her ürün için 8 saniyeden fazla sürer! % 80'e kadar züppe sepet

Dönüş Misyonu: Ekip e -ticaret optimizasyon denetimini ve keşif noktasını düzeltmeye başladı.

• Kahraman bölümünü değiştirin: Arka plan videosunu kaldırın. Ve iyi sıkıştırılmış .webp görüntüsü ile değiştirildi
• Bazı uygulamaları temizleyin: kaldırılmış 15 gereksiz uygulama, sadece 10 gerçekten önemli.
• Tüm sistem resmini yönetin: Mağazadaki tüm görüntü sıkıştırma uygulamalarını kullanın. Ve tembel yüklemeyi etkinleştirin
• Tema Kodunu Ayarlayın: Render Engelleme JavaScript ve CSS ile başa çıkmak için uzmanları kiralayın

İnanılmaz Sonuçlar: Sadece 1 ay içinde. Cep telefonları üzerindeki sayfalar 85/100'e yükseliyor! Sayfayı yükleme süresi 2 saniyeden daha azına indirgenir. Aşağıda, dönüşüm oranının% 0.8'den% 2.5'e (3 kattan fazla!) Artığı ve terk edilmiş sepet oranının% 60'dan fazla azalması, dükkanın reklam bütçesini arttırmak zorunda kalmadan toplam% 280'den fazla büyümesine neden olmasıdır. Bu, sayfa hızına yatırım yapmanın Shopify mağazaları için en değerli getirilerden biri olduğuna dair bir kanıttır.

İllüstrasyonlar istemi: Soldaki cep telefonu ekranının resmi, yavaş bir yükleme web sitesi gösteriyor ve sağda düşük bir sayfa puanına sahip, hızlı bir şekilde yüklenmiş ve yüksek bir puana sahip aynı web sitesini gösteriyor. Net satış grafikleri ile

Takip etmek istiyorsanız, ne yapmalı (hemen kullanılabilecek kontrol listesi)

Sargalı Shopify web sitesini hızlı bir para kazanma makinesine değiştirmek sizin gözleriniz! Sağlığınızı kontrol etmek ve web sitenizi hemen geliştirmek için bu kontrol listesini kullanmayı deneyin:

Bölüm 1: Analiz ve Denetim (Denetim)

• [] Web Hızı Ölçümü: Google PagePeed Insights'a gidin ve URL'nizi doldurun. Mobil ve masaüstünü taban çizgisi olarak yazın.
• [] Web sayfasının boyutunu kontrol edin: Sayfanızın kaç MB'sinin dahil edildiğini görmek için GTMetrix gibi araçları kullanın.
• [] Uygulamaları keşfedin: Shopify Shopify'ın arkasını açın ve tüm uygulamaları listeleyin. O zaman kendinize hangi uygulamanın "gerekli olduğunu" ve hangi uygulama "sadece sahip olmak ister"

Bölüm 2: Görüntü Optimizasyonu)

• [] Sıkıştırma uygulamalarının yüklenmesi: Güvenilir bir uygulama seçin (TinYIMG, Görüntü Optimize Edici) ve mağazanızdaki tüm resimlerle çalışmasını isteyin.
• [] Tembel Yüklemeyi Aç: Tembel yüklemeyi açıp açmayacak seçenekler olup olmadığını görmek için tema ayarlarınızı kontrol edin. Değilse, uygulamayı kullanmayı düşünün.
• [] İlk sayfadaki resmi kontrol edin: İlk sayfadaki kahraman banner resmi hafif ve en hızlı olması gereken bir şeydir. İyi optimize edildiğinden emin olun.

Bölüm 3: Temizleme

• [] Gereksiz Uygulamaları Sil: Kalbinizi kesin ve kullanmadığınız uygulamaya "silin" tuşuna basın veya çalışmayı çoğaltın.
• [] Silinen uygulamanın eski kodunu silin: Bazen uygulamanın kaldırılması tüm kodu silmez. Uzmanların tema.liquid dosyasındaki artık kodu kontrol etmelerini ve silmesini isteyebilir.
• [] Güncelleme Teması: Temanızın en son sürüm olup olmadığını kontrol edin. Güncelleme genellikle verimlilik artışı ile birlikte gelir.

Bu kontrol listesi en yaygın temel sorunları çözmenize yardımcı olacaktır. Bu Shopify mağazalarındaki en yaygın sorunları anlamak ve düzenlemek, güçlü ve sürdürülebilir bir web sitesine sahip olan ilk adımdır.

İllüstrasyonlar istemi: Kontrol listesi görüntüleri, güzel, konforlu, ucuz bir kene ile. Her konu için simgelerle, denetim için genişlemiş gözlük, görüntü için dağ görüntüleri ve temizleme için süpürge görüntüleri

İnsanların merak ettiği sorular ve temizlenen cevaplar

Shopify'ın sayfa hızı hakkında birçok insanın merak ettiği popüler bir soru derledim. Kararları kolaylaştırmanız için açık ve anlaşılır cevaplarla

Soru: Uygulamanın silinmesi, ortadan kaybolmak için kullanılan özelliklere neden olur Mağazayı etkileyecek mi?
Cevap: Kesinlikle etkilenir. Ancak bu, "Bu özellik gerçekten gerekli mi?" Bazen müşterilerin neredeyse kullanmadığı küçük bir küçük özellik yükledik. Ancak bunun yerine web'i yavaşlattı, "özelliklerin faydaları" ve "kayıp hızı" arasındaki ağırlığı denedi. Genellikle, çok fazla özelliği olan ancak yavaş bir web sitesinden daha iyi bir dönüşüm vermek için hızlı ve basit bir web sitesine sahip olmak.

Soru: PageSpeed Insights ne kadar puan alacak?
Cevap: İdeal hedef "yeşil" veya 90-100 puandır, ancak gerçekte, birçok uygulama ve resmi olan e-ticaret web sitesi için. Mobil puanlar 50-89 (turuncu) ve çekirdek Web Vitallerinin (LCP, INP, CLS) 3 değeri aracılığıyla "mükemmel" olarak kabul edilir ve iyi bir deneyim değildir. 100 sayısına da takıntılı olmayın, ancak odak noktası çekirdek web canlılarını geçmektir.

Soru: Kendiniz yardım etmek veya yapmak için geliştiricileri işe almak gerekli mi?
Cevap: Sıkıştırma, uygulamaları kaldırma, tema ayarları aracılığıyla tembel yükleme açma gibi birçok bölümde kendiniz yapabilirsiniz. Ancak, işleme engelleme kaynaklarının kaldırılması, kalıntı kodunun kaldırılması veya Derinlemesine Tema Yapısı ayarlama uzmanlarının Shopify ile doğrudan deneyime sahip "Güvenli" ve "Sonuçlara bakın" gibi karmaşık değişiklikler için daha iyi olacaktır. , en iyi sonuçları elde etmek için Professional Shopify Shop Tasarım Ekibini işe almak gibidir

İllüstrasyonlar istemi: görüntü simgesi, büyük bir soru işareti (?) Ve birisi duruyor. Soruları çözmek için açık bir cevap simgesi ile

Kolay anlayış için özet: "Hız" en değerli yatırımdır.

Bu noktada, "sayfa hızının" sadece bir baş ağrısı teknik olmadığını, aynı zamanda müşteri deneyiminin "kalbi" olduğunu ve Shopify mağazanızın başarısının en önemli değişkenlerinden biri olduğunu açıkça görebilirsiniz. Daha hızlı bir yükleme web sitesine sahip olmak, bu şiddetli e-ticarette sadece "seçenekler" değildir.

Web hızı iyileştirmeleri, "Vitrin" oluşturmak için yatırım yapmak gibidir. Basınç oranını azaltmaya yardımcı olur. Dönüşüm oranının güvenilirliğini artırın ve ayrıca uzun vadede SEO üzerinde de iyi bir etkiye sahiptir. Web'i daha hızlı yaptığınız her saniye artan satış fırsatıdır ve müşteriler için oluşturduğunuz izlenimdir

Yavaşlığın işinizin büyümesini sürdürmesine izin vermeyin. Shopify web siteniz için sınavı ve "Demir Yağ" ı ciddiye alma zamanı. Sağladığım kontrol listesiyle başlayın, değişikliği kesinlikle göreceksiniz!

Uzmanların sorunu analiz etmeye ve Shopify web sitenizi hızlı bir şekilde yükleyecek şekilde değiştirmeye yardımcı olmasını istiyor. Satış yaratmaya hazır, değil mi? E-ticaret web verimliliğimizi almak için buraya tıklayın! Ya da hem tasarım hem de hız gibi mükemmel bir yeni mağaza oluşturmak istiyorsanız, uzmanlarımız tarafından Shopify, Shop Tasarımına bakın!

İllüstrasyonlar istemi: Salyangoz simgesinden roket simgesine yükselen bir okun resmini gösteren güçlü grafikler "Web Sitesini Satış Olmak için Değiştir" mesajı ile

‍