WordPress Web Sitenizi Bugün Hızlandırmanın 16 Yolu!

Yayınlanan: 2014-12-31

Web sitenizi hızlandırmak, daha fazla trafik almanın ve daha fazla satış yapmanın garantili tek yoludur.

2010 yılında Google, site hızının arama sıralamalarını etkileyen 200'den fazla göstergeden biri olduğunu doğruladı. Verileri, sayfalar yavaş yüklendiğinde insanların daha az zaman harcadığını gösteriyor. Yine de çoğumuz web sitelerimizi daha hızlı hale getirmeye çok az odaklanıyoruz.

Belki de WordPress web sitenizin iç hız tetikleyicilerinde ince ayar yapmak çok göz korkutucu olabilir.

Yükleme sürenizi yarıya indirmeye ışık tutmak için Stavros Papadakis'i müşteri web sitelerini hızlandırma sürecini hazırlamaya davet ettik.

Yükleme süreniz 3 saniyeden fazlaysa veya sayfa boyutunuz 2 MB'ın üzerindeyse, bu hem satış kaybı hem de sunucu ücretleri açısından size paraya mal olan büyük bir sorun olabilir.

WebPageTest, GTmetrix, Google PageSpeed ​​Insights ve Pingdom gibi siteniz için yavaş yükleme sürelerine ve kötü kullanıcı deneyimine neden olan sorunları belirlemenize yardımcı olabilecek birçok ücretsiz çevrimiçi araç vardır.

Web sitenizin performansından nasıl sorumlu olacağınız aşağıda açıklanmıştır.

1. Sıkıştırmayı etkinleştir

CSS ve Javascript dosyalarınızı sıkıştırmak, tarayıcıların onları daha hızlı indirmesine yardımcı olur.

Gzip sıkıştırması, dosya boyutlarını 200+KB'den (sıkıştırılmamış) 40KB'nin (sıkıştırılmış) altına kolayca indirebilir. Sunucunuzda sıkıştırma etkin olduğu sürece bundan yararlanın.

Sunucunuzda sıkıştırmayı etkinleştirerek, kullanıcılarınızın hem masaüstü hem de mobil cihazlar için sitenizde ciddi bir hızlanma yaşayacağından emin olabilirsiniz.

Statik dosyalar için sıkıştırmayı etkinleştirmek için .htaccess dosyanıza aşağıdaki kod parçasını ekleyin.

AddOutputFilterByType DEFLATE uygulaması/x-httpd-php metni/php metni/html metni/düz metin/css metni/xml uygulaması/x-javascript metni/javascript uygulaması/javascript metni/x-js

BrowserMatch ^Mozilla/4 sadece gzip-text/html
BrowserMatch ^Mozilla/4\.0[678] gzipsiz
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Başlık ekleme Vary User-Agent

2. Resimlerinizi optimize edin

