2021’de WordPress Mobil Hızlandırma (Performans)

WordPress mobil hızlandırma 5
(Yazı Tipini Büyütün⏬veya Küçültün))

WordPress Mobil Hızlandırma yapmak için buradayız.

Mobilde web siteniz, hedef kitlenizle nasıl bağlantı kuracağınızın bir anahtarı olarak kabul edilir, yani çok önemlidir.

Peki web siteniz yeteri kadar hızlı değilse ?

şte bu yazı senin için, Web sitenizin özellikle mobilde yavaş olup olmadığını nasıl anlarsınız?

Bu web sitenizin mobil’i için optimizasyon hakkında başka sorular yaratır.

Mobilden erişen kullanıcılar için hız ve deneyimi neden önemsemelisiniz? Sitenizi mobilden hızlandırmanın yolları nelerdir?

Google, web sitenizin yüklenmesi 5 saniyeden uzun sürerse, ziyaretçilerinizin %90’lık kısmının sitenizden hemen ayrılacağını söylüyor Google bize bunu söylüyorsa elinde bulunan verilere dayalı olduğu için.

Gooogle Mobil Kullanıcı Yorumu
Google mobil kullanıcı yorumu

Ve web sitenizde trafik almak için çalışmalar yapıyorsanız, ziyaretçilerinizin içeriğinizle etkileşime girmemesi çok yazık olur.

Bu makalede içeriğinizi mobil cihazlar için optimize etmenin en iyi yollarını derleyeceğiz ve WordPress mobil hızlandırma için performans ipuçlarını aktaracağız.

Ziyaretçilerin kullandığı cihazdan bağımsız olarak herkes için site ziyaretlerinizi ve performansınızı nasıl kolaylaştıracağınızı açıklayıp göstereceğiz.

Birinci sınıf bir mobil kullanıcı deneyimi ve mobil sitenizin WordPress’te optimize ve erişilebilir olmasını sağlayacak.

Aşağıda bulunan kısaltmaları Google PageSpeed Nedir ? içeriğimizden inceleyebilir kısaltmaları öğrenebilirsiniz.

WordPress mobil hızlandırma işlemlerine başlayalım.

Mobil Sayfa Hızı Nasıl Test Edilir
Mobil hız testi – metrikler

📳 Mobil sayfa hızı nasıl test edilir :

Mobil site hızlandırma tekniklerini uygulamadan önce yapmamız gereken önemli şey, mevcut performansı ölçüp kaydetmektir.

Köklü ve kaliteli bir performans denetimi yapmak için Lighthouse Tekonlojisini kullanmalısınız.

Lighthouse, hem masaüstü hem de mobil için sitenizin performansına ilişkin önemli metrikleri incelemenizi sağlar.

Metrikler mobil ve bilgisayarda farklı olarak ele alınıp analizde gösterilir.

Mobil ve bilgisayarlarda performansı ölçmek için geliştirilen araçları deneyelim.

PageSpeed Insights herhangi bir URL’nin yükleme süresini ölçen ve detaylı olarak metrik sunan analiz eden SEO aracıdır.

WordPress mobil hızlandırma
Analiz skoru – Webitrik.com

WordPress mobil hızlandırma işlemlerinde önemli şeyler arasında bulunanlar metriklerdir sorunu çözmek için ilk önce metrikleri öğrenmek gerekir.

Mobil ve benzeri cihazlarda iyi bir sayfa hızı elde etmek için analiz göstergelerinizin aşağıdaki metrikler gibi olduğundan emin olun:

