WordPress’te oluşturmayı engelleyen JavaScript ve CSS nasıl kaldırılır
Web sitenizin performansını Google PagesPeed Insights’da test ettiyseniz, sadece silinmeyi bloke eden JavaScript ve CSS’yi silin veya kaldırmaya aşina olabilirsiniz. Ama eğer değilseniz, sorun değil. Bu yazıda, oluşturmayı derinlemesine engelleyen kaynakların nasıl ortadan kaldırılacağını araştıracağız. Web sitelerini yükleme hızı SEO’da büyük bir etki faktörüdür; Web siteniz ne kadar hızlı yüklenirse, arama sayfasında sıralama olasılığı o kadar yüksek olur. İyi bir web ana bilgisayarını kullanmak çok önemli olsa da, web sitenizi daha hızlı yüklemenin bir yolu, JavaScript ve CSS gibi kaynak oluşturmayı serbest bırakmaktır.
Basitçe söylemek gerekirse, Web sayfası ziyaretçiler tarafından görülmeden önce tarayıcı tarafından tamamen yüklenmesi gereken komut dosyaları ve stillerdir. Web kullanıcıları ve arama motorlarının çok sabırlı olmadığını biliyorsunuz. Bu nedenle bu sorunu çözmek önemlidir. Bu yazıda, WordPress’te oluşturmayı engelleyen JavaScript’i nasıl düzelteceğinizi öğreneceksiniz. WordPress ile yeni başlasanız bile, bu öğreticinin takip edilmesinin oldukça kolay olduğunu göreceksiniz.
Bu makalede:
Oluşturmayı engelleyen JavaScript ve CSS nedir?
Google PagePeed Insights Testi
JavaScript kaynakları oluşturma yöntemi
Çözüm
Oluşturmayı engelleyen JavaScript ve CSS nedir? Ziyaretçiler web sitenizi açtıklarında, tarayıcıları önce HTML yüklemeden önce destekleyen JavaScript ve CSS dosyalarını yüklemelidir. Genellikle, böyle yapmalıyız – stil sayfası veya komut dosyası olmayan bir web sayfası çirkin görünecek ve kullanılamaz
Ancak sorun, bu dosyalar tamamen yüklenmedikçe, Web sayfalarının tarayıcıda oluşturulmayacağıdır. Bu nedenle, oluşturmayı engelleyen JavaScript adı. Tarayıcının oluşturmadan önce web sayfasının stilini ve komut dosyasını yüklemesi önemli olsa da, bu ekstra gecikme, web sayfasının görünümüne zarar vermeden önlenebilir. Dahası, bunu yapmak yükleme süresini de en aza indirecektir. İşin püf noktası, ziyaretçilerin inişten hemen sonra gördüğü web sayfalarını etkilemeyen komut dosyasının ve stil sayfasının yüklenmesini geciktirmektir. Başka bir deyişle, tarayıcının önlenmesi, kullanıcının aşağı kaydırmadan önce göreceği web sayfasının üst kısmını etkilemeyen herhangi bir dosya içerir, bu sorunu çözecektir. Bu web sayfası bölümü en iyi paro içeriği (ATF) olarak adlandırılır. Bu makaleyi keşfetmeden önce Google Pagespeed Insight aracına alışmanız önemlidir. Google PagesPeed’in Insight Testi JavaScript ve CSS render’ı engellemek için adımlar atmadan önce, en iyisi önce testi çalıştırmaktır. Ve Google PagePeed Insights dışındaki web sitelerinin performansını test etmek için daha iyi bir araç yoktur. Öyleyse oraya git ve birkaç test yapalım.
URL bölümüne web sitenizin bağlantısını yazın. Bundan sonra analiz düğmesini tıklayın. Testi çalıştırmayı bitirdikten sonra, web sitesi performans puanı ekranda görüntülenir. En iyi performans gösteren site, 90-100 arasında puan alan bir sitedir. Zor bir çağrı mı? Bahis, ama bu başarılabilir. Web siteniz performansı azalırsa, Google daha iyi performans göstermesi için bazı öneriler sunacaktır. Büyük olasılıkla, önerilerden biri, oluşturmayı engelleyen kaynakları ortadan kaldırmaktır. Bu sekmeyi açık bırakın çünkü daha sonra tekrar ziyaret edeceğiz. JavaScript ve CSS’yi kaldırma yöntemi, tek bir kod satırı yazmak zorunda kalmadan bu sorunu çözebilecek bir eklenti olduğunu tahmin ediyor mu? Eğer sen, yeterince haklısın.
Bir uyarı: Google tarafından test sonuçlarında uyarıldığı gibi, JavaScript ve CSS’yi silerseniz, oluşturmayı bloke eden temanıza zarar verebilir. Devam etmeden önce WordPress sitenizin bir yedeklemesini yapmak akıllıca olacaktır. Hız optimizasyon hizmetimizi de isteyebilirsiniz ve sitenizde tanımlanan tüm sorunları ele alacağız. Oluşturmayı engelleyen JavaScript sorunlarını işleyebilen birkaç WordPress eklentisi vardır. Ancak, iki büyük isim göreceğiz: W3 Total Cache ve AutoPtimize. Toplam W3 W3 önbellek toplam önbellek, WordPress için harika bir performans geliştirmenin bir eklentisidir. Önbelleğe alma problemleriyle başa çıkmanın yanı sıra, bu aynı zamanda stil sayfalarının ve komut dosyalarının neden olduğu yükleme sorunlarını düzeltmek için harika bir araçtır. Yani yapmak istediğiniz ilk şey eklentiyi yüklemek ve etkinleştirmektir. Kurulum ve aktivasyondan sonra performansa gidin >> Genel Ayarlar
Ardından, Minify’a gidin. Burada, Minify’ı etkinleştirin ve Minify modunu kılavuza ayarlayın.
Ardından tüm ayarları kaydet düğmesini tıklayın. Minify seçeneği etkinleştirildiğinde, JavaScript ve CSS oluşturmayı silmek için yapılacak bir sonraki şey, web sayfalarınızın tam oluşturulmasını geciktiren stillere ve komut dosyalarına bağlantılar almaktır. Google PagePeed Insights aracının tekrar yararlı olduğu yer burasıdır. Daha önce açık bıraktığınız sekmeye geri dönün. Oraya kadar, yüzdeyi engelleyen kaynakları kaldırarak sekmeyi tıklayın. Azaltılması gereken komut dosyalarına ve CSS dosyalarına bağlantılar görüntülenir.
Hasarlı Bağlantılar Yapma Kılavuzu: Manuel ve Ahref Araçları ile WordPress’te Çocuk Teması Nasıl Yapılır
Basitçe söylemek gerekirse, Web sayfası ziyaretçiler tarafından görülmeden önce tarayıcı tarafından tamamen yüklenmesi gereken komut dosyaları ve stillerdir. Web kullanıcıları ve arama motorlarının çok sabırlı olmadığını biliyorsunuz. Bu nedenle bu sorunu çözmek önemlidir. Bu yazıda, WordPress’te oluşturmayı engelleyen JavaScript’i nasıl düzelteceğinizi öğreneceksiniz. WordPress ile yeni başlasanız bile, bu öğreticinin takip edilmesinin oldukça kolay olduğunu göreceksiniz.
Bu makalede:
Oluşturmayı engelleyen JavaScript ve CSS nedir?
Google PagePeed Insights Testi
JavaScript kaynakları oluşturma yöntemi
Çözüm
Oluşturmayı engelleyen JavaScript ve CSS nedir? Ziyaretçiler web sitenizi açtıklarında, tarayıcıları önce HTML yüklemeden önce destekleyen JavaScript ve CSS dosyalarını yüklemelidir. Genellikle, böyle yapmalıyız – stil sayfası veya komut dosyası olmayan bir web sayfası çirkin görünecek ve kullanılamaz
Ancak sorun, bu dosyalar tamamen yüklenmedikçe, Web sayfalarının tarayıcıda oluşturulmayacağıdır. Bu nedenle, oluşturmayı engelleyen JavaScript adı. Tarayıcının oluşturmadan önce web sayfasının stilini ve komut dosyasını yüklemesi önemli olsa da, bu ekstra gecikme, web sayfasının görünümüne zarar vermeden önlenebilir. Dahası, bunu yapmak yükleme süresini de en aza indirecektir. İşin püf noktası, ziyaretçilerin inişten hemen sonra gördüğü web sayfalarını etkilemeyen komut dosyasının ve stil sayfasının yüklenmesini geciktirmektir. Başka bir deyişle, tarayıcının önlenmesi, kullanıcının aşağı kaydırmadan önce göreceği web sayfasının üst kısmını etkilemeyen herhangi bir dosya içerir, bu sorunu çözecektir. Bu web sayfası bölümü en iyi paro içeriği (ATF) olarak adlandırılır. Bu makaleyi keşfetmeden önce Google Pagespeed Insight aracına alışmanız önemlidir. Google PagesPeed’in Insight Testi JavaScript ve CSS render’ı engellemek için adımlar atmadan önce, en iyisi önce testi çalıştırmaktır. Ve Google PagePeed Insights dışındaki web sitelerinin performansını test etmek için daha iyi bir araç yoktur. Öyleyse oraya git ve birkaç test yapalım.
URL bölümüne web sitenizin bağlantısını yazın. Bundan sonra analiz düğmesini tıklayın. Testi çalıştırmayı bitirdikten sonra, web sitesi performans puanı ekranda görüntülenir. En iyi performans gösteren site, 90-100 arasında puan alan bir sitedir. Zor bir çağrı mı? Bahis, ama bu başarılabilir. Web siteniz performansı azalırsa, Google daha iyi performans göstermesi için bazı öneriler sunacaktır. Büyük olasılıkla, önerilerden biri, oluşturmayı engelleyen kaynakları ortadan kaldırmaktır. Bu sekmeyi açık bırakın çünkü daha sonra tekrar ziyaret edeceğiz. JavaScript ve CSS’yi kaldırma yöntemi, tek bir kod satırı yazmak zorunda kalmadan bu sorunu çözebilecek bir eklenti olduğunu tahmin ediyor mu? Eğer sen, yeterince haklısın.
Bir uyarı: Google tarafından test sonuçlarında uyarıldığı gibi, JavaScript ve CSS’yi silerseniz, oluşturmayı bloke eden temanıza zarar verebilir. Devam etmeden önce WordPress sitenizin bir yedeklemesini yapmak akıllıca olacaktır. Hız optimizasyon hizmetimizi de isteyebilirsiniz ve sitenizde tanımlanan tüm sorunları ele alacağız. Oluşturmayı engelleyen JavaScript sorunlarını işleyebilen birkaç WordPress eklentisi vardır. Ancak, iki büyük isim göreceğiz: W3 Total Cache ve AutoPtimize. Toplam W3 W3 önbellek toplam önbellek, WordPress için harika bir performans geliştirmenin bir eklentisidir. Önbelleğe alma problemleriyle başa çıkmanın yanı sıra, bu aynı zamanda stil sayfalarının ve komut dosyalarının neden olduğu yükleme sorunlarını düzeltmek için harika bir araçtır. Yani yapmak istediğiniz ilk şey eklentiyi yüklemek ve etkinleştirmektir. Kurulum ve aktivasyondan sonra performansa gidin >> Genel Ayarlar
Ardından, Minify’a gidin. Burada, Minify’ı etkinleştirin ve Minify modunu kılavuza ayarlayın.
Ardından tüm ayarları kaydet düğmesini tıklayın. Minify seçeneği etkinleştirildiğinde, JavaScript ve CSS oluşturmayı silmek için yapılacak bir sonraki şey, web sayfalarınızın tam oluşturulmasını geciktiren stillere ve komut dosyalarına bağlantılar almaktır. Google PagePeed Insights aracının tekrar yararlı olduğu yer burasıdır. Daha önce açık bıraktığınız sekmeye geri dönün. Oraya kadar, yüzdeyi engelleyen kaynakları kaldırarak sekmeyi tıklayın. Azaltılması gereken komut dosyalarına ve CSS dosyalarına bağlantılar görüntülenir.
Gördüğünüz gibi, dosyanın bağlantısı kesildi. Tam bir URL almak için imleci herhangi bir bağlantıya yönlendirin, sağlayın ve bağlantı adresini kopyalayın. Önce JS dosyasını küçülteceğiz, bu yüzden .JS’den birini kopyalayın. Kopyalanan bağlantı ile WordPress kontrol panelinizi tekrar açın. Bu sefer performansa gidin >> Minify
JS bölümünü bulana kadar aşağı kaydırın. JS Minify Ayarları bölümünde, etiket alanının alanını göreceksiniz. “Async” kullanarak gömme türünü bloke etmemeye ayarlayın.
Hasarlı Bağlantılar Yapma Kılavuzu: Manuel ve Ahref Araçları ile WordPress’te Çocuk Teması Nasıl Yapılır