Elementor vs Gutenberg: Son Kullanıcı Perspektifinden

Elementor çok üstün olduğu için Elementor ve Gutenberg'i karşılaştırmak biraz haksızlık olur. Ancak konuyla ilgili çok fazla soru olduğu için (Elementor vs Gutenberg), cevapları detaylandırmaya çalışacağız. İkisi arasındaki temel farkı anlayarak başlayalım.

Elementor bir sayfa oluşturucu, Gutenberg ise bir blok düzenleyicidir . Fark ne?

Bir sayfa oluşturucu, oluşturduğunuz sayfadaki her şeyi kontrol etmenizi sağlar. Düzenden tasarım öğeleri, tasarım öğesi ayarları, tasarım öğesi stilleri vb. Bu arada blok düzenleyici, oluşturduğunuz sayfa üzerinde tam özgürlük sunmuyor. Bazı yönlerden temanız tarafından sunulanlarla sınırlısınız. En kolay örnek, temanız tam genişlikte sayfayı desteklemiyorsa, Gutenberg'de tam genişlikte bir sayfa oluşturamazsınız.

Blok düzenleyicide tasarım öğeleriniz tema ayarlarınız tarafından kontrol edilir. Bunu kanıtlamak için iki farklı temaya Başlık ve Düğme eklemeyi deneyebilirsiniz. Blok düzenleyici (bu durumda Gutenberg), tasarım öğelerini gerçekten özelleştirmenize olanak tanır. Ama seçenekler son derece sınırlı.

Örneğin Başlık bloğu için, metin boyutunun yanı sıra yalnızca metin rengini de değiştirebilirsiniz. Yazı tipi ailesini, yazı tipi ağırlığını, yazı tipi stilini vb. değiştirme seçeneği yoktur. Aslında yazı tipi ailesini değiştirebilir ve belirtildiği gibi diğer bazı gelişmiş ayarları yapabilirsiniz, ancak tema özelleştiriciye gitmeniz gerekir ( Görünüm -> Özelleştir ). Başka bir deyişle, değişiklikler Gutenberg üzerinden yapılmaz.

Elementor vs Gutenberg: Kurgu Deneyimi

Devam etmeden önce Gutenberg hakkında kısa bir giriş. Klasik Düzenleyici'nin yerini alarak 5.0 sürümünden bu yana varsayılan WordPress düzenleyicisi olarak kullanıma sunuldu.

Classis Editor hala WordPress'in çekirdeğindedir, ancak varsayılan düzenleyici olarak ayarlanmamıştır. Gutenberg ile içerik oluşturma konusunda rahat değilseniz, klasik düzenleyiciye geri dönmek için Gutenberg'i devre dışı bırakabilirsiniz.

İlk ortaya çıkışında Gutenberg, Klasik Düzenleyiciyi daha modern düzenleme deneyimiyle değiştirme konusunda umut verici görünüyordu – ancak tüm WordPress kullanıcıları bundan gerçekten etkilenmedi. Daha temiz bir arayüz ile keyifli bir içerik düzenleme deneyimi sundu.

Ancak, Gutenberg bu günlerde giderek daha karmaşık hale geliyor. Çok fazla blok var (bazı bloklar gerçekten işe yaramaz). Her temanın farklı düzenleme deneyimi sunduğu gerçeğinden bahsetmiyorum bile.

Blog gönderileri oluşturmak için Gutenberg harika. Ama sayfalarca öyle düşünmüyoruz.

Bu arada Elementor (ve diğer sayfa oluşturucular) sayfa oluşturmaya odaklanır. Gutenberg gibi sayfa oluşturma ve blog yazısı oluşturma arasında durmaz . Sonuç olarak, canlı düzenleme deneyimi ve tasarım öğeleri üzerinde daha fazla ayar seçeneği ile daha iyi bir sayfa düzenleme deneyimine sahiptir.

— Sayfa Yapısı

