WP Site Hızı Optimizesi

Web sayfasının yüklenme hızının sitenin kullanılabilirliğinin ve SEO çalışmasının önemli bir parçasıdır. Google, sayfa yüklenme hızını arama sonuçlarında sıralamaya ve kullanıcı deneyimine etki eden 200 faktörden biri olarak değerlendirmiştir. Pek çok sitenin ilgi alanlarında rekabet ederek site trafiği sağlaması ve insanlara zengin kullanılabilirlik sunması her geçen gün daha önemli hale gelmektedir. Eğer siteniz hızlı bir şekilde yüklenmeyecek olursa bu rakiplerinize ziyaretçi kaptırabileceğiniz anlamına gelmektedir.

Aşağıda sitenizin yüklenme süresini optimize edecek 20 pratik ipucu paylaşılmıştır:

1. Resim Boyutunu Optimize Edin

Sitenizde yer alan resimler sayfa boyutunun büyük bir bölümünü oluşturmaktadır ve en nihayetinde sitenizin yüklenme süresine etki etmektedirler. Sitenizde yer alan resimleri HTML editöründe küçültmeniz yeterli değildir çünkü bu onun gerçek boyutuna değil onun sadece sayfada görünümüne etki etmektedir. Photoshop veya buna benzer ek araçlar kullanarak resmin boyutunu değiştirin.

Sitenizin resimlerini optimize edebilecek birkaç online araç:

- JPEG & PNG Stripper
- Smush.it
- Online Image Optimizer
- SuperGIF

2. Resim Dosyalarının Formatı

Sayfanızın yüklenme hızını optimize etmek istiyorsanız JPG, PNG ve GIF gibi standart resim formatlarına bağlı kalmalısınız.

3. Metin Grafiklerinden Kaçının

Bazı siteler sayfaların çekici gözükebilmesi için stilize edilmiş metinler kullanmaya ihtiyaç duyuyor olabilirler. Ancak, görüntü biçiminde olan metinlerin çok fazla web sayfası boyutuna sahip olduğunu ve SEO çalışmalarında yerinin olmadığını unutmamalısınız. Metin stillerini CSS kısmında kullanıp her şeyi metin biçimde tutmak iyi bir fikirdir.

4. Gereksiz Eklentilerden Kurtulun

Bir sitenin eklentilere ihtiyaç duyması sayfa yükleme hızını yavaşlatabilir. Her eklenti gerekli değildir. Örneğin sosyal paylaşım eklentileri bugünlerde hemen hemen her sitede vardır. Yapmanız gereken bu eklentilere alternatif olup olmadığını kontrol etmektir. Örneğin bunları varsayılan haliyle içerisinde barındıran bir CMS sizi eklenti kullanmaktan kurtaracaktır.

5. Satır İçi Javascript ve CSS Dosyalarından Kaçının

Sitenize ait Javascript ve CSS'i harici dosyalara yerleştirmek iyi bir yöntemdir. Sayfa bu dosyalara ait tarayıcı önbelleğini yüklediği zaman sayfa yüklenme süresini düşürecektir. Üstelik bu dosyaların harici şekilde yer alması site bakımını daha kolay hale getirecektir.

6. Önbelleğe Alma İşlemini Optimize Edin

Her bir ziyaretçi siteyi ziyaret ettiği zaman web sayfasının resimlerini, CSS ve Java dosyalarını yükler ve bu sayfa yüklenme hızına etki eder. Sitenizde HTTP önbellekleme sistemi kullanmanız durumda bu dosyalara ait kaynakların Proxy ve tarayıcı sayesinde önbelleğe alınmasını ve saklanmasını sağlarsınız. Sayfaların tekrardan yüklenmesi durumunda dosyalar yeniden indirilmek yerine önbelleğe alınan kısımdan yüklenirler. Üstelik sitenizin önbellekleme sistemini optimize etmeniz bant genişiliği (bandwith) ve sunucu masraflarını düşürecektir.

7. JavaScript'i Belgenin En Sonuna Yerleştirin

JavasScript'in belge sonuna yerleştirildiğinden emin olun çünkü JavaScript dosyası kendinden sonra gelen dosyaların yüklenmesini engelleyebilmektedir.

8. Yönlendirmelerden Kaçının

Yönlendirmelerden kaçınmak hızın artmasına imkan tanır. Bazı yönlendirmeler kaçınılmazdır ve kullanılması gereklidir fakat bunların sayfa yüklenme hızını arttıracak ek HTTP kullanacaklarını unutmayın. Kırık linkleri tespit edin ve onları hemen düzeltin.

9. DNS Aramalarını Düşürün

DNS Lookup veya DNS Aramaları, URL adresi bir tarayıcıya yazıldığında gerçekleşir ve bir DNS çözücü sunucunun IP adresine geri dönüş yapar. Bu işlemin gerçekleştirilmesi 20-120 milisaniye sürer ancak birden fazla hostname URL, resim, script dosyaları, stil sayfaları ve flash unsurları gibi bir sitedeki çeşitli elementler için kullanılabilir. Birden çok eşsiz hostname olması durumunda DNS aramaları sayfa yüklenme hızını arttıracaktır. Eşsiz hostname unsurlarının sayısını azaltmak paralel indirmelerin sayısını azaltacaktır ve sayfanın yüklenme hızını arttıracaktır. Altıdan daha az kaynağa sahip olduğunuzda tek bir sunucu kullanmanız idealdir.

10. Gereksiz CSS ve HTML Kodlarını Kaldırın

Gerekli olmayan HTML ve CSS kodlarını kaldırarak sitenizin kodunu hafifletin. Eğer siteniz bir CMS üzerinde kuruluysa temanın tasarımında kullanılan önceden belirlenmiş CSS sınıflarına ve id unsurlarına sahip olabilirsiniz. Kullanılmayan CSS sınıflarını ve id açıklamalarını kaldırın veya çoklu açıklamaları bir tanesinde birleştirin.

11. Çoklu İzleme Scriptlerinden Kaçının

Sitenizin trafik istatistiklerini takip etmek akıllıca olsa bile sayfanın yüklenme hızına engel olabilecek çoklu izleme yazılımları kullanmak tavsiye edilen bir şey değildir. Eğer WordPress gibi bir CMS kullanıyorsanız, WP istatistiklerinin veya Google Analytics kullanılmasına izin vermelisiniz, asla ikisini bir kullanmamalısınız. E-ticaret alışveriş CMS'leri ise silinemeyen varsayılan izleme scriptlerine sahiptirler, Google Analytics kullanmak isteseniz bile onları silemezsiniz.

12. G-Zip Kodlamasını Ayarların

Online dosya transferi sırasında toplam boyutun azaltılması için bilgisayarınızda yer alan benzer dosyalar zip'lenebilir ve sıkıştırılabilir; sitenizde yer alan ağır dosyalar ise G-Zip Sıkıştırma adı verilen yöntemle zip'lenebilir. Bu bant genişliğinde ve indirme süresinde tasarruf sağlar ve aynı zamanda sayfanın yüklenme hızını düşürür. Kullandığınız sunucuyu zip'lenmiş içeriği döndürebilecek şekilde ayarlamalısınız.

13. HTTP İsteklerini Azaltın

CSS Sprites kullanarak resim isteklerinin sayısını azaltın. Arkaplan resimlerini background-image ve background-poisition elementlerini kullanarak tek bir resme indirgeyin. Satır içi resimleri önbelleklenmiş stil sayfasıyla birleştirin. Kodda yinelenen scriptler yer alması durumunda HTTP istekleri çoğalacaktır bu yüzden yinelenen scriptleri tespit edip bunları kaldırmalısınız. Yineleme durumunu kontrol atlında tutmak için HTML sayfanızda Script etiketini kullanın.

14. Süre Belirleme / Önbellek-Kontrol Başlıklarını Kullanın

Sitenin sabit bileşenleri için Expires Header adı verilen süre belirleme başlıklarını ve dinamik bileşenler için Önbellek-Kontrol başlıklarını kullanabilirsiniz. Bu başlıklar resimler, stil dosyaları, scriptler, flash öğeleri gibi sitenin bileşenlerini önbelleklenebilir hale getirecektir. Bu HTTP isteklerini minimize edecek ve sayfanın daha hızlı yüklenmesini sağlayacaktır. Süre belirleme başlıklarını kullanarak sitenin önbelleklenebilir bileşenlerinin süresini kontrol altında tutabilirsiniz.

Eğer sunucunuz Apache ise önbelleklenen içeriğin süresini ExpiresDefault direktifi ile belirleyebilirsiniz. Bu direktif önbelleklenen içeriğin süresinin dolmasını bugünden birkaç yıl sonrasına ayarlayabilir.

15. Stil Dosyalarını Belgenin En Üstüne Yerleştirin

Stil dosyalarının belgenin en üst kısmına yerleştirilmesi standart bir yöntemdir. Sayfanın elementleri, bu stil elementleri sayesinde sunucudan işlenerek aşamalı olarak tarayıcınızda açılır. Navigasyon kısmından logosuna kadar sayfanın içeriği, kullanıcının internet hızı yavaş olsa bile sitenin yüklenmesine yönelik görsel aşama kullanıcıya zengin bir deneyim kazandırır. Aynı zamanda stil dosyaları sayfanın yüklenme hızını iyileştirmektedir.

16. JavaScript ve CSSte Minification İşlemi

Minification kodda yer alan kullanılmayan karakterlerin kaldırılması işlemine verilen isimdir. Bu yöntem ile kodun boyutu düşürülür ve yüklenme süresinde iyileştirme yapılabilir.

Minification için yaygın olarak kullanılan online araçlar şu şekildedir:

- JSMin
- YUI Compressor

17. POST yerine GET İsteklerini Kullanın

Tarayıcıda veri talep edildiği zaman HTML "METHOD" niteliklerinden "GET" niteliğinin veriyi "POST" niteliğinden daha çabuk işlediği tespit edilmiştir. Her iki HTTP yönteminin aynı sonucu veriyor olmasına rağmen POST veriyi göndermek için önce başlık kısmını kullanırken; GET sadece tek bir TCP paketini kullanmaktadır. Ayrıca GET, AJAX istekleri için önerilmektedir çünkü tarayıcı geçmişinde önbelleklenebilmektedir.

18. Gereksiz DOM Elementlerinden Kaçının

Çok fazla "< div >" elementi kullanılması gibi karmaşık biçimlendirmeler, JavaScript'te DOM (Document Object Model) erişimini yavaşlatabilmektedir. Sayfa düzeniniz için iç içe geçmiş tablolar kullanmak yerine grids.css, fonts.css ve reset.css gibi opsiyonları kullanabilirsiniz. Firebug konsoluna aşağıdaki girdiyi girerek DOM elementlerinin sayısını test edebilirsiniz:

document.getElementsByTagName('*').length

Ayrıca, sayfa düzenini düzeltmek için erişilen elementlere önbelleklenmiş yönlendirmeler yaparak, nodları çevrimdışı güncelleyerek ve JavaScript kullanımından kaçınarak DOM erişimini minimize edebilirsiniz.

19. Çerez Boyutunu Düşürün

Çerezlerde depolanan veriler sunucular ve tarayıcılar arasında değiştirilmektedir. Bu yüzden çerezlerin boyutunu düşürmek, transfer edilecek verinin boyutunu düşürmek anlamına gelir ve böylece sayfa yüklenme hızını iyileştirmiş olursunuz. Çerezlerin boyutunu düşürmek için gereksiz çerezleri ortadan kaldırın ve süre belirleme başlığını yakın zamana ayarlayın veya hiçbir şekilde süre belirleme başlıkları ile zaman belirlemeyin.

20. CMS Yazılımını Güncelleyin

Eğer WordPress gibi bir CMS yazılımı kullanıyorsanız güncellemelerini sık sık kontrol kontrol etmeniz gerekmektedir. İlk önce test için güncellemeleri farklı sunucularda gerçekleştirin. Sitenizin hızını iyileştirmek için yazılım güncellemelerini yakından takip etmelisiniz.

Tarih: Nisan 14, 2024

Kaynak: Ayhan KARAMAN