Bir web sitesini yavaşlatmanın ana suçlusu resimlerdir. Resimlerinizi (özellikle 50 KB'ın üzerindekileri) web sitenize yüklemeden önce daima optimize edin.

Bunları optimize etmenin en uygun yolu Photoshop veya başka bir görüntü işleme yazılımı kullanmaktır. %60'a varan görüntü kalitesiyle web için görüntüleri kaydedin.

JPG dosyaları için aşamalı görüntüler de kullanmalısınız çünkü görüntülerin aşamalı olarak işlenmesi daha sorunsuz bir kullanıcı deneyimi sağlar.

Lütfen aşağıdaki iki resmi kontrol edin, aynı görünüyorlar ancak soldaki optimize edilmemiş ve 80KB ve sağdaki optimize edilmiş ve sadece 18KB, 4 kat daha küçük.

Optimize Edilmemiş Görüntü - Oia Yunanistan Santorini

Optimize Edilmemiş Görüntü

Optimize Görüntü

3. Javascript dosyalarını alt bilgiye taşıyın

jQuery, Mootools ve Prototype gibi Javascript kitaplıkları, web sitenizin işlevselliğini artırdıkları için harika olsalar da, sayfalarınızın oluşturulmasını da engelleyebilirler.

Tarayıcılar, sayfanın başlığındaki tüm Javascript dosyaları indirilene kadar içeriği yüklemeye başlamaz.

Bu sorunu çözmenin kolay bir yolu, ilk sayfa oluşturma sırasında gerekli olmayan Javascript dosyalarınızı üstbilgiden sayfanın altbilgisine taşımaktır.

Wordpress kullanıyorsanız, komut dosyası çağrılarını temanızda header.php'den footer.php'ye taşıyabilir ve wp_enqueue_script işlevini her kullandığınızda true değerini dördüncü parametre olarak kullanabilirsiniz.

JS komut dosyalarını sayfanın alt bilgisine taşıyın

JS komut dosyalarını sayfanın alt bilgisine taşıyın

4. KeepAlive'ı etkinleştirdiğinizden emin olun.

Apache (düşük maliyetli barındırma şirketlerinde paylaşılan barındırma planları için en yaygın kullanılan sunucu), birden fazla HTTP isteği için bağlantıları açık tutan KeepAlive adlı harika bir "özelliğe" sahiptir.

Hosting şirketinizde KeepAlive'ın etkinleştirildiğinden emin olun.

httpd.conf dosyanıza erişiminiz varsa, içinde “KeepAlive On” olduğundan emin olarak KeepAlive'ı etkinleştirin, aksi takdirde .htaccess dosyanıza aşağıdaki kod parçasını eklemeniz yeterlidir.

 <ifModule mod_headers.c>
 Başlık seti Bağlantı canlı tutma
</ifModule>

Sunucunuz/siteniz için KeepAlive'ı etkinleştirin

Siteniz için KeepAlive'ı etkinleştirin

5. CSS dosyalarını birleştirin – Satır içi küçük CSS dosyaları

Tarayıcılar aynı anda yalnızca çok sayıda HTTP isteğini işler. Bu sınıra ulaşıldığında, bazı dosyalar indirilirken bazı dosyalar bekler.

Tüm CSS dosyalarınızı yalnızca tek bir CSS dosyasında birleştirerek sayfa çok daha hızlı oluşturulur.

2KB'den küçük CSS dosyalarınız varsa, fazladan bir HTTP isteği yapmak yerine bunları satır içine almalısınız.

Wordpress, Autoptimize ve Better WordPress Minify gibi CSS stil sayfalarınızı birleştirmenize ve hatta satır içi yapmanıza yardımcı olabilecek birkaç harika eklentiye sahiptir.

CSS dosyalarını birleştirin ve Satır içine alın

CSS dosyalarını birleştirin ve Satır içine alın

6. Önbelleğe almayı etkinleştir

Önbelleğe alma, sık sık değişmeyen sayfaların yüklenme süresini önemli ölçüde artırır.

Sitenizde önbelleğe almayı etkinleştirerek kodunuz aynı sayfayı tekrar tekrar oluşturmaz. Bu şekilde kullanıcı deneyimi çok daha iyidir ve sunucunuz daha fazla trafiği işleyebilir.

W3 Total Cache, WP Super Cache ve WP Fastest Cache, diğerlerinin yanı sıra sayfa önbelleğe alma, veritabanı önbelleğe alma ve nesne önbelleğe alma gibi farklı önbellekleme türleri sağlayan ücretsiz Wordpress eklentilerinin kısa bir seçimidir.

W3 Toplam Önbellek Wordpress eklentisi

W3 Total Cache eklentisi sayfa, DB ve nesne önbelleğe alma sağlar

7. Bir İçerik Dağıtım Ağı Kullanın

İster Wordpress, Joomla, Magento, Drupal gibi bir CMS, ister özel yapım bir PHP veya HTML sitesi kullanın, bir İçerik Dağıtım Ağı (CDN) yapılandırmanızı şiddetle tavsiye ederim.

CDN, internet üzerinden birden çok veri merkezinde konuşlandırılmış dağıtılmış bir sunucu sistemidir.
Bir müşteri sitenizi ziyaret ettiğinde, resimler ve CSS dosyaları gibi statik içerik, coğrafi olarak kendilerine en yakın sunucudan sunulur ve böylece çok daha hızlı oluşturulur.

Bu arada, bir CDN sayesinde sunucunuzdaki yük de önemli ölçüde azalır.

CloudFlare, diğerleri arasında ücretsiz bir CDN ve DNS sağlayıcısıdır. MaxCDN ayrıca sitenizin yükleme süresini optimize etmek için harika ve uygun fiyatlı bir seçenektir. İkisi de alabilecekleri kadar iyidir.

CloudFlare İçerik Dağıtım Ağı

CloudFlare ücretsiz bir İçerik Dağıtım Ağıdır

8. HTTP isteklerinin sayısını en aza indirin

Ne kadar çok HTTP isteğiniz olursa sitenizin yüklenme süresi o kadar yavaş olur.

Mümkün olduğunca az HTTP isteği yapmak için CSS dosyalarınızı birleştirin, Javascript dosyalarını birleştirin ve veri hareketli grafiklerindeki görüntüleri diğerleri arasında birleştirin.

Bir müşterinin sitesinde çalışırken, ana hedeflerimden biri, sayfa başına yüklenen HTTP isteklerinin sayısını en aza indirmektir.

HTTP isteklerini en aza indirin

HTTP isteklerinin sayısını azaltmak için CSS dosyalarını birleştirin, veri hareketli grafiklerini veya veri URI'lerini kullanın

9. Resimleriniz için doğru dosya türünü seçin

Varsayılan olarak JPG'yi kullanın. En küçük ve en hızlı yüklenen dosya türüdür.

PNG'yi yalnızca metin içeren görüntüler için kullanın (JPG, metni bulanıklaştıran rasterleştirir) veya şeffaf bir arka plana ihtiyacınız varsa.

Ağır GIF dosyalarını en aza indirin veya hatta ortadan kaldırın çünkü bunlar sitenizin yüklenme süresini önemli ölçüde yavaşlatabilir.

Aşağıdaki iki resim aynı görünse de aralarında büyük bir fark var. Soldaki png dosyası olarak kaydedilmiş ve 102 KB ağırlığında, diğeri ise 18 KB boyutunda bir JPG dosyası, bu doğru, 6 kat daha hafif!

PNG olarak kaydedilen resim

PNG olarak kaydedilen resim

Resim JPG olarak kaydedildi

Resim JPG olarak kaydedildi

10. 404 hatalarınızı düzeltin

İster inanın ister inanmayın, herhangi bir eksik dosya bir 404 HTTP hatası oluşturur ve sitenizin yüklenme süresini kesinlikle yavaşlatacaktır.

En hızlı yükleme süresini elde etmek için sayfalarınızın oluşturulması sırasında her zaman 404 hatası olup olmadığını kontrol edin.

"Şelaleniz" (tarayıcının sitenizi oluşturma şekli) böyle görünüyorsa (kırmızı satırlara dikkat edin), 404 hataları sitenizin yükleme süresini mahvediyor demektir.

404 Hataları Yükleme Süresini Mahvedebilir

404 Hataları Sitenizin Yükleme Süresini Bozabilir

11. Sayfa boyutunuza dikkat edin

Her sayfada çok fazla içerik görüntülemek cazip gelse de, sayfa boyutunuzu minimumda tutmaya çalışmalısınız.

Bu, cep telefonları için daha da önemlidir. 2MB'lık bir siteyi 3G bağlantısıyla mobil üzerinden yüklemek felakete davetiye çıkarıyor. Kullanıcıların bir sayfanın oluşturulması için 2-3 saniyeden fazla beklemeyi sevmediğini göz önünde bulundurun.

Yeni bir görsel siteye değer katar mı? Değilse, sitenize eklememelisiniz. Bu kadar basit.

Sayfa boyutunu küçült

Sayfa Boyutunu Küçült

12. Ölçek görüntüleri

Görüntüleri asla HTML'de anında ölçeklendirmeyin. Sayfalarınızda tam olarak kullanacağınız boyutlarda ihtiyacınız olan resmin küçük resmini oluşturun.

Örneğin, 1200 piksel x 675 piksel boyutunda bir görüntünüz varsa ve 480 piksel x 270 piksel boyutunda "ölçeklendirilmiş" bir sürüm kullanmak istiyorsanız, orijinal görüntünün yeniden boyutlandırılmış yeni bir sürümünü oluşturun ve bunun yerine onu kullanın.

Bu resim, HTML'deki resmin boyutlarını değiştirmek yerine, ölçeklenmiş bir küçük resim kullanarak resmin "büyük" bir versiyonuna bağlanır.

ölçekli-görüntü-küçük resim-genişliği-480

Küçük Resim (Ölçekli Resim) Büyük Boyutlu Resim Bağlantıları

13. Tarayıcı Önbelleğinden Yararlanın

Google, nadiren değişen öğeler için minimum bir hafta ve tercihen bir yıla kadar bir önbellek süresi önerir.

Tarayıcının önceden yüklenmiş bir dosyayı yeniden kullanıp kullanamayacağını belirleyebilmesi için, statik dosyalara (resimler, CSS ve Javascript) verilen tüm sunucu yanıtları için bir önbelleğe alma politikası belirleyin.

Bu genellikle, paylaşılan barındırma planları için bu kod parçacığını .htaccess dosyasına ekleyerek yapılır.

<ifmodule mod_expires.c>
Sona EriyorAktif Açık
ExpiresByType text/html "erişim artı 7200 saniye"
ExpiresByType resim/gif "erişim artı 864000 saniye"
ExpiresByType image/jpg "erişim artı 864000 saniye"
ExpiresByType image/png "erişim artı 864000 saniye"
ExpiresByType text/css "erişim artı 864000 saniye"
ExpiresByType metin/javascript "erişim artı 864000 saniye"
ExpiresByType uygulaması/javascript "erişim artı 864000 saniye"
</ifmodule>

14. Veritabanınızı optimize edin

Veritabanına dayalı bir siteniz (WordPress ve diğer tüm CMS tabanlı siteleri içerir) olduğu sürece, veritabanınızı optimize ettiğinizden emin olun.

Yavaş sorgular için kodunuzu izleyin. Bir VPS veya özel sunucudaysanız, sorgu önbelleğe almayı etkinleştirin ve veritabanı sunucusu yapılandırmanızı optimize edin.

Tam veritabanı optimizasyonu gerçekten zor ve zaman alıcı bir süreç olsa da, phpMyAdmin "tablolarınızı optimize ederek" size birkaç temel optimizasyon seçeneği sunar.

phpMyAdmin ile Veritabanınızı Optimize Edin

phpMyAdmin ile Veritabanınızı Optimize Edin

15. Hosting şirketinizi akıllıca seçin

Sitenizin ihtiyaçlarını karşılayan bir barındırma planı seçin.

Çoğu barındırma şirketi, paylaşılan barındırma planlarına sınırlamalar uygular ve ücretleri minimumda tutmak için sunucu başına yüzlerce siteye ev sahipliği yapar.

Ödediğini alırsın. Bir E-ticaret siteniz, yoğun bir CMS'niz, çok fazla trafik veya trafik artışınız varsa, paylaşılan barındırma planlarından kaçının.

Herhangi bir e-Ticaret WordPress sitesi veya trafik artışı olan herhangi bir WordPress sitesi için WPEngine tarafından yönetilen Wordpress barındırma şirketini şiddetle tavsiye ederim.

16. Bir uzman işe alın

Amacım, web sitenizin hızını optimize etmeye başlamanız için size yeterli bilgiyi vermektir.

Ancak bildiğiniz gibi, doğru yapmak önemli olduğunda bir uzman kiralamak en iyisidir.

Müşterilerimden biri, web sitesinin yüklenme süresini optimize etmek için benimle iletişime geçti. Web sitesi sayfalarının yüklenmesi uzun sürüyordu ve ziyaretçiler kullanıcı deneyiminin kötü olmasından şikayet ediyordu.

WordPress'i en son sürümüne güncelledim, web sitesini güvenilir bir barındırma şirketine taşıdım ve mümkün olan en iyi yükleme süresini elde etmek için hız optimizasyonu ayarlamaları yaptım.

Yükleme süresi 8,2 saniyeden 2,6 saniyeye çıktı. İlk bayt ve başlangıç ​​oluşturma süresi sırasıyla 0,147 ve 0,384 saniyeye düşürüldü ve HTTP istek sayısı 96'dan 78'e düşürüldü. Google PageSpeed ​​Insights da %88'e optimize edildi.

Hemen çıkma oranı birkaç hafta içinde yaklaşık %10 azaldı. Müşteri ve daha da önemlisi web sitesi kullanıcıları mutluydu ve siteyi sürdürmek harika bir deneyim oldu.

Özetlemek gerekirse, sitenizin yüklenme süresini optimize etmek, siz ve potansiyel müşterileriniz için bir kazan-kazan durumudur.

Kullanıcılarınızın süper hızlı yükleme süreleri görmekten ne kadar mutlu olacağını hayal edin!

Beni işe almak istersen seve seve yardımcı olurum. Portföyüme bakın ve bugün AwesomeWeb'de benimle iletişime geçin!

Çözüm

Siteniz daha hızlı yüklendiğinde her şey düzelir.

Google sizi daha üst sıralara yerleştirir. Kullanıcılar daha mutlu. Hemen çıkma oranları azalır. Dönüşüm oranları artar. Ve daha çok satış yaparsınız.

Trafik ve para kaybetmeyi bırakın. Sitenizin yüklenme süresini bugün optimize etmeye başlayın.

Bugün Gelir Günlüğü okuyucularına özel 497 dolarlık bir paket sunuyorum. Bu normal oranımın yarısı. Siteniz minimum niteliklerimi karşılıyorsa, bu gönderide listelenen her şeyle ilgileneceğim. Mesajınızda IncomeDiary'den bahsedin, kısa süre içinde sizinle iletişime geçeceğim. 2015'e sahip olabileceğiniz en hızlı web sitesiyle başlayın!

Beni buradan işe alın veya AwesomeWeb'deki diğer hız optimizasyonu serbest çalışanlarını buradan bulun.