9 Adımda Web Sitemi Nasıl Hızlandırabilirim?

9-adimda-web-sitemi-nasil-hizlandirabilirim

Herhangi bir anahtar kelime için Google milyonlarca web sitesi sonucunu karşımıza çıkarabiliyor. Peki tam olarak neye göre sıralama yapıyor. SEO kriterleri adı altında 200’ün üzerinde kriterden bahsedebiliriz. Her biri kendi içlerinde yorumlanabilir tabii ki. Google’ın yapay zeka algoritmalarının tam olarak nasıl çalıştığını kimse bilmiyor ama yine de Google tam olarak ne yapmamız gerektiğinin ipucunu bize sürekli veriyor.

Milyonlarca web sitesini sınava siz sokacak olsaydınız ne yapardınız? Neye göre birinciyi belirlerdiniz? Benim ilk söyleyeceğim site hızı olurdu elbette. “Hızlı açılmayan siteyi neyleyim?” derdim. Gerçekten Google için de önemli bir kriter olduğunu her yerde görebilirsiniz.

Bu yazımda hem site hızından bahsedeceğim hem de Google’ın botlarının sitenize hızlı erişmesinden bahsedeceğim. Ping süresini bonus bilgi olarak düşünebilirsiniz.

Adım Adım Web Sitesi Hızlandırma

Web sitesi hızlandırma konusunda uygulamalı olarak kendi sitem üzerinden ilerleyeceğim. Şu anda siteyi hızlandırmak için hiç bir şey yapmadım. Yazının sonunda before & after şeklinde sizlere sonuçları göstereceğim. Öncelikle site hızını nasıl kontrol edeceğimizi öğrenelim.

PageSpeed Insight: https://developers.google.com/speed/pagespeed/insights/

Google Test My Site (3G Bağlantı Hızı): https://testmysite.withgoogle.com/intl/tr-tr

GT Metrix: https://gtmetrix.com

Bu üç aracı kullanarak web sitemizin hızını ölçebiliriz. Aynı zamanda ana sayfamıza gelip sağ tık > incele > network yaparak da site hızımıza dair bilgiler edinebiliriz.

Sunucu Seçimi

Hızlı bir web sitesine giden yol tabi ki temelden geçer. Sitenizi hangi sunucuda barındırıyorsunuz? Hızlı bir linux reseller ya da VDS sunucu mu kullanıyorsunuz yoksa hala paylaşımlı hosting mi kullanıyorsunuz? Paylaşımlı hostingleri yüksek performans elde etmek isteyen kişiler için kesinlikle önermiyorum. Bunun yerine VDS çözümleri oldukça iyi sonuçlar veriyor.

Bu yazıyı yazarken paylaşımlı sunucu kullanıyordum fakat Nosspeed firması ile görüşerek VDS sunucuya geçiş yaptım. Ve aradaki farkları sizinle en alt bölümde paylaşıyor olacağım.

Sunucu Optimizasyonu

Sunucunuzu barındırdığınız firmaya cüzi bir ücret karşılığında sunucu optimizasyonu yaptırabilirsiniz. Bazı firmalar ücretsiz olarak da bu işlemleri yapmaktadır. Destek bileti açarak sunucu optimizasyonu yaptırmak istiyorum yazarsanız yardımcı olacaklardır.

Temiz Kodlama veya Hızlı Tema

Sitemizi inşa ederken, özel yazılım kullanıyorsak mutlaka temiz bir şekilde kodlanması gereklidir. Gereksiz kod kullanımından kaçınılmalı ve yorum alanları eklenmemelidir. Büyük boşluklar, yorumlar vs eklendiği taktirde sitenizin açılış hızı yavaşlamaktadır.

Eğer wordpress kullanıyorsanız da tema satın almadan önce mutlaka sitenin demosunu hız testine sokun ve mobil hızı aşırı yavaş olan temaları tercih etmeyin.

Görselleri Sıkıştırma

Sitemizi kurduktan sonra ilk dikkat edilmesi gereken unsur da görsellerdir. Görseller oldukça büyük yerler kapladığı için site hızını yavaşlatabilir. Bu sebeple eğer WordPress kullanıyorsanız ShortPixel gibi bir eklenti kurarak bu problemi çözebilirsiniz. Ya da bir başka seçenek görsellerinizi TinyPNG, Resize Image gibi web sitelerinde sıkıştırarak yükleyebilirsiniz.

Görsel kalitenizden biraz ödün verseniz de site hızı sayesinde dönüşümleriniz artacaktır, endişeniz olmasın.

Diğer bir seçenek ise görselleri WebP gibi kaliteli ama daha optimize formatlara dönüştürmek. Eğer sunucunuz bu formatı destekliyorsa çok rahat edeceksiniz.

Cache Eklentileri

Özellikle WordPress sitelerin kurtarıcısı haline gelen tarayıcı önbellekleme eklentileri sayesinde site hızınızı gözle görülür düzeyde arttırabilirsiniz. Çoğu sunucuda ücretsiz kullanabileceğiniz, LiteSpeed Cache eklentisini öneriyorum kesinlikle. Tabi bunun yerine, WP Fastest Cache, WP Rocket gibi eklentiler de tercih edebilirsiniz. Benim önerim, sırayla hepsini kurup birer gün kullanıp performanslarına göre tercih yapmanız.

Cache eklentilerinin ayarlarını göstermek isterdim fakat her sitede farklı ihtiyaçlar olacağı için net bir şekilde bu ayarları yapın demek doğru olmuyor.

CSS ve JS Sıkıştırma

