Elementor 3.4’ten ne bekleyebileceğiniz ve bunun WP sitesi performansınızı nasıl artırabileceğiniz
Yani, müşterileriniz için harika bir WordPress (WP) sitesi tasarlamayı bitirdiniz, ha? Bu süper! Ama şimdi, sizden 16: 9 en boy oranıyla 70 inç TV’de göstermenizi istiyorlar. Gözleriniz genişledi, masaüstünde harika görünen sitenin hala büyük bir ekranda mükemmel piksel görünüp görünmeyeceğini merak ediyor. Bu, tüm zamanların mücadelenizse ve bu nedenle sıkılıyorsanız, Elementor’un sayfa oluşturucu son çözüme sahiptir: Elementor 3.4 ve ek özel kesme noktaları (en çok istenen özelliklerden biri).
Elementor 3.4 ile, tasarımınızı doğrudan herhangi bir ekran için doğru bir şekilde ölçebilir ve yükseltilmiş bir kullanıcı deneyimi (UX) için WP sitenizin performansını güçlü bir şekilde hızlandırabilirsiniz.Kulağa harika geliyor mu? Bu sürümü nasıl güncelleyeceğinizi öğrenmek için bu kılavuzun geri kalanını okuyun. Kesme Noktaları Kesme Noktaları Tasarım Limitleri, site içeriğinizin cihazın genişliğine göre en iyi düzene göre yanıt verdiği bir “nokta” dır. Ürün sayfasına ardışık dört görüntü girdiğinizi ancak hücresel ziyaretçilerin sadece üçünü görmesini isteyin. Kesme noktaları doğrudan tasarımınızı ayarlar ve belirli bir ekranın genişliğine en uygun düzen için sınır olarak hareket eder. Stili her cihaza uyarlayarak, ziyaretçilerinizin deneyimini geliştirirken ve bilgileri daha sorunsuz tüketmelerine yardımcı olurken durdurma noktası. Elementor 3.4 size her biri için dört ek kesme noktası verir: tabletler, dizüstü bilgisayarlar, büyük ekranlar ve diğer hücresel araçlar (hücresel ve tabletler için iki varsayılan dışında).
Bu aynı zamanda WP sitenizin düzenini yedi cihaza ayarlamanıza olanak tanır, bu da web sitenizi tasarlarken size daha fazla esneklik ve kontrol sağlar. Bu Elementor 3.4 özelliği ile serbestçe, aktif kesme noktasını seçin: BreakPoint masaüstü, hücresel ve orijinal tablet dışında, diğer ekran boyutları için daha fazlasını ekleyebilirsiniz
Her kesme noktasının değerini seçin: Elementor, her bir kırılma noktasının değerini yönetmenizi sağlar
Önizleme Ölçeği daha yüksek veya daha düşük: Elementor’un büyük ekran cihazında tasarım önizlemenizi görmek için en aza indirebilirsiniz.
Elementor 3.4’e göre ek durma noktaları şu anda deney olarak mevcuttur. Test etmek için önce WP web sitenizin bir yedeğini alın. Not: Yeni özellikleri test ederken Elementor tarafından önerilen uygulama, bunu doğrudan üretim web sitesine uygulamadan önce performans ortamında yapmaktır.
Ayrıldıktan sonra Elementor> Ayarları> Deneylerini açın ve ek özel kesme noktaları seçeneklerini “Etkin” olarak ayarlayın. Bu, editördeki yeni duyarlı paneli etkinleştirir.
Bu ek kesme noktasıyla, tasarımınızı mükemmel görünüm sporlarına sahip çeşitli cihazlar için tam olarak denetleyebilirsiniz. Ayrıca, performansınıza zarar vermeden tamamen duyarlı olan WP web sitesini de çalıştırabilirsiniz (daha sonra bununla ilgili). Tasarımınızı çeşitli cihazlar için ölçün Elementors Basamaklama konseptini kesme noktası boyunca kullanır ve büyük ekran hariç her cihazın ölçeğini azaltır. Masaüstünün düzeniniz için her zaman varsayılan olduğunu unutmayın. Bu otomatik ayar, daha küçük ve daha büyük ekran için geçici durdurma noktasını etkiler. Bunun için uygulama örneği, her kesme noktası için farklı bir başlık ayarlamaktır. Masaüstü ekranı için başlık metin boyutunuz için 90 px girdiğinizi varsayalım. Bu değer diğer kesme noktaları için geçerlidir. Tablet iken durdurma noktasını değiştirir ve başlığın başlığını 70 piksel olarak ayarlarsanız, tüm durdurma noktaları için aynı olurken, ekstra hücresel ve hücresel de dahil olmak üzere diğerleri. Ancak, tabletler için girdiğiniz stil daha büyük kesme noktasına (bu örnekte tabletler ve dizüstü bilgisayarlar) uygulanmayacaktır. Bu daha büyük ekran kesme noktası, masaüstü ayarları için doğru numara olan 90 px’de kalır. Kesme noktalarına ayarlanan bazı kuvvetlerin belirlenmesi: Yeni kullanıcı arayüzü her duraklamayı özel olarak eklenirken güncellerken, kalıtsal kuvveti bir duraktan geçici olarak diğerine tam olarak tanıma ihtiyacı ile donatılmıştır. Bu nedenle, Elementor yeni kullanıcı arayüzünde (UI) bir artış içerir. Önceki başlığın boyutunu ayarlama örneğini ele alalım. Tabletin kenarını 20 piksel olarak ayarladığınızı ve ekstra hücresel görünüme geçtiğinizi varsayalım. Daha sonra Elementor’un kontrol üzerinde miras alınan değerleri (örneğin, arka plan görüntüleri, kenar boşlukları, dolgu ve diğer sayısal kontroller) yer tutucular olarak sunduğunu göreceksiniz.
Yukarıdaki örnekle, tablette 20 px tabletten daha küçük tüm cihazlarda gri görünen bir yer tutucuya ayarlayın. Bu işlevi kullanırken başlığın yanındaki cihaz simgesiyle yalnızca durdurma başına kuvveti geçici olarak ayarlayabileceğinizi unutmayın. WP Elementor 3.4 sitesinin performansının iyileştirilmesi, koşullu olarak yüklenen ışık kutusu, varlıkların yüklenmesi ve erişilebilirliği, ek DOM öğelerinin azaltılması ve daha fazlası dahil olmak üzere 2021’de yayınlanan önceki sürüme dayanıyordu. Buradan Elementor 3.4, WP sitenizin performansını artırmak için daha optimize edilmiş özellikler sunuyor. Aşağıdakiler önemli bir artış: Breakpoint hız sınırını aşıyor
Özel durma noktasını özellikle optimal olarak arttırmak için, Elementor Duyarlı Kontrolü Yükleme Mekanizmasını yeniden inşa eder. Sonuç olarak, sunucu yanıt süresi%23 arttı, bellek kullanımı%5 azaldı ve Elementor, veri trafiğinin yaklaşık%30’unu editör yüküne kaydeddi. Bu sayılar, WP sitenizin artık eskisinden daha sorunsuz ve daha hızlı çalışabileceğini kanıtlıyor. Ayrıca, aynı etkiyi elde etmek için yinelenen kodlar kullanan diğer çözümlerin aksine, ek özel kesme noktalarının performansınızı hiçbir şekilde nasıl tehlikeye atmadığını gösterdiler.
Yinelenen kod, kendisiyle ilgili teknik borcu artırarak kodunuzun kalitesine zarar verir (bu, iyileştirilmesi pahalıdır). Kodunuz da korumak için ağırlaşır. Neyse ki, Elementor Page Maker Sürüm 3.4’ü kullanırken ortadan kaldırabilirsiniz. Web sitesi projeniz için en iyi web sitesi üreticisini seçerken bu faktörü düşünün. IE Destek Silinen ve Olağanüstü Yükleme için Optimize Yazı Tipleri. Elementor beş yıl önce piyasada ortaya çıktı. Internet Explorer (IE) ve alternatifler, modern dili yorumlamak için kapsamlı kodların ve desteğin çoğaltılmasını gerektirir.
Bununla birlikte, şu anda, web tarayıcıları modern kodları daha fazla açıklamaya gerek kalmadan doğal olarak çevirebilir. Bu devrimsel olarak çok önemlidir. Bu, Elementor’un artık her yükleme ve sayfa boyutunda 110kb’ye kadar tasarruf edebileceği, sayfanızın daha hızlı bir yükleme süresi aldığı ve sitenizin UX’inin olağanüstü kaldığı anlamına gelir. Buna ek olarak, Elementor 3.4 müthiş yazı tipinin yüklenmesini arttırır. Bu artıştan önce, harika yazı tipinden her bir simge eklediğinizde tüm kütüphaneler web sitesinde kullanılır. Simonları yükleme mekanizmasını SVG’ye ayarlayarak, Elementor kilobayt ve talebi azaltır. Bu, platformda yaptığınız her sayfanın daha hızlı olduğu anlamına gelir.
JavaScript/CSS kütüphanesi ve orijinal tarayıcı desteğinin kullanımını en aza indirin Bugün JavaScript ve CSS’nin daha fazla optimizasyonu
Bütün bunlar, Elementor’un web sitelerinin performansını teşvik etmek ve en iyi siteleri oluşturmaya güç vermek için sürekli çabalarının bir parçasıdır.Bu tür siteler ziyaretçilerin daha fazla katılımı, daha iyi dönüşümler ve daha yüksek karlılık üretir.