WP Rocket neden Gutenberg’i seçti ve performansı nasıl iyileştirir?

Son zamanlarda, Gutenberg ve performansı ile özellikler kolaylığı hakkında yaygın olarak konuşuluyor. Gutenberg siteniz için doğru seçim mi? Profesyonel eksilerden daha mı büyük? Daha fazla bilgi edinmek için merak ediyorsanız, okumaya devam edin! Yeni web sitemiz, başlıklar ve altbilgiler hariç% 100 Gutenberg. WPMarmite’in dediği gibi, bu web sitemizi benzersiz kılar. Ve deneyimlerimizi ve sonuçlarımızı paylaşacağız. Gutenberg’i neden seçtiğimizi ve bu seçimi bizim için neyin doğru yaptığını açıklayacağız. Bir bonus olarak, Gutenberg’in sizin için doğru çözüm olup olmadığını anlamanız için size bazı düşünceler vereceğiz.
Size en çok keyif aldığımız arka uçun faydaları hakkında bazı bilgiler vereceğiz ve sizin için neden yararlı olduklarını açıklayacağız. Gutenberg sayesinde site performansını nasıl geliştirdiğimizi göstereceğiz. Bu okumaktan zevk alacağınız bir şey olmalı! Neden Gutenberg’i ve Ocak ayında sonuçları nasıl seçtik, okuyucularımızı web performansı hakkında daha iyi eğitmek ve kullanıcı ve müşteri deneyimini geliştirmek için yeni web sitemizi nasıl başlattık. Bu aynı zamanda diğer önemli değişikliklerin zamanıdır: WordPress editörümüz.
O zamana kadar, web sitemiz çoğunlukla geliştiriciler için geliştiriciler tarafından inşa edildi. Klasik bir editör kullanıyoruz. Pazarlama ekibinin yeni bir yön sayfası oluşturması, içeriği güncellemesi ve hatta belirli sayfalar için yeni tasarımlar düşünmesi gerektiğinde, bu korkunç bir meydan okuma! Buna ek olarak, birçok şey WordPress endüstrisi gibi hızla değişen bir ortamda hızla kullanılabilir. Daha duyarlı olmak için büyük değişikliklere ihtiyacımız var. İlk şey birincisi: İhtiyaçlarımız ilk olarak pazarlama, tasarım ve gelişimimizin ihtiyaçlarına odaklanıyor. En yüksek doğruluğu ve elbette en iyi performans sonuçlarını garanti edecek ince ve basit bir çözüm arıyoruz. Başka bir ana gereksinim, içeriği güncellerken veya yeni bir sayfa oluştururken pazarlama ekibinin bağımsız olması gerektiğidir. Herhangi bir kodlamaya ihtiyaç duymadan, onlar için mümkün olduğunca kolay hale getirmek istiyoruz. Sonuç olarak, belirli ve net tasarım kuralları sayesinde arka uç, her bir sayfa türü ile yönetilmelidir. Başka bir deyişle, tasarım her türlü sayfada temiz ve tutarlı olmalıdır. Ekibimiz aynı tasarım kurallarını geliştirecek. Tasarımı kabul ederken gelişim kolaylığını göz önünde bulundurmaya çalışıyoruz. Özel blok sayısını mümkün olduğunca düşük tutmak istiyoruz.
Örneğin, arka plan, resim ve kısa açıklama ile belirli bir rol yaparsak, içeriğin aynı şekilde görüntülenebileceği başka bir sayfada aynı tasarımı yeniden kullanmaya çalışırız. Bu noktada editör hakkında karar vermedik. Sonraki: Tasarım ve geliştirme gereksinimlerini onayladıktan sonra seçimimizi nasıl yaparız, bağımsız pazarlama ihtiyaçlarımızı karşılamanın en iyi yolunu bulmaya başladık. İki seçenekle sona erdik: Gutenberg veya Gelişmiş Özel Eklenti. Gutenberg hakkında bazı endişelerimiz var. Gutenberg’in özel bir bloğu ile daha önce geliştirme deneyimimiz yok ve bazı makaleler çok hayal kırıklığı yaratıyor. Kullanımı oldukça zor görünüyor ve potansiyel performansı her gün etkinliği ile dengelemeliyiz. Uzmanlarla konuşarak, sorular sorarak ve araştırma yaparak endişelerimizin üstesinden geliyoruz. Dönüm noktası web temsilcimiz Whodunit ile konuşuyor. Bize Gutenberg’in ne kadar görsel olduğunu gösterdiler. Sayfanın arka uçtan tam olarak nasıl görüleceğini görmek mümkündür! Bildiğiniz gibi, bu aradığımız kolay bir çözüm. Gutenberg’in istediğiniz gibi toplayabileceğimiz bir LEGO ışınları yığını olduğu fikrini seviyoruz – bir sonraki bölümde ne demek istediğimizi göreceksiniz. Her şeyden önce, Gutenberg’i kullanan performansın faydaları var – bizim için diğer önemli gereksinimler.
İşte o zaman seçimimiz beyinsiz oldu. Seçimimizi şimdi benzersiz kılan şey, Gutenberg ile ilgili bazı endişelerin hala geçerli olup olmadığını merak ediyor olabilirsiniz. Bu seçimi bize benzersiz kılan şeyleri açıklayarak başlayalım. Yalan söylemeyeceğiz: Tasarım sürecinin arkasında çok fazla iş var. Ve geliştirme ekibi de çok dahil. Projemizi benzersiz kılan ilk husus özel blok sayısıdır. Tasarım Gutenberg’e odaklanmıyor. Unutma? Yeni web sitemiz üzerinde çalışmaya başladığımızda, sonunda Gutenberg’i kullanacağımızı bile bilmiyorduk. Aynı zamanda, birçok farklı şablon kullandık ve içeriği yönetmek için birçok farklı yolumuz var. Sonuç olarak, ortalamadan uzak olan 24 blok yapmamız gerekiyor. Blok sayısı büyük bir fark yaratır ve bu büyük ölçüde değişebilir. Sadece birkaç tane bile olabilir! Buna ek olarak, performans uzmanlığımız geliştiricileri biraz terletiyor! Ortalama müşterilerle karşılaştırıldığında, performans açısından beklentilerimiz oldukça yüksektir. En çok performans gösteren web sitesini istiyoruz. Ayrıca, performans optimizasyonu satıyoruz, değil mi? Deneyimlerimize dayanarak, sizin için bazı çıkarımlar:
Gutenberg’i düşünerek yeni web tasarımınız üzerinde çalışmaya başlayın. Bu size çok zaman kazandıracak ve daha verimli olacaksınız.
İşletmenize göre kaç bloğa ihtiyacınız olduğunu dikkatlice düşünün. Her şeyin özel olarak yapılıp yapılmayacağını düşünün. Gutenberg kullanırken bloklar gerçek farklılıklar yaratır.
En hızlı önbellek eklentisini de satmadığınız sürece, performansınızı WP Roket ile optimize edin. Bu çok zaman kazandıracak ve şimdiye kadarki en hızlı sitenin tadını çıkaracaksınız! Gutenberg sizin için doğru seçim olacak mı? Gördüğünüz gibi, her şey tamam değil. Bu bir sonraki potansiyel sorunuzu gündeme getiriyor: Gutenberg sitem için en iyi seçim olacak mı?
Bu soruyu tam olarak cevaplamak için Web temsilcimize Gutenberg’e geçmenin neden mantıklı olabileceğini soruyoruz. Üç ana nedenden dolayı geldik.
İlk olarak, Gutenberg WordPress tarafından yapıldı. Her gün birçok katılımcı bunu düzeltmek için çalışıyor. Gutenberg gerçekten WordPress’in kalbidir. Başka bir seçenek seçerken, WordPress değişiklik yaptığında güncellenmeyebilir.
Zamanla, Gutenberg ile nadiren yeni gelişme için bir temaya ihtiyacınız olacak. Örneğin, Haziran 2021’de planlanan eksiksiz bir site düzenleme ile, Gutenberg bloğunu kullanarak sitenin tüm öğelerini düzenleme yeteneğine sahip olacaksınız. Daha da önemlisi, onu oluşturmak için teknik becerilere ihtiyacınız yoktur. Başka öğeler yapmak istiyorsanız aynı şey de geçerlidir. Bu büyük bir adım. Ve Gutenberg’in açık kaynak ve ücretsiz olduğunu unutmayın.
Gutenberg geleceğe adımlar atmanızı sağlar. Tabii ki, görmezden gelebilirsiniz. Ancak inovasyon durmaz. Bir noktada, artık bir seçim değil. Ve bir WordPress siteniz varsa, Gutenberg en iyi seçimdir. Diğer çözümlerden ziyade Gutenberg ile inşa edilmiş bir WordPress sitesinde size yardımcı olacak birini bulmak her zaman daha kolay olacaktır. Uzun vadede düşünüyorsanız, seçim sizin için de zor olmayacak. Peki, Gutenberg’e geçmek kolay mı? Çok hızlı değil.
Ücretsiz temayı olduğu gibi kabul ediyorsanız, o zaman iyidir. İstediğiniz tüm blokları koyabilir, Gutenberg’in tadını çıkarabilir ve gelecekteki WordPress’e katılabilirsiniz! Ancak, belirli bir tasarım ve blok istiyorsanız, düzende size yardımcı olacak bir geliştiriciye ihtiyacınız vardır. Bu sizi ihtiyacımız kadar fazla zaman almayabilir. Ancak, yeni web sitesi geliştirmenizi normalden daha uzun ve daha pahalı hale getirecektir, çünkü yardıma ihtiyacınız olacaktır. Ayrıca önünüzdeki dik öğrenme eğrisinin farkında olmalısınız. Bu bizi son soruya götürüyor: Gutenberg’i kim seçmeli?
Serbest çalışan bir işçiyseniz veya küçük bir şirket işletiyorsanız, yine de geliştirici yardımına veya ek ücretlere ihtiyaç duymayan bir sayfa üreticisi kullanabilirsiniz. Gutenberg’in neden sizin için doğru seçim olabileceğini unutmayın – yukarıdaki ana nedenleri paylaşırız ve kendi seçimlerinizi yaparız. Daha büyük bir şirket işletiyorsanız ve özel bir gelişime ihtiyacınız varsa, evet, Gutenberg artık tereddüt etmeden sizin için doğru çözümdür. Hala biraz şüpheliyseniz, okumaya devam edin! Gutenberg arka ucunun faydaları nelerdir? Klasik bir editörden Gutenberg’e geçiş pazarlama ekibi için çok kolaydır. Dahası, işimizi daha kolay ve daha hızlı hale getiren bazı özelliklerin tadını çıkarmaya başladık. Başka bir deyişle, en başından beri düşündüğümüz hedeflere ulaştık! En çok keyif aldığımız özelliklerle birlikte bakalım. Bilmeniz gereken ilk şey, arka uçun neredeyse ön uçla aynı olmasıdır. Girdikten sonra, sadece “Sayfayı Düzenle” yi tıklayarak web sitesini keşfedebilir ve sayfada herhangi bir değişiklik yapabilirsiniz. Belirli sayfaları veya parçaları kolayca güncelleyebilir ve arka uçtan değişikliklerin nasıl görüldüğünü hızlı bir şekilde görebilirsiniz. Bu doğru: hemen orada görüldü. Bu her şeyi herkes için çok kolaylaştırır.
Arka uçtan ev
Gutenberg Custom Block, inşa öncesi bir öğe olan bir blok kütüphanesi sağlar.Her blok özelleştirilebilir ve düzenlenebilir ve istediğiniz sayfalara eklenebilir.Önceki bölümde okuduğunuz gibi, bir tasarım yapmak çok çaba gerektirir.Tasarım tamamlandıktan sonra özel bir blok kullanabilirsiniz.Bu, başlangıçtan yeni bir sayfa yapmak veya mevcut sayfadaki öğeleri değiştirmek anlamına gelir.Artık herhangi bir tasarıma ihtiyacınız yok.İhtiyacınız olan tek şey özel bloğunuz. Pratik olmak için özel engelleme WP roket listesi: CTA’nız için özel bir bloğunuz olduğunu söyleyin.Büyük olasılıkla birkaç sayfada kullanmak istiyorsunuz, değil mi?Özel bir blok sayesinde, istediğiniz yere CTA’yı kolayca dahil edebilirsiniz.Aynı tasarımı koruyacak ve istediğiniz kadar içeriği düzenleyeceksiniz.
Davet Notu Şimdi ne kadar zaman ve çaba tasarruf edebileceğimizi hayal edebiliyor musunuz? Yeniden kullanılabilecek bloklar ve desenler, yeniden kullanılabilecek bir blok da yapabilirsiniz. Tekrar kullanacağınız belirli içerik veya resimler içeren özel blokları depolamak mümkündür. Daha önce CTA örneğini alalım. Bir noktada, belirli CTA’yı değiştirmek istersiniz. Bir kez kolayca güncelleyebilirsiniz ve site genelinde güncellenecektir. Çok dilli bir web siteniz varsa aynı şey de geçerlidir. Her dil için CTA’yı bir kez düzenlersiniz ve hepsi bu. Dahası, bir desen de yapabilirsiniz. Yani, farklı şekillerde farklı kirişlerin bir kombinasyonunu yapabilirsiniz. Lego ışınlarından bahsettiğimizi hatırlıyor musunuz? Bu tam olarak böyle. Basitçe söylemek gerekirse, sahip olduğunuz kirişle oynayabilirsiniz: şekil, simge, içerik ve daha fazlası. Ve daha önce yaptığınız özel bir bloğu kullanarak yeni veya farklı bir sayfa oluşturabilirsiniz. Yeniden kullanılabilecek tüm bloklarımız: Yeniden kullanılabilecek roket WP bloklarının listesi
Gutenberg’in yön sayfası da yeni bir yön sayfası oluşturmak için kullanışlıdır. Yön sayfası SEO ve daha geniş bir pazarlama kampanyası için çok önemlidir. Her pazarlama ekibi, yeni bir yön sayfası oluşturmak için ne kadar süre ve bazen acı verici olacaktır. İstediğimiz içerik de dahil olmak üzere hızlı bir şekilde yeni bir sayfa oluşturmak ve iş olmadan ihtiyacımız olan tasarımı kullanmak gerçekten şaşırtıcı. Ve bir kez daha, düzenlemek istediğiniz belirli şeylerden bağımsız olarak içeriği güncellemek eskisinden daha kolaydır.
Bülten sayfalarının sayfalarını şimdi neden Gutenberg ile bu kadar mutlu olduğumuzu görebiliyor musunuz? Ve hala kalan performans bölümümüz var! Performansı nasıl geliştiririz (ve siz de!) WordPress sitesini yükleme zamanını artırmayı amaçlayan bir önbellek eklentisi haline geliriz, web performansının kendi sitemizin odak noktası olduğunu söylemek doğaldır. Görüşümüze göre, Gutenberg performans sorunlarının üstesinden gelmek için en iyi araçtır. Gutenberg’in daha iyi bir performans web sitesine ulaşmaya nasıl yardımcı olabileceğinin iki ana noktasında açıklayacağız. Lütfen bunun, sayfa üreticisi gibi alternatif Gutenberg olasılığının olumsuz görüşlerini ifade etmekle ilgili olmadığını unutmayın. Gutenberg’in sitemizin performansı açısından daha kolay ele alınmasını daha kolay buluyoruz. Gutenberg tarafından üretilen ışık HTML kodu HTML yapısı minimumda indirgenir. Başka bir deyişle, Gutenberg biraz
üretir. Bu, “ana UTAS çalışmasını” kontrol etmenizi ve tarayıcı oluşturma işlem süresini artırmanızı sağlayan önemli bir noktadır. Gutenberg küçük bir kod üretir, böylece sayfa içgörü önermelerinin “aşırı DOM boyutlarından kaçın” önermelerini sağlar. Aşağıda, aşağıdaki gibi Bölüm İkinci sütun üretmek için bir kod örneğidir: HTML yapı sütununun iki bölümünün örneği çok basittir:

