Blogger Site ve Sayfa Yükleme Hızlandırma Geliştirmeleri

Arlina Design: Blogger Site ve Sayfa Yükleme Hızlandırma Geliştirmeleri 23.8.16
Blogger Blog Sitelerini Hızlandırma Teknikleri

Blogger sitelerinin veya internet üzerinde herhangi bir web sitenin yavaş yüklenmesi hem ziyaretçi kayıplarına hem de zaman kaybına neden olmaktadır. Böyle durumlarda ziyaretçilerin başka blog sitelerine yönelmesine neden olduğu gibi arama motorları tarafından da olumsuz bir durum ortaya çıkmaktadır. Çünkü blogunzun trafiği azalır durumda olacaktır.

Bir blog veya web site sayfalarının yavaş yüklenmesi için pek çok neden vardır. Bu nedenlerin en başında bozuk script veya kırık bağlantılar (link) yer almaktadır. Blogunuza yüklediğiniz içeriklerin fazla olması ve içeriklerle ilgili görüntülerin fazla olması nedenler de sayfalarınızın yavaşlamasına neden olmaktadır.

Blogger Yüklenme Hızı Geliştirmeleri

Blog sayfalarınızın yavaş açılması sorununu en aza indirmek için, aşağıdaki adımları takip edin;

1. Scriptler: Blog içeriklerinin yükleri (uzun içerikler) fazla olduğundan yüklenmesi zaman alabilir. Bu nedenle blogunuza bir komut dosyası içeren jQuery veya javasCript kodu ekleyin.

2. Backlinkler: Arama motorlarında blogunuzun bağlantıları listelemek veya bağlantılarının kaldırılması, bir arama motoruna backlink almak için blogunuzun bağlantılarını eklediyseniz sayfalarınızın yüklenmesinde yavaşlama olabilir.

3. Gatget'ler veya Widget'lar: Blogunuza eklediğiniz Gatget veya Widget içerisinde bulunan javaScript ve CSS kodlarının ağır dosyalar içermesi sayfalarınızın yavaş yüklenmesine neden olabilir. Eğer blogunuzda çok fazla Gatget veya Widget varsa ve blogunuz için çok önemli değilse gereksiz olan Gatget'leri veya Widget'ları blogunuzdan kaldırın. Blogunuzda en fazla 5 adet Gatget veya Widget eklemeye çalışın. Tabi bunların da sayfa yüklenmesine engel olmayacak kadar hafif olması gerekir. Google PageSpeed Insights sayfasını ziyaret ederek blogunuzu kontrol edebilirsiniz.

4. Layout: Eğer düzen sayfanızı özelleştirmediyseniz bu da yavaş yüklenme nedenlerinden biri olabilir. Blogunuzun düzen sayfasını özelleştirmek için gösterge panelinde bulunan Şablon > Özelleştir > Yerleşim sekmesine tıklayın. Gövde ve altbilgi düzenini değiştirin. Gerekli düzenlemeleri yaptıktan sonra Gatget'leri veya Widget'ları yeniden düzenleyin. Bu düzenlemeler blogunuzun yüklenme hızını artıracaktır.

5. Reklamlar (Üçüncü Taraf): Üçüncü taraf reklam kodlarını bloglarınıza eklemeyin, bu kodlar da blogunuzun yavaşlamasına neden olmak olmaktadır. Blog sitelerinizde Adsense gibi doğrudan reklam kodu olan reklamları ekleyin. Üçüncü taraf reklam kodları getirisi olmadığı gibi blogunuzun yavaşlamasına da neden olmaktadır. Google Adsense veya Infolinks reklam kodlarını blogunuza ekleyebilirsiniz.

6. Blogger Temalar (Templates): Blogunuzda kullandığınız şablonları güvenilmeyen sitelerden aldıysanız bu da blogunuzu yavaşlatabilir.Bu tür şablonların bir çoğu bu tür sorunlara yol açmasının nedeni kayıt dışı olmasıdır. Bu tür şablonları blogunuzda kullanmayın. Blogger tarafından desteklenen ve güvenilir sitelerden şablon alarak kullanabilirsiniz.

