Site Performansı: Performans Odaklı Site Tasarımı
Bu makalede
- Öge yükleme sırasını optimize etme
- Yüksek performans gösteren Ekran Üstü Üst Kenar Sayfaları tasarlama
- Özel sayfaları kullanma
- Görüntüleri ve videoları optimize etme
- Gecikmeli yükleme
- Ek ögeleri yönetme
- SSS
Performansı önceliklendiren tasarım seçimleri yaparak
hızlı ve ilgi çekici bir web sitesi oluşturun. İlk olarak neyin gösterileceğini, görüntüleri ve videoları nereye yerleştireceğinizi ve içeriklerinizi nasıl düzenleyeceğinizi seçerek sayfalarınızın hızlı yüklenmesini ve kullanıcıların aradıklarını bulmalarını kolaylaştırabilirsiniz. Sitenizin hızını artırmak, ziyaretçilerin ilgisini canlı tutmak ve her cihazda sorunsuz ve profesyonel bir deneyim sunun.
Öge yükleme sırasını optimize etme
Sitenizdeki ögeler, türlerine ve boyutlarına göre belirli bir sırada yüklenir. Bu sırayı anlamak, ilk görünene öncelik vermenize yardımcı olur ve sorunsuz bir deneyim sağlar.
- Statik ögeler: En hızlı yüklenen metinler ve temel şekiller bunlardır. Hızlı görünürlük sağlamak için bunları ekranın üst kısmına ekleyin.
- Akışkan ögeler: Görüntüler ve videolar bu kategoriye girer. Sitenize hayat katmakla kalmaz, performansı yavaşlatabilirler. Mümkün olduğunda bunları ekranın alt kısmına yerleştirin.
- Etkileşimli ögeler: iFrame'ler, animasyonlar ve üçüncü taraf uygulamalar gibi ögeler en son yüklenir. Uzun yükleme sürelerini önlemek için bunları dikkatli ve stratejik bir şekilde kullanın.
İpucu:
Ana sayfaya daha fazla özen göstermenizi öneririz, çünkü sitenize giren ziyaretçileri genellikle bu sayfa karşılar.
Yüksek performans gösteren Ekran Üstü Üst Kenar Sayfaları tasarlama
Ekranın üst kısmındaki bölüm, web sayfanızın kullanıcı kaydırmaya başlamadan önce görünen alanını gösterir. İlk yüklendiğinden, hafif ve amaca yönelik olması çok önemlidir.
Önerilen ögeler:
- Metin: Sayfanızın amacını net bir şekilde yansıtan kısa ve etkili metinler kullanın. Sistem yazı tiplerine bağlı kalın ve yazı tipi ailelerini ve ağırlıklarını aşırı kullanmaktan kaçının.
- Harekete Geçirici Mesajlar (CTA): "Hemen Alışveriş Yap" veya "Daha Fazla Bilgi" gibi kullanıcı eylemlerine rehberlik edecek net düğmeler veya bağlantılar ekleyin. CTA'ların yakınına dikkat dağıtan ögeler yerleştirmekten kaçının.
Simge durumuna küçültülecek ögeler:
- Büyük boy görüntüler veya videolar
- Animasyonlar
- Yüksek çözünürlüklü görüntülerin aşırı kullanımı
İpucu:
Ekranın üst kısmındaki içeriğin hızlı yüklenecek şekilde optimize edildiğinden emin olmak için Google PageSpeed Insights veya
Wix'in Site Hızı kontrol paneli gibi araçları kullanın.
Özel sayfaları kullanma
Sayfaların çok fazla ögeyle aşırı yüklenmesi, başta ana sayfa olmak üzere performansı etkiler. Bunun yerine belirli site özellikleri veya uygulamaları için
özel sayfalar oluşturun.
Stores, Bloglar veya Videolar gibi özellikler için sayfalar ekleyin ve düğmeler veya menü ögeleri aracılığıyla ana sayfadan bunlara bağlantı verin. İçeriği site sayfalarınıza dağıtarak ve gereksiz ögeleri sınırlayarak sayfa uzunluğunu yaklaşık
sekiz ekranın altında tutun.
Görüntüleri ve videoları optimize etme
Medya dosyaları, büyük boyutları ve çözünürlükleri nedeniyle web sitelerini genellikle yavaşlatır. Bunları nasıl etkili bir şekilde yönetebilirsiniz:
Görüntüler:
- WebP veya JPEG gibi basit formatlar kullanın.
- Wix'e yüklemeden önce dosyaları sıkıştırın.
- Optimizasyon için görüntüleri profesyonel bir galeride sergileyin.
Videolar:
- Performansı optimize etmek için videoları Wix Video, YouTube veya Vimeo'da barındırın.
- İlk sayfaların daha hızlı yüklenmesi için videoları ekranın üst kısmına yerleştirmekten kaçının.
Gecikmeli yükleme
Tembel yükleme, görüntülerin ve videoların kullanıcının görüntü alanında görünene kadar yüklenmesini geciktirerek sayfanın ilk yüklenme sürelerini iyileştirir. Bu özellik Wix'te otomatik olarak etkinleştirilir, ancak en iyi şekilde görüntüler ve videolar galeriler veya şeritler gibi desteklenen ögelere yerleştirildiğinde ve daha hızlı görünürlük için ekranın üst kısmındaki içeriğin minimum düzeyde tutulduğunda çalışır.
Ek ögeleri yönetme
Diğer tasarım kararları sitenizin hızını ve performansını etkileyebilir:
- Düğmeler: Sitenizin başka bir yerindeki ilgili içeriğe bağlantı veren, net ve kısa düğmeler oluşturun. Örneğin, "Kataloğu Keşfet" veya "Daha Fazla Proje Görüntüle" seçeneklerinden birini kullanabilirsiniz.
- Özel Kod: Tüm özel kodların optimize edildiğinden ve gecikmeyi azaltmak için "erteleme" veya "async" gibi özellikler kullandığından emin olun.
- Sayfalandırma veya daha fazla yükle düğmesi: Özellikle ürün ağırlıklı sitelerde tüm ürünleri tek bir sayfada göstermekten kaçının. Yüklemeyi verimli tutmak için sayfalandırma veya isteğe bağlı yükleme özellikleri uygulayın.
İpuçları:
- Düzenli olarak test edin: Performansı izlemek ve iyileştirmek için Google PageSpeed Insights ve Wix Site Hızı kontrol panelini kullanın.
- Ekranın üst kısmındaki içeriğe öncelik verin: Hafif ve statik ögeler ekleyerek önemli içeriğin hızlı bir şekilde yüklenmesini sağlayın.
- Üçüncü taraf uygulamaları simge durumuna küçültün: Gereksiz yavaşlamaları önlemek için yalnızca temel uygulamaları veya widget'ları kullanın.
SSS
Daha fazla bilgi edinmek için aşağıdaki sorulara tıklayın.
Wix web sitemin yüklenmesi neden yavaş ve web sitemin hızını nasıl artırabilirim?
Mobil sitem neden masaüstü sitemden daha yavaş?
Largest Contentful Paint (LCP) puanımı nasıl artırabilirim?
Mağazamı yavaşlatmadan çok sayıda ürünü sergilemenin en iyi yolu nedir?