Gutenberg, çok az HTML etiketi üreterek yüksek performanslı WordPress siteleri oluşturmak için ideal bir çözüm haline getirir. CSS ve JavaScript dosyaları, yukarıda açıkladığımız gibi isteklere göre yüklenir, pazarlama ekibimizin yeni bir sayfa oluşturmak için geliştiriciye güvenmek zorunda kalmadan özelleştirilebilecek bir siteye ihtiyacı vardır. Sonuç olarak, temamız 24 özel bloktan oluşmaktadır. Her bloğun kendi stil sayfasına ve gerekirse etkileşim için JavaScript dosyasına sahip olması gerektiğine karar verdik. Bu bir engelleme noktası olabilir, çünkü 25’ten fazla stil ve bazı JavaScript dosyaları tüm sayfalara yüklenmelidir. Temamızı, özellikle “kullanılmayan CSS kaynaklarını kaldırma” ile ilgili olanlar, özellikle “CSS kaynaklarını kaldırma” ile ilgili önerileri göz önünde bulundurarak geliştirdik. Bu öneri, geçerli sayfada kullanılmayan CSS kurallarını silmemiz gerektiğini öngörür. Bu nedenle, taleplere göre CSS ve JavaScript dosyalarını bloklardan yüklemenin yollarını bulmak için temalar geliştirmekten sorumlu ajansdan istiyoruz. Yani, dosya yalnızca blok sayfaya dahil edildiğinde yüklenir. Daha sonra sistemi mümkün olduğunca otomatikleştirmek için geliştiririz. Sonunda, bunu bildirme ve JavaScript dosyasını isteğe göre bloktan yükleme şeklimizdir: