Kolay bir şekilde WordPress tema yapmak!
12 Şubat 2013

Sitenizi Hızlandırmak İçin İpuçları

Bu yazımızda site hızlandırmak artırmak için  ipuçları vereceğiz. Öncellikle sitenizi hızlandırmak ziyaretçilerinizin aradığı bilgileri bulup daha hızlı sonuca ulaşmasını sağlayacaktır. Ziyaretçiler tekrar sizin sitenizi kullanacaktır. Böylece Google sitenize iyi bir sıralama verecektir.

Site hızlandırma ipuçlarını çeşitli kategorilere ayırarak vereceğim size.

UYARI : Bu adımları uygulamadan önce sitenizin dosyalarını ve veri tabanını yedekleyin. Hiçbir şekilde sorumluluk kabul edilmemektedir.

  • Server

İlk adım olarak uygun hosting seçimi yapın. Sitenizin kodlama dili, gerekli olan alt özellere ve özellikle lokasyona dikkat edin. Türkiye hiti istenilen bir site yaparken Türkiye ve ya yakın bölgelerde bulunan dclerinden hosting satın alın.

  •  Ziyaretçilerinize Sitenizi Önbeleklleyin.

Sitenizin arabellekten yüklenmesi sitenizin hızına hız katacaktır. .htaccess ile sitenizin bu özelliğini kullanmasını sağlayabilirsiniz. Böylece siteniz daha hızlı açılacaktır.

Not:Sitenizin. htaccess özelliği destekleyip desteklemediğini hosting sağlayıcınız ile irtibata geçin.

.htaccess dosyanıza aşağıdaki gibi değiştirin.

<filesMatch “.(flv|gif|jpg|jpeg|png|ico|swf)$”>

Header set Cache-Control “max-age=7257600”

</FilesMatch>

# 1 HAFTA

<filesMatch “.(js|css|pdf|txt)$”>

Header set Cache-Control “max-age=604800”

</FilesMatch>

# 10 DAKIKA

<filesMatch “.(html|htm)$”>

Header set Cache-Control “max-age=600”

</FilesMatch>

# YOK

<filesMatch “.(pl|php|cgi|spl)$”>

Header unset Cache-Control

Header unset Expires

Header unset Last-Modified

FileETag None

Header unset Pragma

</FilesMatch>

  •  Gzip ile Sıkıştırmak 

Bir başka yöntem iste dosyalarınızı gzip sıkıştırma taktiği ile web sitelerinizi hızlandırmaktır.  Böylece siteler daha küöük boyutlu olup %60 oranla daha hızlı açılacaktır.

1. Yöntem .htacces ile bunu sağlayabiliriz. Aşağıdaki kodları kullanın.

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>

 

2. Yöntem php kodları ile de sıkıştırma sağlanabilir. Örnek kodlar aşağıdadır.

<?php if (substr_count($_SERVER[‘HTTP_ACCEPT_ENCODING’], ‘gzip’)) ob_start(“ob_gzhandler”); else ob_start(); ?>

 

3. Yöntemde eğer bir CMS  sistemi kullanıyorsanız zaten yazılmış olan eklentileri kullanabilirsiniz.

  •   Doğru Yere Yönledirin

Sitenizin mobil, tablet, bilgisayar gibi versiyonları olabilir. Bu yönlendirmeleri doğru yaparak 302 yönlendirmelerini kullanın. Böylece cep telefonları tablet gibi cihazlardan sitenize girenlere daha uygun bir ara yüze yönlendirerek daha sitenizin hızlı açılması sağlanabilir

 

  • CDN Servisi Kullanın

CDN (content delivery network) kullanarak site resimlerinizin çok daha hızlı yüklenmesini sağlayabilirsiniz. Böylece resimler İngiltere ve Türkiye ziyaretçiniz hemen hemen aynı anda resimleri görebilecektir. Bu servisi amazon.com, facebook.com gibi siteler örnek olarak incelenebilir. Bu servisi ilerleyen günlerde daha detaylı anlatacağım.

  • CSS, JS ve RESİMLER

  •  JS Kodları Optimize Edin

JavaScript kodları sitenizin görsellik, uygulamak… için vazgeçilmez bir kod ağı sunar. Ancak bunlar sitenizi yavaşlatır. Tabi JavaScriptler sitenizi hızlandırmak içinde kullanabilir. JavaScript dosyalarını harici olarak saklamak ve çağırmak daha mantıklı olacaktır. Örnek verilmek gerekirse genellikle js kodları aşağıdaki gibi html içine gömüler.

<script type=”text/javascript”>

Java kodları burada

</script>