Bazı cache eklentileri css ve javascript sıkıştırma veya birleştirme işlemlerini yapsa da bazen yeterli gelmediği için manuel sıkıştırmalar yapmanız gerekebilir. Bu gibi durumlarda minifier sitelerinden bir tanesine girerek sıkıştırmak istediğiniz dosyayı basit bir şekilde işleme alabilirsiniz.

Ne işe yarar? Sıkıştırma işlemi, css ve js kodlarının aralarındaki boşlukları alarak daha hızlı açılmasını ve okunmasını sağlar.

Nasıl yapılır? WordPress siteleri hızlandırmak için css ve js nasıl sıkıştırılır diye soruyorsanız, tek yapmanız gereken Görünüm > Düzenleyici bölümünü açtıktan sonra temanızda ağırlık yapan js vs css kodlarını minifier sitesindeki alana yapıştırıp sıkıştırdıktan sonra tekrar temadaki kodlarla değiştirmek olacaktır. Mutlaka yedek alın. Aksi bir durumda geri çevirmeniz gerekebilir.

Lazy Load

Site açılışında görsellerin içerikten sonra yüklenmesini sağlayarak açılış hızını arttırmaya yarayan bir tekniktir. LiteSpeed Cache eklentisinin içerisinde bulunuyor kolayca aktifleştirebilirsiniz. Ya da başka bir eklenti ile Lazy Load kullanabilirsiniz.

Özel yazılım web sitelerini hızlandırmak için Lazy Load tekniğini kullanmak oldukça faydalı olabiliyor. Nasıl yapılacağı ile ilgili dökümantasyona aşağıdaki bağlantıdan ulaşabilirsiniz.

https://developers.google.com/web/fundamentals/performance/lazy-loading-guidance/images-and-video/

CDN Kullanma

Açılışta yapılan istekleri paralize etmek için CDN kullanımı da oldukça yaygın bir performans kriteridir. CDN kullanarak görsellerinizi 20 farklı sunucudan aynı anda çektirebilirsiniz. Bu sayede sunucunuz yorulmaz ve siteniz daha hızlı açılır. CDN’in asıl amacı sunucunun yükünü paylaşmaktır.

CloudFlare’in sunduğu ücretsiz CDN kurulumunu yaptım fakat ücretsiz sürümü olduğu için aşırı hız farkı yaratacağını düşünmüyorum. Ücretli sürümünü kullanarak güzel bir performans artışı yakalayabilirsiniz. Ücretsiz sürümü de ping hızı açısından oldukça faydalı oluyor.

Mobil Hız için AMP

AMP (Accelerated Mobile Pages ) Hızlandırılmış Mobil Sayfalar, Google’ın son dönemde oldukça önem verdiği bir teknolojisi, WordPress içinde de oldukça basit bir eklenti ile kurulumu yapılabiliyor.

Mobil sıralama sonuçlarında da AMP sayfaların üst sıralarda olma sebebi hızlı açılmasıdır. Google News için de olmazsa olmaz kriterlerden bir tanesidir.

Bonus: Site Ping Hızı 

https://www.bitcatcha.com üzerinden sitenizin ping hızını test edebilirsiniz. Sunucunuzun Google’ın botlarına ne kadar hızlı yanıt verdiğini öğrenerek iyileştirme çalışmalarınızı yapabilirsiniz. Bu testten A+ aldığınız taktirde google botlarının sitenizi daha çok ve daha çabuk tarayacağını düşünüyoruz.

Sitemi Nasıl Hızlandırdım? (Before & After)

Öncelikle sitemin WordPress altyapılı bir site olduğunu ve ücretsiz sunulan IonMag teması kullandığımı söylemeliyim. Tema açısından fazla avantajlı olmadığım için mobil hızımı AMP kullanarak arttırdım.

LiteSpeed Cache eklentisi ve CloudFlare ücretsiz CDN hizmeti kullanarak da site hızımı arttırmak için önemli adımları attım.

Görsel sıkıştırmak için bir eklenti kullanmıyorum. Bunun yerine tüm görselleri sıkıştırarak yüklüyorum. 70 KB üzeri tek bir görsel bile kullanmamaya çalışıyorum.

Ayrıca bu işlemler arasında yaptığım en önemli işlem ise paylaşımlı hostingten VDS sunucuya geçiş yapmak oldu. Sunucu değişikliği ve sunucu optimizasyonları tarafında bana destek Nosspeed firmasına teşekkür ediyorum.

Before / Siteyi Hızlandırmadan Önce

Aşağıdaki 5 görselde GTmetrix, PageSpeed, TestMySite ve BitCathca ile yapılan test sonuçları vardır. Bahsettiğim site hızı optimizasyonlarından birkaç tanesini yaparak bu değerleri hangi seviyelere çıkartacağımıza bakalım.

gtmetrix-site-hizi-once
mobil-site-hizi-once
pagespeed-masaustu-once
pagespeed-mobil-once
ping-test-once

After/ Siteyi Hızlandırdıktan Sonra

Kayda değer bir yükseliş yakaladık. Sitemiz şu anda 2.2 saniye gibi mükemmel bir sürede açılıyor. Siz de benim önerilerimi uygulayarak sitenizin performansını ve hızını arttırabilirsiniz.

gtmetrix-site-hizlandirma-sonrasi
mobil-site-hizi-sonra
pagespeed-masaustu-sonra
pagespeed-mobil-sonra
ping-test-sonra

14 YORUMLAR

Yorumunu Bırak

Please enter your comment!
Please enter your name here