7. Görüntülerin Yüklenme Hızı: Yüklenmesi zaman alan tüm görüntüleri blogunuzdan kaldırın. Blogunuzda kullandığınız görüntüleri yavaşlatan ve hataları görmek için GTmetrix sitesindan faydalanabilirsiniz. Görüntülerin bağlantılarını kontrol ederek hatalı olanları değiştirebilirsiniz. Tüm görüntülerin hızlı yüklendiğinden emin olmak için tekrar tekrar test edin. Görüntülerinizin kalitesini etkilemeden optimize etmek için Optimizilla sitesinden faydalanabilirsiniz. Ben Compressor sitesini kullanıyorum.

8. Blog Sayfanızın Boyutu: Blogunuzun sayfa boyutları da blog hızını etkileyen unsurlardandır. Blog şablonlarını özelleştirmek için eklediğiniz kodlar nedeniyle sayfalarınızın da boyutu daartmaktadır. Buna ek olarak blog sayfalarınızın geniş olması da yüklenme hızını etkilemektedir. Blog sayfalarınızın boyutunu artırak unsurları önlemek için, blogunuzun gösterge panelinde bulunan Şablon özelleştirmeyi kullanarak genişlikleri varsayılan veya genişlikleri sıfırlayın seçeneklerinden bu ayarları yapabilirsiniz.