Düzenleme deneyimi söz konusu olduğunda Elementor ve Gutenberg arasındaki en belirgin farklardan biri sayfa yapısıdır. Gutenberg'de tüm öğeler blok olarak kabul edilir, hatta birçok tasarım öğesini (metin, düğme, resim vb.) barındıran kapsayıcı bile. Elementor'da öğeler üç türe ayrılır:

• Bölüm (konteyner)
• Kolon
• Widget (gerçek tasarım öğesi)

Öğeleri üç farklı türe ayırma fikri, çok daha iyi sayfa düzenleme deneyimi sunar. İlk olarak, düzeni daha kolay tasarlamanıza olanak tanır. İkincisi, uzun bir sayfa için öğeleri daha kolay tanımlamanıza olanak tanır. Üçüncüsü, fikir aynı zamanda Figma ve Adobe XD gibi araçlarla oluşturulmuş bir tasarım konseptini canlı bir sayfaya dönüştürmenizi de kolaylaştırır.

En önemlisi, öğeleri farklı türlere ayırma fikri, özellikle yeni kullanıcılar için Elementor'un kullanılmasını kolaylaştırır ( okuyun: Elementor Nasıl Kullanılır).

— Sayfa Düzeni Kontrolü

Bir öğe eklemeye başlamadan önce, bir sayfa oluşturmak için yapmanız gereken ilk şey, sayfa düzenini ayarlamaktır. Sayfanın kenar çubuğunun olup olmadığını ayarlayabilirsiniz. Kenar çubuğu olan bir sayfa oluşturmak istiyorsanız, boyutun yanı sıra kenar çubuğunun konumunu da ayarlayabilirsiniz. Gutenberg'de sayfa düzenini ayarlar panelindeki Sayfa sekmesinden ayarlayabilirsiniz. Her temanın sunduğu düzen seçenekleri farklıdır. Örneğin GeneratePress temasında aşağıdaki sayfa düzeni seçeneklerine sahipsiniz.

Kenar çubuğu olmayan bir sayfa oluşturmak istiyorsanız, sayfa genişliğini ayarlamak için tema özelleştiriciye gitmeniz gerekir. Kenar çubuğu olan bir sayfada da öyle.

Elementor'da her şeyi ayarlar panelinden kontrol edebilirsiniz. Düzenleyici ve tema özelleştirici veya WordPress panosu arasında gidip gelmenize gerek yok.

— Duyarlı Düzenleme

Duyarlı düzenleme, günümüz çağında verilen çok önemli bir özelliktir; birçok internet kullanıcısı akıllı telefonlarını kullanarak bir web sitesine erişir. Web yaratıcıları, oluşturdukları web sitesinin her cihaz türünde güzel göründüğünden emin olmalıdır. Elementor da dahil olmak üzere sayfa oluşturucular bu alanda Gutenberg'in bir adım önündedir. Şimdiye kadar (WordPress 5.9.1'de), Gutenberg'in yerel duyarlı düzenleme özelliği yoktur.

Bu arada, duyarlı düzenleme nedir?

"Duyarlı düzenleme" terimi, her cihaz türündeki (masaüstü, tablet ve akıllı telefon) öğelerin ayarlarını kontrol edebileceğiniz sayfa düzenlemeyi ifade eder. Ayrıca duyarlı düzenleme, belirli bir öğenin görünürlüğünü belirli cihaz türüne göre kontrol etmenize de olanak tanır. Örneğin, bir düğmeyi yalnızca masaüstünde gösterilecek şekilde ayarlayabilirsiniz.

Duyarlı düzenleme, her cihaz türünün farklı bir ekran boyutuna sahip olması nedeniyle çok önemlidir. Tablet ve masaüstünden daha küçük bir ekran boyutuna sahip olduğu için akıllı telefondaki tüm öğeleri her zaman göstermeniz gerekmez. Duyarlı düzenleme ile, ana hedef kitle hedefinize göre belirli bir cihaz türünde bir sayfayı optimize edebilirsiniz.

Elementor'da, ayarlar panelindeki cihaz simgesine tıklayarak cihaz türleri arasında geçiş yapabilirsiniz.

— Kenar Boşluğu ve Dolgu Kontrolü

Kenar boşluğunu ve dolguyu ayarlama yeteneği, web sayfası oluşturmada çok önemlidir ( okuyun: dolgu ve kenar boşluğu arasındaki fark). Bu özellik, belirli bir öğe ile çevresindeki öğeler arasındaki boşluğu ayarlamanıza olanak tanır. Kenar boşluğu ve dolgu ayarlama özelliği olmadan, yalnızca karmaşık bir sayfa oluşturabilirsiniz.

Elementor (ve çoğu sayfa oluşturucu), bir öğenin kenar boşluğunu ve dolgusunu ayarlamak için yerleşik ayar seçeneklerine sahiptir. Bir bölüm, sütun veya widget olsun. Gelişmiş duyarlı düzenleme özelliği sayesinde her cihaz türünde farklı bir ayar bile kullanabilirsiniz. Bu arada Gutenberg, kenar boşluğunu ve dolguyu ayarlamak için yerleşik ayarlara sahip değil.

— Tipografi Kontrolleri

Bir sayfaya metin eklemek için birkaç yerel Gutenberg bloğu vardır. Başlık bloğu ve Paragraf bloğu dahil. Bu blokları eklediğinizde, boyutu ve rengi ayarlayabilirsiniz. Ancak yazı tipi ailesini değiştirme seçeneği yoktur. Varsayılan yazı tipi ailesini değiştirmek istiyorsanız, tema özelleştiriciye gitmeniz gerekir.

Bu arada Elementor, tipografiyi kontrol etmek için daha fazla ayar sunar. En önemlisi, ayarları kendi ayarlar panelinden yapabilirsiniz. Yazı tipi ailesi, yazı tipi boyutu ve metin rengi gibi temel ayarların yanı sıra yazı tipi ağırlığını, yazı tipi stilini, satır yüksekliğini, harf aralığını ve dekorasyonu da ayarlayabilirsiniz. Ayrıca, isterseniz özel bir yazı tipi kullanabilirsiniz (Elementor, Adobe Fonts ile entegrasyonu bile destekler).

— Görüntü ve Düğme için Şekillendirme Seçenekleri

Gazete temasındaki düğmenin görünümü, Gutenberg'de aynı ayarları (örneğin, boyut) kullansanız bile Avada'dan (veya diğer temalardan) farklıdır. Bunun nedeni, bu öğenin (düğmenin) temanız tarafından kontrol edilmesidir. Gutenberg'de yalnızca rengi, hizalamayı ve metin boyutunu ayarlayabilirsiniz. Kadence Blocks veya CoBlocks gibi bir eklenti kullanmadığınız sürece vurgulu efekti, sınır yarıçapı veya kenar boyutu gibi şeyleri ayarlayamazsınız.

Düğme bloğuyla aynı şekilde, Gutenberg de Görüntü bloğunu biçimlendirmek için çok az seçenek sunar. Yalnızca görüntü boyutunu, hizalamasını ve stilini (varsayılan ve yuvarlatılmış) ayarlayabilirsiniz.

Elementor'da bir düğmeye veya görüntüye daha fazla stil seçeneği uygulayabilirsiniz. Düğme için fareyle üzerine gelme efekti uygulayabilir, özel kenarlık yarıçapını ayarlayabilir, özel boyut ayarlayabilir, bir simge ekleyebilir, düğme metninin tipografisini ayarlayabilir vb. Görüntü için CSS filtreleri, görüntü maskeleme, kenarlık yarıçapı ve boyutu, fareyle üzerine gelme efekti vb. uygulayabilirsiniz.

Elementor vs Gutenberg: Aminasyon Etkileri

Bazı insanlar için animasyon efektleri gerçekten önemli değil. Ancak bazıları için animasyon efektleri eklemek, kullanıcılarını etkilemenin bir yoludur. Hover efekti, Elementor tarafından sunulan animasyon efektlerinin örneklerinden biridir. Ayrıca, bir öğeye giriş animasyon efekti de uygulayabilirsiniz. Bölüm, sütun veya widget olsun.

Pro sürümünü kullanıyorsanız, fare efektleri ve kaydırma efektleri bile ekleyebilirsiniz. Elementor tarafından sunulan animasyon efektleri şunlardır:

• fareyle üzerine gelme efekti
• CSS dönüşümü
• fare etkisi
• kaydırma efekti
• giriş animasyonu
• Paralaks

Ayrıca Elementor'un bir Lottie animasyonu eklemenize izin verdiğini unutmayın.

Gutenberg'den ne haber?

Şimdiye kadar, Gutenberg'in animasyon efektleri yok. Hatta giriş animasyonu.

Elementor vs Gutenberg: Geçmişi Düzenleme

Sayfa oluşturma/düzenleme birçok eylemi içerir. Düzeni ayarlamaktan, renkleri ayarlamaktan, tipografiyi ayarlamaktan vb. Arada sırada hiç istemediğiniz bir değişiklik yapabilirsiniz.

Veya şu durumu hayal edin: web sitenizde zaten bir sayfanız var ve onu düzenlemek istiyorsunuz. Düzenlemeyi tamamladığınızda, yeni değişikliklerden memnun değilsiniz ve bunun yerine önceki tasarıma geri dönmek istiyorsunuz. Elementor'da, yaptığınız yeni değişikliklerden memnun kalmamanız durumunda tasarımınızın önceki sürümünü geri almanıza olanak tanıyan bir düzenleme geçmişi özelliğine sahipsiniz.

Ayarlar panelindeki geçmiş simgesine tıklayarak özelliğe erişebilirsiniz. Açabileceğiniz iki sekme vardır: İŞLEMLER sekmesi ve REVİZYONLAR sekmesi. EYLEMLER sekmesi bugün (24 saat içinde) yaptığınız değişiklikleri saklarken, REVİZYONLAR sekmesi dün (veya daha eski) yaptığınız değişiklikleri saklar.

Gutenberg de aynı özelliğe sahiptir, ancak kullanımı daha karmaşıktır. Elementor gibi tuval alanındaki değişiklikleri göstermez. Bunun yerine, yaptığınız değişiklikleri göstermek için yalnızca sayfanızın sürümlerini karşılaştırır. Gutenberg değişiklikleri önizlemez. Bunun yerine, yalnızca değişikliklerle ilişkili kodu vurgular.

Karar

Açılış bölümünde belirtildiği gibi, Elementor ve Gutenberg'i karşılaştırmak haksızlıktır. Elementor, özellikle karmaşık bir tasarıma sahip sayfalar oluşturmak için kullanabileceğiniz bir sayfa oluşturucu olarak tasarlandığından çok daha üstündür. Elementor'da sayfa tasarımınız üzerinde tam kontrole sahipsiniz.

Bu arada Gutenberg, bir sayfa oluşturucu değil, bir blok düzenleyicidir. Gutenberg'de her şey temanız tarafından tanımlanır. Gerçekten de stil seçenekleri sunuyor, ancak seçenekler son derece sınırlı. Çoğu durumda, yalnızca boyut ve rengi ayarlamak için seçenekleriniz vardır. Her şeyden önce, Elementor'u bu kadar üstün kılan tasarım deneyimidir. Elementor, canlı bir düzenleme deneyimi sunan mükemmel bir düzenleyiciyle birlikte gelir.

Ancak Gutenberg, blog gönderisi oluşturma konusunda harika. Klasik Düzenleyici'den daha modern bir arayüze ve daha keyifli bir blog yazısı oluşturma özelliğine sahiptir. Gutenberg, basit bir tasarıma sahip bir sayfa oluşturmak için de iyidir. Ancak tasarımınız üzerinde tam kontrol sahibi olmak istiyorsanız, Elementor (ve diğer sayfa oluşturucu eklentileri) tartışılmaz.