Metrikler – Ağırlıkİyi yeşil)Ortalama (turuncu)Kötü (kırmızı)
İlk Büyük İçerikli Boya – %100- 1.8 sn1,8 sn – 3 sn> 3s
Hız Endeksi – %100 -3.3 sn3,3 – 5,8 sn> 5,8 sn
En Büyük İçerikli Boya – %250 – 2,5 sn2,5 sn – 4 sn> 4 sn
Etkileşim Süresi – %100 – 3,8 sn3,8 sn – 7,2 sn> 7,2 sn
Toplam Yük. Engelleme Süresi – %300 – 200 ms200 – 600 ms> 600 ms
Kümülatif Düzen Kayması – %150 – 0.100.10 – 0.25> 0.25

sn : Saniye – ms : Milisaniye

Ayrıca, direkt Chrome tarayıcısından Chrome Geliştirme Aracı’nı kullanarak mobil performans metriklerini inceleyebilir kendi performans raporunuzu oluşturabilirsiniz.

Mobil raporunuzu başlatmak için aşağıdaki adımları izleyin:

  1. Web sitenize girin
  2. Üst menüden “geliştirici araçlarını” açın
  3. “Lighthouse” sekmesini seçin
  4. “Cihaz” bölümünün altındaki “Mobil” düğmesini işaretleyin
  5. “Rapor Oluştur” butonuna tıklayın.
Mobil site hızlandırma
Lighthouse – Chrome geliştirici araçları

GTMetrix web sitenizi mobil ve masaüstünde test etmenize yarayan ücretsiz teknik bir araçtır.

Ancak, mobil ve benzeri cihazlarda performansı kontrol etmek için bir GTMetrix PRO hesabına ihtiyacınız var.

Lighthouse tarafından desteklenmektedir, sayfalarınız için metrikler ve analizler oluşturur. Uygulanabilir öneriler açıklar.

GTMetrix Aracı
GTMetrix Aracı verileri – Webitrik.com

Web sitenizi birkaç farklı mobil cihazda kontrol etmek için PRO’ya geçmeniz sizin için faydalı olabilir.

GTMetrix Mobil Seçenekler
Mobil için test cihazları – GTmetrix
WebPageTest Aracı
WebPageTest mobilde test etme

Webpagetest, WordPress web sitenizdeki yavaş yüklenen sayfaları belirlemenize ve olduğunca hızlı ince ayar yapabilecek şekilde metrikler verir.

Web siteniz için güvenlik zaafiyetlerini gösteren ücretsiz bir araçtır.

Webpagetest, sitenizi birden fazla mobil cihazda test etmenize olanak sağlar.

Böylece WordPress mobil hızlandırma işlemleri hakkında teknik bilgiye sahip olursunuz.

WordPress Mobil Hızlandırma
Mobil test cihazları WebPageTest

Bir diğer WordPress mobil hızlandırma veya başka bir deyişle Web site hız testi aracına geçelim.

Sadece hız testi aracı deyip geçmemek önemli çünkü kaliteli bilgiler veriyor.

Lighthouse WordPress web sitenizi mobil cihazlarda ve birden çok cihazda test etmek için çok önemli bir araçtır.

Sitenizin Mobil versiyonunu ABD ve Avustralya’da hız metriklerini öğrenmek istiyorsanız bu çok önemlidir!

Hız testi metrikleri
Lighthouse metrikleri – WP Rocket

Tek yapmanız gereken bölge seçip raporu çalıştırmak dilerseniz çok sorulardan birine geçelim.

WordPress siteleri genelde neden yavaş olur ⬇⬇⬇

WordPress siteleri genelde neden yavaş olur (Genel Nedenler):

1. Mobil, masaüstünden farklıdır :

Fark 1 : Masaüstü işlemcisi ve akıllı telefon işlemcisi

Mobil işlemciler genellikle önce verimlilik sonra performans amaçlı tasarlanır.

Cep telefonları normal olarak bilgisayar işlemcilerinden daha zayıf olur ve CPU mimarisi daha zayıftır.

Bu yüzden mobil cihazlar bilgisayarlara göre daha fazla gecikme ile işlem yapar.

Konumuza gelirsek, WordPress mobil hızlandırma makalemizde mobil hızınız kesinlikle bizim anlattığımız işlemler ile artacak.

Fark 2 : Ağ hızı (İnternet hızı) Bir ağın bant genişliği bir bilginin bir noktadan diğerine aktarmasını etkiler.

Bu hız genellikle Megabit (Mbps) olarak ölçülür. Yüksek Mbps sayısı daha fazla trafik almanızı ve kullanıcıların sitenize daha hızlı girmelerini sağlar.

Ayrıca Mobil ağlar genellikle masaüstüne göre daha yavaştır.

2. Mobil cihazlar için optimize edilmiş görseller sunun :

WordPress web sitenizin yavaşlamasının nedenleri arasında görseller önemli rol oynamaktadır.

Özellikle mobil cihazlar için optimize etmek gerekmektedir. İçeriğinizin okunabilir kalması için mobil boyutlarına ölçülü olarak küçültülmesi gerekir.

Üst kısımda bulunan videodan görsellerinizi optimize edebilirsiniz, böylece mobil hızınız da orantılı olarak artar.

WordPress mobil hızlandırma yaparken en önemli konulardan birisi Mobil önbelleklemedir.

3. Mobil cihazlar için önbelleklemeyi etkinleştirin :

Web siteleri genellikle önbellekleme işlemleriyle hazır kodlar sunulur.

Bu nedenle sitelere giriş hızı artarak kullanıcıya daha iyi deneyim yaşatılır.

Kullanıcı okuduğu içeriğe girdiğinde içerisinde bulunan bağlantıları da önyüklemeli olarak tıkladığı için hızlıca diğer içeriğe erişir.

Bu sebeple mobil ve masaüstü için ayrı ayrı önbellekleme yapılmaktadır.

Mobil önbellekleme
WP Rocket eklentisinde mobil cihazlar için önbellekleme – Kaynak : WP Rocket Eklenti Ayarları

4. Kaydırıcılar, ön yükleyiciler veya animasyonlar kullanıyorsunuz :

Düzen veya tasarım bozukluğu ve özellikle mobilde yavaş yüklenen siteleri kullanıcılar beklemiyor.

Çok fazla Slider (Kaydırıcı) ve animasyon sayfaları yavaşlatır, SEO ve dönüşüm oranları gibi kullanıcı etkileşimlerini etkiler.

Google, ani bir düzen değişikliğinde sizleri cezalandırabilir, bu WordPress web sitesinde tema değiştirmek gibi örneklendirilebilir.

Ayrıca, Kötü bir CLS (Cumulative Layout Shift) puanı ile sizleri cezalandırabilir.

5. Çok fazla eklenti kullanımı :

Yeni eklentiler eklemek sitenizde bulunan veritabanı sorgularını, HTTP isteklerini etkiler.

Etkilemekten kastımız üst üste biner 1 eklenti sitenizden bilgi almak için verileri kullanıyorsa bir diğer eklenti de kullanmak zorunda.

Bu sebeple istekler ve sorgular arttığı için mobil ve masaüstü performans skorunuz düşecek siteniz yavaşlayacaktır.

6. Sitenizin mobil de yavaş olmasının diğer nedenleri :

Site düzeniniz, her web sitesinde bir temel bulunur bu temele göre sitenize girişlerde sonuç alırsınız.

Sayfanızda bulunan öğeler yüklenme sürelerini etkiler.

Yüklenecek çok öğe var ise, tarayıcının boyutları konumları ve bulması zaman alacaktır.

WordPress mobil hızlandırma işlemleri için teknik bilgileri aşağıda bulunan bölümden veriyor olacağız.

Etki kazanmak için okumaya devam edin

Ağır JavaScript kullanan siteniz var ise JavaScriptleri erteleyin.

Tabi ki ertelemeyi de denetleyin bazen yaptığınız işlemler sitenizde sorunlar çıkartabilir.

Diğer bir düşük performans sorunları ise:

