WordPress’te sayfa ağırlığını azaltmak için en iyi uygulama kılavuzu
Yenileme: Mart 2021 Web sayfası ağırlığı söz konusu olduğunda, önemli boyut. Sonuçta, web sayfası dosyasının boyutu ne kadar küçük olursa, o kadar hızlı yükler. Bunun dikkate alınması gerekmez. Sayfa Ağırlığı – aka sayfa veya sayfa boyutu – bir sayfa oluşturmak için kullanılan tüm dosyalar da dahil olmak üzere belirli web sayfalarının genel boyutuna atıfta bulunarak: HTML belgeleri, stil sayfaları, resimler, komut dosyaları ve diğer medya. Bu, sayfanın hızı, aktif zaman, ilk bayta kadar zaman, HTTP istekleri vb. Ama bu gerçekten önemli mi? Bu anlamlı bir metrik mi? Ve sayfa boyutunu nasıl azaltmalı ve WordPress sitenizi nasıl hızlandırmalısınız?
Haydi bakalım. 2021’deki ortalama masaüstü web sitesi 1990’larda 2038.4 kb idi, web sitesi oldukça basitti ve basit HTML dosyalarından ve küçük görüntülerden (ve GIF’lerden yapımında!) Oluşuyordu. Şu anda, çeşitli HTML, CSS ve JavaScript dosyaları, resimler, videolar, yazı tipleri ve diğer dosya türlerini girmek için geliştirdiler. HTTP Arşivi tarafından toplanan verilere göre, 2010’daki web sayfasının ortalama boyutu 2021’deki 2038.4 kb’ye kıyasla 467.7 kb idi.
Web sitesi yıllarca geliştiğinden, web sayfalarının ortalama boyutu katlanarak arttı. Devam etmeden önce gösterilmesi gereken bazı uyarılar olmasına rağmen:
HTTP Arşivi tarafından yayınlanan ortalama bir web sayfası boyutu vardır, ortalama büyük bir veri toplama işleminden alınır. “Tipik” web sitesini temsil ediyor mu? Muhtemelen değil. Demek istediğim, sıradan bir web sitesi nedir? HTTP arşivinden bu sayıları kendi web siteniz için bir ölçüt olarak kullanmamalısınız. Onlar tarihsel eğilimlerdir.
Bazı web siteleri gerçekten zaman zaman küçüldü. Birkaç web sitesi, videolar, tam ekran resimleri, özel yazı tipleri ve diğer tasarım öğeleriyle tam medya kullanırken, diğeri daha minimalist bir yaklaşıma bağlı kalmıştır.
Videolar uzun süre ortalama sayfa ağırlığının% 65,9’unu yapar, geliştirici görüntünün boyutunu ve toplam sayfa boyutunu ne kadar dikkate aldıklarını kaydetmiştir. Ama woah … videonun resmi gerçekten nasıl ele geçirdiğini görün:
En son HTTP arşiv verileri, videonun ortalama web sayfalarının toplam boyutunun üçte ikisine katkıda bulunduğunu gösteriyor. Bir örnek olarak, Mayıs 2016’da masaüstü bilgisayarlar için sadece 286,3 kb’lik ortalama video ağırlığı. İlginçtir ki, 2021’deki ortalama video boyutu hücresel olarak masaüstünden daha fazlaydı. Video kullanımı son yıllarda patladı. Giderek daha fazla web sitesi video başlıkları ve diğer medya öğelerini kullanıyor. WordStream’e göre, çevrimiçi pazarlamacıların% 87’si video içeriği kullanıyor, çevrimiçi etkinliklerin üçte biri video izlemek için harcanıyor ve mobil cihazlarda video içeriğinin yarısından fazlası görülüyor. Özel yazı tipi, Webfont’un hiçbir yere gitmeyeceği sayfanın boyutuna başka bir katkıda bulunur, ancak istatistiklerin gösterdiği gibi, popülerliğin büyümesi endişelenecek bir şey değildir. Kasım 2010’da Fonts, Ocak 2021’deki 132.1kb’ye kıyasla toplam sayfa boyutunun 59.2KB’sine katkıda bulundu. Daha ilginç olan, iyi yazı tipleri için ortalama HTTP talebinin 2015’te dört, 2016’da üçe nasıl geçtiğini nasıl sağladı. 2017’den beri dörtte – sadece masaüstü bilgisayarlar beşe yükseldi. Bu, tasarımcıların ve geliştiricilerin en uygun sayıda web yazı tipi belirlediklerinin bir göstergesi olabilir.
Komut dosyası ve stil sayfası ağırlığı ortalama JavaScript dosyasını, 2010 yılı sonundan bu yana% 316,4 artışla artmaya devam ediyor. JavaScript için ortalama HTTP talebi sayısı da arttı. CSS bayt da 2021’de ortalama artışa devam ediyor ve masaüstünden 73.3 kb ve hücreselden 68.7 kb. Sayfa gerçekten önemli mi? İnternet hızlanmıyor mu? Tıpkı aerodinamik sıkı kıyafetler giyen, rüzgarda üflenen gevşek kıyafetlerden kaçınan bir bisiklet sürücüsü gibi, geliştiriciler de en uygun hızda görünebilmeleri için sitelerini mümkün olduğunca rahat tutmalıdır. Sayfanın ağırlığı bir dizi web sitesinden sadece bir tane olsa da ve dürüst olmak gerekirse, bir numaralı önceliğiniz olmamalı da, doğrudan sayfa hızına katkıda bulunduğu için dikkate alınması gereken önemli bir faktördür. Evet, internet daha hızlı hale geliyor. Tarayıcı, önbellek, daha hızlı ağlar, CDN ve diğer teknolojiler web’i kullanıcılar için daha hızlı hale getirir. Ancak bu, web sitenizin ekstra yağ getirmesine izin vermek için bir neden değildir. Radware, 2011’den beri ilk 100 e -ticaret sitesinin yükleme süresini izliyor ve etkileşim kurma süresinin ve süresinin önemli ölçüde azaldığını buldu. Sebep? Sayfa boyutu ve karmaşıklığı. Sayfa başka bir zamanda daha şişmiş ve karmaşık hale geldiğinde, bu genellikle daha yavaş olan yükleme süresi eğilimini sürdürür. İdeal web sayfası boyutu ne kadar? Tammy Everts web performans uzmanları, web sayfalarını hızlı bir şekilde yüklemek için ideal bir önlem olarak 1MB önerir. Birçok şirketin performans bütçelerinin bir parçası olarak sayfaları için 1MB hedeflediğini yazarak devam etti. Performans bütçesi hakkında daha fazla bilgi için Brian Jackson’ın bu harika okumasına bakın.
Hücresel kullanıcılarınız ne olacak? Daha önce bu blogda algılanan performansı tartıştım, bu nedenle web sitesini kullanıcı deneyiminde bir artış elde etmek için gerçekten daha hızlı hissettirmenin nasıl mümkün olduğunu biliyorsunuz. Bununla birlikte, algılanan performansı iyileştirmek, özellikle hücresel konularda her zaman bir cevap değildir.
Bant genişliği kısıtlamaları ve/veya veri limitleriyle karşılaşan hücresel kullanıcıların şişmiş web sitelerini indirmek için zaman veya veri kotası yoktur, bu nedenle web siteniz bu kullanıcı için mümkün olduğunca verimli bir şekilde yapılmalıdır. Çünkü siteniz onlar için yeterince yüklenmezse, sitenizden ayrılırlar. Bant genişliği ve veri sınırlamaları kullanıcınız bir ülkeden diğerine değişecektir, ancak harika bir çevrimiçi hesap makinesi var, site maliyetlerim, maliyeti dolar cinsinden, dünyanın dört bir yanındaki sayfalarınızdaki maliyetleri ne kadar söyleyebilir. Bu, hücresel kullanıcıların birinci dünya ülkesindeki sayfalarınızı üçüncü dünya ülkesinde nasıl gördüğüne dair gözlerinizi açacaktır.6 WordPress 1’deki sayfanın ağırlığını azaltmak için ipuçları. sayfa. Genellikle, web sayfalarına yüklenen en uzun dosyadır, ancak optimize edilmesi nispeten kolaydır. Görüntünüzü gözden geçirmek ve ihtiyacınız olmayan her şeyi silmek için zaman ayırarak başlayın. Ardından, Imagify gibi görüntü optimizasyon araçlarıyla sıkıştırın. Bu, gereksiz dosya bilgilerini siler ve görüntünüzü daha hızlı yüklemeye yardımcı olur. Daha sonra Sprite CSS oluşturmak, sayfanın ağırlığını azaltmaya yardımcı olabilir. Bu teknik, birçok görüntüyü tek bir resme indirmenizi sağlar. Ardından CSS kullanın, Sprite’ı manipüle edebilir ve sayfada yalnızca belirli parçaları görüntüleyebilirsiniz. Spritmes gibi Sprite CSS yapılmasına yardımcı olabilecek bazı harika araçlar vardır.
Yavaş bir görüntüyü sevmek, özellikle hücresel kullanıcılar için sayfa açık süresini de artırabilir – ve bu, WP roketinde etkinleştirebileceğiniz bir özelliktir. WP roketini şimdi ve iyileştirme testini hemen alın! 2. CSS ve JavaScript varlıkları daha küçük ve birleştirin Site stilinizi artırır ve birleştirin ve komut dosyası kaynaklarınızı kolaylaştırabilir ve sitenizden gereksiz kodları kesebilir. Bu sadece sayfanın ağırlığını azaltmaya yardımcı olmakla kalmaz, aynı zamanda sitenizi yüklemek için gereken HTTP isteklerinin miktarını da azaltabilir. WP roket, CSS ve JS dosyalarını çeşitli tıklamalarda küçültmenin ve sıkıştırmanın en kolay yoludur. Aslında, dosyalarınızı “Statik Dosya” sekmesi altında azaltabilir ve birleştirebilirsiniz. Azaltılmak ve birleştirilmek istediğiniz dosyayı kontrol edin. Tamamlandıktan sonra “Değişikliği Kaydet” i tıklayın. CDN kullanarak içerik dağıtım ağını kullanın, sayfanızın sunucunuzun konumundan, yani uluslararası trafikten uzak bir yerde kullanıcılar için ne kadar hızlı yüklendiğini hızlandırabilir. CDN’nin nasıl çalıştığı hakkında daha fazla bilgi için ve sizin için en iyisini bulmak için WordPress için en iyi içerik dağıtım ağı olan WP Roket Kılavuzu’na bakın. Cloudflare, popüler CDN WP roketi ile kolayca entegre edilebilir. Bunu yapmak için “CDN” sekmesini açın
Cloudflare’yi etkinleştirmek ve ardından hesabınızı eklemek için WP Rocket’te.Daha fazla bilgi için, WP roketiyle Cloudflare’nin nasıl kullanılacağına dair WP roket belgelerine bakın.4. Tarayıcı önbelleğinden yararlanın, kullanıcının tarayıcısı statik dosyaları önbellekte depolayabilirse, sitenizi tekrar ziyaret ederken tekrar indirmeleri gerekmez.WP Rocket’teki siteniz için önbellek tarayıcısını etkinleştirdiğinizden emin olun.Önbellek tarayıcısı Apache sunucusuna otomatik olarak uygulanır, bu nedenle kullanıcıların ek adımlar atmasına gerek yoktur.Ancak Nginx sunucusundaki kişiler, WordPress veya PHP yüklemeden doğrudan statik sayfalar sunarak WP-Rocket’ı daha hızlı hale getiren Rocket-Nginx, NGINX yapılandırmalarını kullanabilirler.5. Web sitenizde gerçekten sekiz yazı tipine ihtiyacınız olup olmadığı gereksiz webfontu azaltın mı?Yoksa ikisi (biri başlıklar ve diğeri paragraf metni için) çalışacak mı?