9. Blog Yayınları: Blogunuzun anasayfasında bulunan yayın sayısı ortalama 3-4 yayın olarak önerilmektedir. Eğer yayınlarınız çok uzun ve yüksek boyutta değilse anasayfanızda 7 yayın gösterebilirsiniz. Anasayfanızda 7 (yedi) ve üzeri yayın göstermeniz de blogunuzun yüklenmesini etkiler. Blogunuzun anasayfasındaki yayınların sayısını değiştirmek için Yerleşim > Blog Kayıtları (Blog Kayıtları gadget'ı) üzerinde bulunan Düzenle sekmesine tıklayın. Açılan sayfada Ana sayfadaki kayıt sayısı ile belirtilen yere anasayfada kaç yayın görünmesini istiyorsanız rakamsal olarak değer belirtin ve Kaydet butonuna tıklayın.

10. Küçük Ölçekli Görüntüler: Olabildiğince blog yayınlarınızda ve sayfalarınızda daha az görüntü eklemeye özen gösterin. Blog yayınlarınızda ise sayfalarınızın yavaşlamaması için küçük ölçekli görüntüler kullanın. yayınlarınızda bulunan metinlerin görüntülerden çok olması sayfa hızlarını etkilemez. Yayınlarınızın görüntüleri az metinleri fazla ise bu SEO açısından da önemlidir ve Google Adsense için blogunuz uygun hale gelir. Küçük görüntüler kullanmanız zaman açısından faydalıdır. Görüntüleri küçültmek için Picresize sitesini online olarak kullanabilirsiniz. Görüntülerinizi kırpmadan ve kalitesini düşünmeden küçük görüntü haline getirecektir.

11. Lightbox Görüntüler: Lightbox görüntüleri göstermek için blogger'da böyle bir seçenek yoktur. Lightbox görüntülerini göstermek için kullandığınız javaScript sayfanızın yavaş yüklenmesine neden olduğundan dolayı, lightbox görüntülerini durdurun veya buna neden olan eklentileri blogunuzdan kaldırın.

12. Lazy (Tembel) Görüntü Yükleme Eklentisi: Blogunuzun yavaş yüklenmesinin ana sorunu görüntülerinizin geç yüklenmesinden kaynaklanmaktadır. Yayınlarınızda metinlerden çok görüntü varsa blogunuz yavaş yüklenecektir. Görüntüler boyutları ve formatları nedeniyle yavaş yüklenir. Örneğin GIF görüntüleri jgep, TIFF ve png formatındaki görüntülere göre dah yavaş yüklenir. Blogunuzun hızını daha da artırmak için, blogunuza bir jQuery komut dosyası eklemeniz gerekir. Bu komut dosyası eklentisi özellikle çok fazla resim paylaşan (sanat, duvar kağıtları resim vs.) blogcular için çok yararlıdır. Şimdi bu eklentiyi blogunuza eklemek için aşağıdaki adımları takip edin;

Lazy Görüntü Eklentisini Bloga Ekleme

1. Blogger hesabınıza giriş yapın ve blogunuzun kumanda panelinizde bulunan Şablon > HTML'i Düzenle sekmesine tıklayarak şablon kodlarını açın.

2. Açılan sayfada klavyenizin CTRL+F kombinasyonunu kullanarak </head> kodunu bulun. Aşağıdaki komut dosyası script kodlarını </head> kodunun bir satır üzerine kopyalayıp ekleyin ve şablonu kaydedin. Değişiklikleri görmek ve blogunuzun hızını kontrol etmek için Google PageSpeed Insights sayfasını kullanabiirsiniz.

<script src='https://cdn.rawgit.com/jquerycods/lazy/master/lazy.js' type='text/javascript'/>

13. Satır içi CSS Kodları: Blogunuzun şablon kodları ve blog içeriklerinde bulunan tüm satır içi kodları kaldırın. Tüm satır içi kodları <head> kodları içerisinde <style> kodları içerisine ekleyin. Çünkü blogunuzun yavaşlamasının en büyük nedeni satır içi kodlardır.
CSS kodları <head> kodları içerisine ekleme örneği;

<style>
Örnek CSS kodu bir {background:#000; color:#fff; padding:5px;}
Örnek CSS kodu iki {background:#000; color:#fff; padding:5px;}
Örnek CSS kodu üç {background:#000; color:#fff; padding:5px;}
Örnek CSS kodu dört {background:#000; color:#fff; padding:5px;}
</style>
</head>

Tüm satır içi kodları kaldırın ve yukarıdaki örnek kodlar şeklinde düzenleyin. Satır içi CSS kodları nasıl bulunur? Örnek satır içi CSS kodları aşağıdaki gibidir;

<div id="blogger" style="padding:5px;width:300px;position:absolute;top:5px;left:100px;height:100px;"/>

14. Javascript Kodları Küçültme (Minify): Blogunuzda bulunan javaScript kodları sıkıştırarak boyutları küçültün. Diğer kodlar gibi bu kodlarıda <head> kodları arasına ekleyin. Sıkıştırılmış javaScript kodları blogunuzun daha hızlı yüklenmesini sağlayacaktır. Blog sayfalarını hızlandırmak ve javaScript kodları sıkıştırmak için HTMLCompressor sitesinden faydalanabilirsiniz.

NOT: Burada şunu size açıklamak istiyorum. Blogger sitelerinde kullanılan javaScript kodlarının %90'ı zaten sıkıştırılmış durumdadır. javaScript kodlarını sıkıştırmanız çok büyük boyut küçültmeleri gerçekleştirmez. Hatta bazı javaScript kodlarını sıkıştırlma esnasında boyutlarının arttığını bile görebilirsiniz.

15. Depolama için Dış Kaynaklardan Faydalanma: Blogunuzda bulunan çok büyük javaScripts ve CSS kodlarını saklamak için githud, pastebin, sourceforge vs gibi dış kaynaklarını kullanabilirsiniz. Böylece blog şablonunuzun boyutu azaltarak blogunuzun daha hızlı yüklenmisini sağlayabilirsiniz. Google Drive'ı da harici sürücü kaynak olarak kullanabilirsiniz. Fakat Google Drive diğer dış kaynaklara göre daha yavaş çalışmakta ve blogunda yavaş çalışmasına neden olmaktadır. En iyi harici dış kaynak sürücüsü olarak githud ilk sırada yer almaktadır.

Githud ile Js, CSS ve HTML Doysaları Nasıl Barındırılır? - Bu yazımızı okuyarak githud üzerinde Js, CSS ve HTML kod dosyalarınızı barındırabilirsiniz.

Etiketler: Blogger Site Hızlandırma, Blog Hızını Artırma, Blog Hızını Artırma Ayarları, Blogger Yardım, Blog Hızlandırma

Yorum Gönderme