Bunun bu kodlarını javakdolari.js gibi bir javascript dosyasına kayıt edip aşağıdaki gibi çağırabilir.

<script type=”text/javascript” src=”/javakodlari.js”></script>

Bu sayede siteniz daha hızlı açılmaya başlayacaktır. Buna ek olarak javascript kodları yazılırken yazılımcılar nerede ne yazdığını unutmamak için boşluklar ve açıklama satırları sunar. Bunları silmek sizin yararınıza olacaktır. Tabi ki sonradan düzenlerken sorun yaratabilir.

  • CSS Kodlarını Optimize Edin

Sitenizin tasarımını yaparken CSS kodlarını kullanırsınız. Bunu yaparken aynı JS kodları gibi CSS Kodları da html içine gömülür. Bu da sitenizin yavaşlamasına neden olacaktır. Örnek olarak aşağıdaki gibi kullanılır.

<style type=”text/css”>

Css kodları

</style>

Şeklinde  sitenizin hızı yavaşlayacaktır. Sitenizin hız kaybetmesine engel olabilmek için aşağıdaki gibi çağırmak daha mantıklı olacaktır. Kodları yine style.css olarak kayıt edin.

<link rel=”stylesheet” type=”text/css” href=”style.css” />

Yukarıdaki gibi çağırmak mantıklı olacaktır.

Tavsiye #1: Birden çok Css dosyası kullanmak yerine tüm CSS kodlarını tek stil dosyası içinde sunun. Böylece tüm kodlar tek bir stil dosyasında çağırılıp gereksiz kodlardan siteniz yavaşlamayacaktır.

  • Resim Optimizasyonu

Web site hızına etki eden bir diğer etkende resimlerin yüklenme hızıdır. Kodlarla(xhtml ve css) boyutları belirlenmemiş resimler ilk önce tam olarak çağırılır sonra gerçek boyutuna döndürülür. Bu işlem çok hızlı bir şekilde gerçekleşsede büyük ölçekli bir web sitesinde dakikalar sürebilir. Sitenizi hızına etki eden önemli bir faktördür.

  • İçerik Öğeleri

  • Bir karakter Grubu Belirtin.

Karakter grubu belirtmek tarayıcının sitenizi daha hızlı okumasına neden olacaktır. Bu da sitenizi hızlandıracaktır. Örneğin:

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>

Not: Bazı CMS sistemleri kendi php kodlarını kullanmaktadır.  Eğer tüm dilerde bir siteniz yoksa bunu kendiniz HTML kodu ile belirtin. Unutmayın ki tarayıcılar html ve css ile ziyaretçilerinize içerik sunuyor.

  •  Kodlarınızı Küçültün.

Genel olarak dedim ancak burada tekrar diyorum. HTML, CSS, JS kodlarınızdaki yorum satırlarını silin. Böylece kod oranınız küçülecek içerik oranınız artacaktır.  Buda SEO konusunda size bir + verecektir. Bu işlemleri yapabileceğiniz siteler ve eklentiler mevcuttur. Will Peavy minifier benimde kullandığım bir sitedir. WordPress kullanan  arkadaşlarımız Autoptimize  eklentisini kurabilirler.

  • Çalışmayan Linklerinizi Silin.

Çalışmayan linkleri silmeniz sitenizin isteklere cevap verme hızını artıracaktır.Böylece ziyaretçileriniz ve Google botları yanlış istekler yapıp gereksiz hata sayfalarıyla uğraşmayacaktır.  Bu sırada kullanabileceğiniz siteler:

http://www.brokenlinkcheck.com/

Kullanabileceğiniz WordPress Eklentisi:

http://wordpress.org/plugins/broken-link-checker/

 

Son olarak ;

Bir yazının sonuna daha geldik. Dilim döndüğünce size olayları anlatmaya çalıştım. Umarım bir çok arkadaşa yardımcı olabilmişimdir.  Bu işlemler sırasında site hızınızı ölçmeniz de yarar olacaktır.

 

http://www.webpagetest.org/ adresinden hata yapıp yapmadığınızı kontrol etmekte fayda vardır.

 

3 Comments

  1. Güncel Blog dedi ki:

    Teşekkürler. Çok yararlı bilgiler…

  2. OyunAdam.com dedi ki:

    Teşekkürler dostum, gayet bilgilendirici bir yazı olmuş : )

  3. Şifalı Bitkiler dedi ki:

    Peki stats javalarını ve google ads javalarını tek bir dosyada toplayabilir miyiz? Sonuçta onları da çağırıyor istemci… Nasıl yaparız?
    İkinci sorum ise wp plugins içerisinde bulunan css dosyalrını birleştirip tek bir dosyada nasıl yapabiliriz?

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir