Elementor Sitenizi Optimize Etmek İçin 6 İpucu
Yayınlanan: 2021-10-27Bir web sitesinin ne kadar hızlı yüklendiği ve ona erişmek için kullanılan cihazdan bağımsız olarak ne tür bir deneyim sunduğu, belki de bir ziyaretçinin siteye ilk geldiğinde fark ettiği ilk iki şeydir.
Web sitenizi performans ve dönüşümler için nasıl optimize edeceğinizi öğrenmek, web sitenizin tam olarak gerektiği kadar çalışmasını sağlayarak ziyaretçilerinizin gezinme deneyiminden memnun kalmasını sağlayacağı için çok önemlidir.
Bu web sitesindeyseniz, WordPress hakkında bazı bilgiler aramak için buradasınız. WordPress'i duyduysanız, ekosistemdeki önde gelen sürükle ve bırak web sitesi oluşturucu olan Elementor ile karşılaşmış olmalısınız.
WordPress site oluşturucunun kuş bakışı görünümü
Bir Elementor siteniz varsa ancak henüz tam olarak optimize etmediyseniz, birçok inanılmaz avantajı kaçırıyorsunuz. Elementor, benzersiz ve görsel olarak çekici web siteleri oluşturmak için bir WordPress web sitesi oluşturucusudur. 8 milyondan fazla web yaratıcısından oluşan aktif bir topluluğa sahiptir.
Elementor, web tasarımının çeşitli öğelerini bir araya getirirken tasarımınızın sonucunu göstererek süreci sizin için daha hızlı hale getirir. Araç, diğer eklentilerle kolayca eşleşir ve herhangi bir WordPress temasında rahatlıkla çalışır.
Elementor, HTML veya CSS kodlama bilgisi olmadan bile kullanılabilecek sezgisel gezginciler ve menüler sunar. En son sürüm, yani Elementor 3.4, birkaç şık UX merkezli özellik ve iyileştirme ile birlikte gelir.
Yeni tasarım seçenekleri ile kullanıcılara sınırsız tasarım yapma imkanı sunar. Menü Sepeti widget'ını, AJAX Daha Fazla Yükle, Video Oynatma Listelerini ve Dinamik WooCommerce Etiketleri keşfedebilirsiniz. Bu işlevler, web sitelerindeki pazarlama ve diğer işlevlere yardımcı olur.
Elementor kutudan çıktığı gibi harika olsa da, eklenti performansı ve sitenizin işlevselliği söz konusu olduğunda iyileştirme için hala yer var. Bu yazıda, siteniz için eklentiyi optimize ederken Elementor'un masaya getirdiği şeylerden yararlanmanıza yardımcı olacak altı ipucu tartışacağız. Hadi başlayalım:
1. Artan Sayfa Hızı için Yazı Tipi Yükleme Yöntemi Seçin
Elementor, kullanıcılarının sitelerdeki Google yazı tipi yükleme yöntemini değiştirmesine olanak tanır. Bu yazı tiplerinin nasıl yüklendiği sitenizin yüklenmesini etkileyebilir. Elementor ekibi, performansı artırmak için eklentilerinin çalışma şeklini değiştiren güncellemeleri sürekli olarak yayınlar.
Elementor ayarları ekranı, Google Fonts Yükleme Yönteminizdeki değişiklikleri seçmenize olanak tanır. En son sürümde, aralarından seçim yapabileceğiniz beş seçeneğe erişebilirsiniz:
- Varsayılan : Burada tarayıcı yazı tipi görüntüleme stratejisini tanımlar.
- Engelleme : Yazı tipi yüzüne kısa bir blok süresi ve sonsuz bir takas süresi verir.
- Fallback : Yazı tipi yüzüne son derece küçük bir blok periyodu ve kısa bir takas periyodu verir.
- İsteğe bağlı : Bu, metni gizleme söz konusu olduğunda Geri Dönüş ile aynıdır. Tek fark, yazı tipi tamamen yüklenmedikçe bir geri dönüş yazı tipi kullanmasıdır.
- Takas : Bir yazı tipi gerektiği gibi yüklenmiyorsa, yedek yazı tiplerinin mevcut olduğunda güncellenmiş bir sürümle yeniden oluşturulmadan önce kullanılacağı anlamına gelir.
2. Sitenizdeki Sunucu Yapılandırma Çakışmalarını Çözün
Herhangi bir eklenti ile bir sunucu çakışması yaşayabilirsiniz. Elementor'u kullanırken barındırma veya sunucu zorluklarınızı en aza indirmek için, Core Elementor Ayarlarına giderek erişebileceğiniz basit bir anahtar kullanabilirsiniz.
Sunucu Yapılandırma Çakışmalarını çözmek için "Editör Yükleyici" altındaki "Ön uç düzenleyici yükleyici yöntemini değiştir"i etkinleştirmek için Elementor > Ayarlar > Gelişmiş'i tıklayın (yukarıdaki ekran görüntüsüne bakın).
Bunu yaparak, farklı türdeki barındırma sunucusu sorunlarını çözmek için kullanışlı olan Elementor düzenleyici yükleyici yöntemini etkinleştirirsiniz.
3. Site Düzeninizi Optimize Edin
Web sitenizi etkileşimli ve kullanıcı dostu hale getirmek için Elementor, web sitenize tasarımlar eklemek için farklı düzenler sunar. Sitenizin içeriğiyle neyin iyi çalıştığına bağlı olarak seçebileceğiniz ızgara biçimi veya duvar stili gibi çeşitli seçenekler vardır.
Theme Builder'ın son güncellemesi, aslında, tüm siteye görsel bir genel bakışa sahip olmanızı sağlar. Hangi şablonun sitenin hangi alanları için geçerli olduğunu yönetebilir ve gerektiğinde içerikleri kolayca düzenleyebilir, yükseltebilir, değiştirebilirsiniz.
Ürünlerinizi iyi sergilemek için standart bir blog düzeni de kullanabilirsiniz. Yeni tanıtılan özel kesme noktaları, daha duyarlı web siteleri tasarlamanıza olanak tanır. Bir kesme noktası, temel olarak, bir içerik öğesinin aygıtın genişliğine yanıt verdiği bir noktadır.
Yani, web siteniz herhangi bir ekran boyutunda iyi görünecek ve ziyaretçilere herhangi bir cihazda daha iyi bir deneyim sunacaktır. Web sitesi düzeni, Elementor'un duyarlı kontrol yükleme mekanizmasıyla optimize edilebilen bu kesme noktaları ile cihaz genişliklerine bağlı olarak dinamik olarak değişir. Artık sunucu yanıt süresinde %23'e varan bir artış yaşayabilirsiniz.
Ayrıca Elementor 3.4 (ve üstü), tasarım düzeninizi orijinal Masaüstü, Mobil ve Tablet dahil olmak üzere yedi cihaza göre ayarlamanıza olanak tanır.
Daha fazla ekran alanı için yeni geniş ekran cihaz boyutlarıyla birlikte kesme noktaları sunar. Gerektiğinde önizleme boyutunu bağımsız olarak büyütme veya küçültme konusunda size tam bir esneklik sağlar ve böylece size çok daha yüksek performans sunan bir platform sunar.

4. Site Görsellerini Kaliteyi Düşürmeden Sıkıştırın
Görüntü optimizasyonu, sitenizin genel performansını iyileştirirken kritik bir faktördür. Müşteriler daha fazla görsel içerik arıyor ve web sitelerinin daha hızlı yüklenmesini istiyor. Web sitesi yükleme süresini azaltmak için resimlerinizi optimize etmelisiniz.
WordPress temaları ve tasarım trendleri daha fazla görsele doğru gelişmeye devam ettikçe, sitenize eklediğiniz videoların, fotoğrafların ve GIF'lerin sitenizi yavaşlatmamasını sağlamak zorunludur.
Ancak, sayfa yüklendiğinde tüm görselleri bir kerede indirmek yerine, web tasarımında kritik olmayan kaynakların (örn. ihtiyaç anı (örn. sayfayı aşağı kaydırma).
Geç yükleme, WordPress 5.5'ten beri bir WordPress Core özelliğidir, ancak eklenti, arka plan görüntüsü CSS'sini ayrı bir stil sayfasında derlediği için Elementor ile çalışmaz. Ama endişelenmeyin, WordPress'ten bahsediyoruz, yani her şey için bir eklenti var! İşte dikkate almanız gereken birkaç harika seçenek.
Optimol
Elementor ile uyumlu, WordPress için hepsi bir arada görüntü optimizasyonu çözümü. Resimleriniz ana sunucudan değil bir CDN'den sunulacak, bu da yükleme sürelerini ve bant genişliği kullanımınızı azaltır. Ziyaretçinin tarayıcısı ve görüntü alanı için doğru görüntü boyutunu seçer ve görüntüleri görüntülemek için gecikmeli yükleme kullanır.
ezmek
Elementor ile iyi çalışan bir başka yüksek puanlı görüntü optimizasyon eklentisi olan Smush, gelişmiş performans için görüntüleri kolayca yeniden boyutlandırmanıza, optimize etmenize ve tembel yüklemenize olanak tanır. Kayıpsız sıkıştırma sunar ve PNG, JPEG ve GIF dosyalarını toplu olarak işler. Eklerinizin yükleme sırasında süper hızlı sıkıştırmaya tabi tutulması için otomatik optimizasyonu da ayarlayabilirsiniz.
5. DOM Çıktısı ve Varlık Yükleme İşlevleriyle Performansı Artırın
Elementor'un en son sürümü, gelişmiş varlık yükleme ve erişilebilirlik gibi bir dizi performans özelliği içerir. Yeni sürüm, eski tarayıcılar (Internet Explorer gibi) için destek çekerek JS varlık dosyası boyutlarını azaltır.
Varlıklar için daha küçük dosya boyutları, yükleme hızını artırır ve koşullu olarak yüklenen ışık kutuları, bunları isteğe bağlı olarak yükleme seçeneğiyle birlikte gelir.
Elementor, web sitenizin hızını yavaşlattığında DOM öğelerini ve sayfa ağırlığını azaltmak için çalışır. Ayrıca, kullanıcıların herhangi bir içerik veya işlevsellik oluşturmadan önce tüm JavaScript dosyalarının tamamen indirilmesini beklemeden widget'ları görüntülemelerine olanak tanıyan satır içi yüklemeye sahiptir.
Web sitenizin en iyi şekilde optimize edildiğinden emin olmak için Elementor, CSS oluşturma ve DOM öğelerinin kaldırılmasında değişiklikler yapar.
Bununla birlikte, bazı iyileştirmeler, düşük bir aksama potansiyeline sahip olduklarından zaman alabilirken, diğerleri yanlış yapıldığında daha yüksek sorun potansiyeli olan yüksek risk içerir.
6. Eklentilerinizi Etkin Şekilde Seçin ve Yönetin
Elementor'un kendi oluşturucu özelliği vardır, ancak daha özelleştirilmiş bir gereksinim için eklentileri kolayca entegre eder ve yönetir. Örneğin Elementor, WooCommerce, Yoast, Rank Math, ACF, Toolset, Pods, LearnDash, Tutor LMS ve MemberPress gibi ünlü WordPress eklentileriyle iyi bir şekilde bütünleşir.
Formları Elementor ile entegre etmek için kısa kod widget'ını kullanabilirsiniz. Ancak bu yöntem, formlarınızı sayfalara gömmek için kısa kodlar kullandığından, Elementor tarafından desteklenen bir sayfada formunuzun görsel olarak özelleştirilmesine izin vermez.
Elementor ile çalışmak üzere tasarlanmış eklentileri seçmek için zaman ayırın. Happy Addons ve Essential Addons gibi eklentiler, sitenizin formlarını görsel düzenleyiciye entegre etmenize olanak tanıyan Elementor widget'ları ile birlikte gelir.
Gravity Forms, Contact Form 7 veya diğer popüler eklentileri kullansanız da, bu entegrasyonlar formlarınızın hem tasarım modunda hem de yayınlanan sayfalarda harika görünmesini sağlayacaktır. Ayrıca site performansını engellemeden her zamanki gibi verimli bir şekilde çalışacaklar.
Elementor sitenizdeki işlevi otomatikleştirmek için Uncanny Automator gibi bir eklenti de düşünebilirsiniz. Örneğin, kullanıcılar Elementor ile oluşturulmuş siteniz hakkında bir yorum gönderdiğinde, bir bülten abonelik formuyla birlikte bir açılır pencereyi otomatik olarak gösterecek bir tarif oluşturabilirsiniz.
Elementor 3.4'ün web sitesi tasarımı ve performansında ileriye doğru büyük bir adım olduğu gerçeği inkar edilemez. Siteyi ziyaret eden kullanıcılardan bilgi toplarken ürün satmak için web sitelerinin kullanıcı arayüzünü iyileştirebilen kaydırıcılar, animasyonlar ve canlı form oluşturucular gibi birçok gelişmiş özellik sunar.
Ancak daha da önemlisi, web sitesini optimize etmeye önem vermek önemlidir. Sitenizin performansının, modern çevrimiçi işletmeler için başarının birincil belirleyicisi olduğu. Sonuçta, etkileyici olmayan, yavaş ve hantal web siteleri, site ziyaretçilerini sinirlendirir ve bir şirketin kârlılığını öldürür. Potansiyel müşterilerinizin alternatif aramasını istemiyorsanız sitenizi optimize edin.