Kullanıcıların yavaş interletleri, ziyaretçi oturumları, instagram beslemesi gibi harici hizmetler bunlara sebep olur.

Teknik işlemler beklediğinizi biliyorum aşağıda WP Rocket eklentisi kullananlar için ayarları göstereceğim.

Ayrıca:

WP Rocket eklentisi kullanmayanlar için ücretsiz bir site hızlandırma rehberi daha hazırlayacağım.

(Yakında! LiteSpeed Cache Ayarları)

Buradan WordPress site hızlandırma yazımızı okuyup gerekli işlemleri uygulayın.

Sitenizin hızını hem mobil hemde masaüstünde arttırmış olursunuz.

Hadi WordPress mobil hızlandırma işlemimizde teknik işlemlere geçelim. ⬇⬇⬇

WordPress mobil hızlandırma işlemi için yapmanız gerekenler :

Google PageSpeed Insights da mobil ve masaüstü skorunuzu yükseltmek için tüm teknikleri listeledik.

WordPress sitenizin mobil versiyonunda da çok fazla katkıda bulunacak kolay işlemler yapabilirsiniz.

Şimdi gelin performans optimizasyon sürecini inceleyip uygulayalım.

1. Duyarlı ve optimize edilmiş tema kullanın :

Duyarlı ne demek bilmiyorsanız çok kısaca açıklayalım, duyarlı aslında tüm cihazlar için kullanılabilir olmasıdır.

Mobil cihazlar tabletler masaüstü cihazlar için özel olarak kodlanır.

Ve tasarlanır bu sebeple tüm cihazlar için kullanılabilen bir siteye veya temaya duyarlı deriz.

WordPress mobil hızlandırma işlemlerinde kullandığınız temellere önem verin. Örneğin:

  • Temanız
  • Hostinginiz
  • Eklentileriniz
  • Optimizasyon Eklentiniz (Önbellekleme Eklentiniz)

En hızlı ve duyarlı temaları hazırladığımız makalemizi okuyarak siz de rahatça tema seçimi yapabilirsiniz.

WordPress mobil hızlandırma performansınıza katkıda bulacak temayı bulmalısınız.

İlk olarak yapmanız gereken kullandığınız temanın açıklamasına bakmak.

Açıklamasında duyarlı yazıyor ise duyarlıdır fakat yine de kontrol etmek gerekli.

Örneği Astra temasını kontrol edelim :

WordPress özelleştiriciden hemen sağ altta bulunan kısımdan kontrol edebilirsiniz:

WordPress Özelleştirici
Tema özelleştirici – Kaynak : Astra Teması

Sitenizin duyarlı olması hız için çok önemlidir.

Divi Temasını ile tasarımınızı mobil cihazdan oluşturabilirsiniz. Elementor’da her cihaz için boyutu, ayarlayabilir eklemeler yaparak düzenleyebilirsiniz.
OncbOfQ uOJlW8DJ4F9 iygVGRIl8 jMtOS6vm9oKgrBT8VPmPJ91YeQicr7AdPbl7sV8RvBMD2jio6RJQm50YNiKXDguGA1X4FadA iKzdv8ukRtvDRtVrd9ebsGSZmSAD8eDO=s0UQ6kDmsLtTEgvH10OqsXKQEzQAzMzhswAZeeJJJ3igeZTnJSlapQ6chFonshbLu1eCdTT OEaoJdRK eh6Hl9jM68l77A9vWsQe4cl6QxT8S1nPXHKIjhtaJur6iJEN dbWmiyg8=s0
  • Web sayfanızı oluşturabilir, temanızın size verdiği seçenekleri kontrol edin.

2. Mobil önbelleğe alma özelliklerini aktifleştirin :

Mobil önbelleğe alma, uygulama ve sunucuların üzerindeki yükleri azaltmak için kullanılan popüler bir tekniktir.

Ve performansınızı arttırmaktadır.

Bir uygulama veya web sitesinin hızlı optimize çalışabilmesi için önbelleğe almak işlemi yapması gerekir.

Önbellekleme eklentisi kullanın bknz : WordPress site hızlandırma

Önbelleğe alma işlemi yapılmazsa gelen veriye karşılık bir veriyi edinme (indirme) yapılması zorunda kalınır.

Mobil önbellekleme
Mobil Önbellekleme Temsili – Kaynak : Webitrikcom

Bu yüzden yavaş kullanımlardan kaçılmak için önbellekleme teknolojisi kullanılarak sonuçları dinamik olmak üzere kullanıcıya sunulur.

Bu sebeple hızlı ve kullanışlı olmaktadır.

3. Resimleri hem mobil için hem masaüstü için optimize edin :

Mobil cihazlar için optimizasyonu WebP ile yapın, WebP bir görüntü formatıdır ve Google tarafından geliştirilmektedir.

Görüntüler otomatik olarak boyutlandırıldığında daha fazla verim alarak WordPress mobil hızlandırma yapabilirsiniz.

Ayrıca görsel optimizasyonun faydasını bir örnekle gösterelim :

Görsel optimizasyon
Görsel Optimizasyon – Sıkıştırılmış ve Doğru boyutlanmış görsel karşılaştırması

Original image görselin orjinal boyutu, Compressed image görselin sıkıştırlılmış boyutu.

Compressed & Resized image ise hem sıkıştırılmış hem de yeniden boyutlandırılmış görselin boyutunu göstermektedir.

Böylece WordPress mobil hızlandırma işlemlerinde görsel optimizasyon yaparak ziyaretçilerinize daha iyi bir deneyim yaşatırsınız.

Orjinal Görsel Boyutu :Sıkıştırılmış Görsel BoyutuSıkıştırılmış ve Yeniden Boyutlanmış Görsel Boyutu
Çözünürlük : 1920 x 1080Çözünürlük : 1920 x 1080Çözünürlük : 800 x 450
Boyut : 517 KBBoyut : 377 KBBoyut : 70 KB

Fark gördüğünüz gibi.

webp optimizasyonunun farki
Kayıplı ve Kayıpsız Görsel (Sıkıştırma Optimizasyon) “WebP”

Üst görselde gördüğümüz üzere en iyi sıkıştırmayı WebP yapmakta.

Tabi ki bununla kalmıyor görsel sıkıştırılmış olmasına rağmen hem kaliteli hem düşük boyutlu.

  • WebP formatı, PNG ve JPG’den %25 daha küçük dosya boyutu sağlar – aynı kalitede
  • WebP formatı, (dosya boyutu nedeniyle) PNG veya JPG görüntü formatlarından daha hızlı yüklenir.

4. Resimlerinize ve videolarınıza “Lazy Load” uygulayın :

WordPress mobil hızlandırma yapmak için bütün teknikleri uygulamanız gerekiyor.

Sıradaki işlem Lazy Load işlemi bu işlemi bilmeyenler için çok kısa açıklayalım :

Bu dediğimiz Lazy Load işlemi tembel yükleme olarak görülüyor.

“Lazy Load” Tembel yükleme kullanılmayan bir sitede girdiğinizde bütün içerikler ve görseller yükleniyor bu sebeple daha yavaş oluyor.

Tembel yükleme kullanan siteye girdiğimizde ise siz aşşağıya kaydırdıkça içerikler ve görseller yükleniyor.

Bu sebeple daha hızlı gezinti yapılıyor ve girilen site daha hızlı açılıyor, bu optimizasyon SEO için yararlı ve faydalı.

Lazy Load
Tembel yükleme örneği – Kaynak: WebDev

Old threshold yazan kısımda indirme boyutunu görmekteyiz : 160 KB

New threshold yazan kısımda ise tembel yükleme kullanılmakta. Boyutu ise : 90 KB

Lazy Load genellikle optimizasyon araçlarında ve bir çok temada ana özellik olarak mevcut.

Etkinleştirilebiliyor, eğer yok ise bir önbellekleme eklentisi seçip sitenize ekleyip, kolayca uygulayabilirsiniz.

5. CDN ile Görüntü Teslimini Optimize Edin :

CDN bir içerik dağıtım ağıdır, CDN hizmeti veren şirketlerden bu hizmeti kullandığınız zaman.

Sizin içeriğinizi birden çok sunucusuna göndererek gelen ziyaretçinin konumu nerede ise onu en yakın sunucuya göndererek içeriği ona sunar.

WordPress mobil hızlandırma yapmak için İçerik Dağıtım Ağı kullanmak site performansınızı arttırır.

Kullanmak oldukça kolay ve etkilidir, SEO ve Performans için çok faydalıdır.

CDN hizmeti örneği
Örnek CDN

Üst kısımda gördüğümüz üzere kullanıcılar ve CDN ağının bağlantıları gösterilmekte mantık tam olarak gördüğümüz gibidir.

Örnek bir ücretsiz CDN kullanmak için cloudflare.com u inceleyebilirsiniz.

6. İlk Bayt Zamanını İyileştirin :

WordPress mobil hızlandırma işlemlerinde bir diğer işlem sunucuya giden işlemleri en aza indirmek.

ilk bayt zamani
Sunucu İstekleri ve Yanıt Süreleri

İlk bayt zamanı sunucuya giden işlemleri belirtir ilk bayt zamanını en aza indirmek için:

  • Hızlı Tema Kullanın
  • Gerekli Olmayan Eklentileri Kullanmayın
  • Kaliteli Hosting kullanın
  • Çok CPU kullanan eklentileri sitenizde kullanmayın

Üstte bulunan işlemleri yaptığınızda WordPress mobil hızlandırma işlemlerinde performansınız artacak.

Hosting seçiminizi düzgün yapmanız gerekli, sizlere şeffaf olan firmaları tercih edin.

Sunucu kaynaklarını inceleyin ve araştırın, sonradan pişman olmazsınız.

Ucuz diye Web Hosting alıp paylaşımlı (Birden fazla kişinin paylaştığı sunucu kaynakları) ile sitenizin performansını düşürmeyin.

Bunları yaptığınızda WordPress mobil hızlandırma işlemlerini başarıyla yapmış olacaksınız.

Bu işlemleri yaptığınızda performansınız şöyle olacak :

wordpress mobil hizlandirma 3
Google PageSpeed – Başarılı Metrikler – Kaynak : Webitrik

Sıkça Sorulan Sorular :

Web siteleri nasıl hızlandırılır ?

webitrik google test

Kaliteli hosting, seçimi yapın, Görselleri optimize edin, Önbellekleme işlemlerinden (Eklentilerinden yararlanın) CDN (İçerik Dağıtım Ağı) kullanın, Gereksiz JavaScript, HTML ve CSS kodlarını sitenizden temizleyin.

Site neden yavaşlar ?

gtmetrix araci

Siteniz kullandığınız hostinge ve trafiğinize bağlı olarak performans gösterir. Sunucu kaynakları yeterli olup çok eklenti kullanımı gereksiz kod kullanımı, gereksiz sunucu istekleri, yavaş temalar kullanımı sebebiyle siteniz yavaşlar.

Aklınızda kalan soruları yorumlarda sorabilirsiniz, sizlere yardımcı oluruz.

Total
1
Paylaşım
Bir cevap yazın

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

Önceki Gönderi
pagespeed insights nedir 5

PageSpeed Insights Nedir ? (Çözümlü Rehber) 2021

Sonraki Gönderi
Satoshi Nakamoto'nun Kaç Bitcoin'i Var ?

2021’de Satoshi Nakamotonun Kaç Bitcoin’i Var

İlgili Gönderiler